Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationEventAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
7
Help us understand the problem. What are the problem?

More than 1 year has passed since last update.

Roots -Sage 9.0.0-alpha.4をいじった時のメモ

wordpressテーマ、roots・sage
何気に個人的には、一番使いやすいバージョン使用する時のメモ。
sage

要件

  • PHP >= 5.6.4
  • Composer
  • Node.js >= 6.9.x
  • Yarn

インストールする場所に移動して
your-theme-nameはテーマ名に変更

# @ app/themes/ or wp-content/themes/
$ composer create-project roots/sage your-theme-name dev-master

ヴァージョン変えるときは...
https://github.com/roots/sage/releases/

$ composer create-project roots/sage your-theme-name 9.0.0-alpha.4

テーマファイル

@ themes/your-theme-name/
$ yarn

assetsにあるconfig.jsonの書き換え

devUrlをサイトのurlに
"devUrl": "https://project-name.dev",
publicPathにテーマのパスを
"publicPath": "/wp-content/themes/sage"

ビルドコマンド

//ファイルが変更されたときにアセットをコンパイルする、Browsersyncセッションを開始する
$ yarn run start 

//assetsディレクトリのファイルをコンパイルして最適化する
$ yarn run build
//圧縮
$ yarn run build:production

よく触るところ

└── assets
    ├── config.json
    ├── scripts
    │   └── main.js
    │
    ├── styles
    │   ├── main.scss
    │   └─── commom
    │        ├── _global.scss
    │        └── _variables.scss
    ├── templates
    ├── functions.php
    └── src
         ├── admin.php
         ├── filters.php
         ├── helpers.php
         └── setup.php

main.js

jsファイル読み込む時など

main.scss

scssを読み込む時

global.scss

書き込む時

_variables.scss

bootstorapなどの変数定義

srcフォルダ

ウィジットや初期設定の定義のファイルがある


上書き用

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
7
Help us understand the problem. What are the problem?