子テーマを作ってみる話

どうもこのサイトにばっちりとくるテーマがなくて、そろそろ有料にするかな、と思う今日この頃です。

日本の方の作成された使い勝手の良いテーマは幾つかありますけれども、それは他で使っているもので、いっそ、Automaticc謹製のテーマの方がいいくらいなので、TwentySixteenです。

ただ、これでは使い勝手が悪く、多少いじりたいです。ただし、Twentyシリーズのアップデートの頻繁さときたら、もう。だからこそ安心して使えるのでしょうけれども、コードをいじると、大変なことに。

それで、子テーマを作ることにしました。

3ステップで子テーマが作れる

  1. 子テーマフォルダーをつくる
  2. style.css&functions.phpファイルを作る
  3. コピペ

です。簡単でした。ただ、疑問点もあったので、それについても書いておきます。

子テーマフォルダーを作る

今回はTwentySixteenの子テーマです。

私はFTPソフトは使わないので、レンタルサーバーから直接入ります。
ドメイン下、wp-contentというフォルダーの中にthemesというフォルダーがあります。

この中に各テーマが収納されています。

ここに新規に子テーマフォルダーを作成します。
今回の名前はtwentysixteen-child としました。「このファイルは何だ」というのがわかれば大丈夫。

子テーマフォルダーの中に、ファイルを二つ

次は、子テーマフォルダーの中に、ファイルを二つ作ります。

  • style.css
  • functions.php

まだ何も書かなくていい。

コピペ

style.css

まずはstyle.cssにコードを書きます。
/*
Theme Name: Twenty Sixteen Child
Theme URI: http://example.com/twenty-sixteen-child/
Description: Twenty Sixteen Child Theme
Author: John Doe
Author URI: http://example.com
Template: twentysixteen
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
Text Domain: twenty-six-child
*/

Codexからコピーしてきて、FifteenのところをSixteenに変えただけです。
子テーマ

ここで疑問だったのは、「Theme URI: http://example.com/twenty-sixteen-child/」の部分です。

これに関しては、そのままで作ってみて動いているので、特に自分のドメインを入れる必要はないのではないかと思いました。必要なのは、Theme Nameと元のTemplateだけなのかしら。

functions.php

次もコピペ。

add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles’ );
function theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css’ );
wp_enqueue_style( 'child-style’,
get_stylesheet_directory_uri() . '/style.css’,
array('parent-style’)
);
}

もちろん、phpなので、<?php ではじめて、 ?>で締めてください。

codexには上記だけあるので・・・。

テーマを見るとできてるよ!

WordPressに入って、テーマをみてみると、できてますねえ。

20170823160701

すごく嬉しかったです。

いじりたいファイルはコピペ

いじりたいファイル(content-single.phpなど)は、親テーマからコピペして、そしていじれば終了です。

とても便利です。

Related posts