WordPress

WordPress4.7.3★子テーマの作り方(Twenty Seventeen の場合)

投稿日:

Wordpress

 

子テーマは、少なくとも 1つのディレクトリ(子テーマディレクトリ)と、2つのファイル(style.css と functions.php) から構成されます。以下を作成する必要があります。

 子テーマディレクトリ
  style.css
  functions.php

 

(1)子テーマディレクトリの作成。

wp-content/themes ディレクトリ下に作成します。

子テーマディレクトリの名前は自由につけても構いませんが、親テーマがある場合は最後に ‘-child’ を付けておくとわかりやすいです。また、子テーマディレクトリの名前には空白を含めないこと。エラーが発生します。 


(2)子テーマのスタイルシート (style.css) の作成。

スタイルシートは次のスタイルシートヘッダで始める必要があります。
 WordPress に「テーマ」として識別させ、有効なテーマとして他のインストール済みテーマとともに「管理画面 > 外観 > テーマ」画面に表示させるために必要なものです。

 

内容の詳細は下記の通り。
よくわからないところは空白にして作業を進めましたが、子テーマとして認識してくれています。

/*
Theme Name: 子テーマの名称
Theme URI: 子テーマフォルダのある場所
Description: テーマ詳細
Author: 制作者名
Author URI: 制作者のアドレス(あれば) 
Template: 親テーマのディレクトリ名←これは必須!!正確に!
Version: 1.0.0←自分で更新数がわかるようにしておくと便利
License: 
License URI: 
Tags:テーマの特徴をタグ (Tags) として指定することで、管理画面の「テーマのインストール」の特徴フィルターを使った検索に反映されます。
使用可能なタグのリストはテーマディレクトリ /enの「feature Filter」の検索項目 をご覧ください。
Text Domain: 

*/

 

(3)functions.phpの作成

「functions.php」を作成して、スタイルシートやjavascriptなどを読み込みます。

親テーマからCSSを読み込むコード

 

これで親テーマの「style.css」を読み込みます。
子テーマの「style.css」は親テーマを上書きするので、変更したい箇所や追加したい部分だけ子テーマに設定すればサイトに反映されていきます。

 

参照:「WordPress Codex 日本語版」https://wpdocs.osdn.jp/子テーマ

 

つくった子テーマにサムネイル画像を設定する方法はこちら





-WordPress

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

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

関連記事

WP★フロントページの画像の高さを変更する★Twenty Seventeenをカスタマイズ06

フロントページの画像の高さを変更する 1)管理者としてログインし、ダッシュボード左サイドのメニューから「外観」>「カスタマイズ」へ移動します。 2)メニューから「追加CSS」をクリックし、下記のコード …

WordPress|Twenty Nineteen トップページを固定ページにする

WordPressのダッシュボードから「外観」>「カスタマイズ」を選択。 「ホームページ設定」を選びます。 「ホームページ」と「投稿ページ」の2つに固定ページを割り当てます。 「+新規固定ページを追加 …

WordPrss★テンプレートを投稿記事ごとに替える

このページのもくじ テンプレートを投稿記事ごとに替える今までの方法新しい方法 テンプレートを投稿記事ごとに替える 固定ページは、phpファイルを作っておけばテンプレートとして選べるようになるけれど、投 …

WordPress★子テーマのURLを取得するには?

このページのもくじ 子テーマの ディレクトリの URI を取得するには?使い方その他、URL、URI パスを取得/出力する関数 子テーマの ディレクトリの URI を取得するには? WordPress …

WordPress★ログイン画面をカスタマイズする

ログイン画面のカスタマイズでつまずいたので、その時のメモ。 英語のサイトですが本家WordPress.orgのCodexにその解説があります。 https://codex.wordpress.org/ …

サイト制作・グラフィック制作をしているデザイナーです。制作で躓いたことの備忘録としてこのブログを始めました。
たくさんの検索結果から、実際に何度も何度も自分で試してみて、自分に合うなと思った方法やうまくいった方法をこのブログに書き留めています。
プログラム関係のことはもっぱらコピペ派。
自分でゴリゴリ書くことはできません。。。プログラムが分かる人がうらやましいです。
そんな私でもなんとかサイト制作ができるのはグーグル先生と貴重な情報をおしげもなく公開してくださっているたくさんの方々のおかげ。
有志のみなさまに日々感謝しつつ制作させていただいています。

メタ情報