HomeMadeGarbage Loading

WooCommerce : Storefront の子テーマを作成

お母ちゃん  2018.11.4 
ホーム
電子工作
Raspberry Pi
IOT
音楽
Home > Web > WordPress > WooCommerce : Storefront の子テーマを作成
すき 0
うんこ 0

Storefront の子テーマを作成しました。

Storefront の子テーマについて

公式サイトでおしゃれな子テーマも販売されています。
Storefront Themes – WooCommerce

無料のものもあるようです。

表示側はちょこちょこ自分でカスタマイズしていきたいと思ったので新規で子テーマを作成することにしました。

子テーマ作成

ディレクトリ作成

WPのテーマディレクトリに、storefront-child ディレクトリを作成します。

フォルダ名は違うものでも問題ありませんが、storefrontの子テーマであることが分かりやすい名前をつけました。

ファイル作成

作成した storefront-child ディレクトリの中に、下記の2ファイルを作成します。

  • style.css
  • functions.php

style.css 

style.css に下記を記述して保存します。

  • Theme Name:テーマ一覧に表示される名前でなんでも良い
  • Template:親テンプレートを指定

functions.php

functions.php は空のままでも大丈夫です。

これで storefront の子テーマが作成出来ました。

テーマ適用

WP の外観 > テーマ を確認すると作成したテーマが表示されています。

「ライブプレビュー」で問題無いことが確認出来たら「有効化」します。

これで storefont 子テーマが適用されました。

カスタマイズする際は storefront のテーマではなく、子テーマの方で変更していきます。
( storefront の header.php に変更を加えたい時は、storefront/header.php を 子テーマ内にコピーし、子テーマの header.php に変更を加えるようにします。)

コメントはこちらから

メールアドレスが公開されることはありません。コメントのみでもOKです。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください