WordPress子テーマテンプレートの配布とインストール方法のトップイメージ

WordPress子テーマテンプレートの配布とインストール方法

公開日 / 更新日

WordPressにおいて、テーマのテンプレートファイルの直接編集は、テーマ更新のタイミングで編集内容が上書きされてしまうので、有効化中のテーマを「親テーマ」とし、「子テーマ」を作成しそちらを編集することでテーマ更新による上書きを避けることができます。
CSSのみの編集であれば管理画面左側メニュー「外観 > カスタマイズ > 追加CSS」のページにあるテキストエリアにCSSを記述すれば大丈夫です。

このページでは当サイトで販売しているテーマ「Twentyfour Seven」の子テーマテンプレートの配布とインストール方法を載せています。
別テーマで使用する場合は一部コードの書き換えが必要なので、そちらも説明しています。

子テーマテンプレートのダウンロード

こちらからダウンロードしてください 「twentyfourseven_child.zip

子テーマテンプレートの中身

中身は

  • functions.php
  • style.css
  • templates > single_item.php
  • screenshot.png

です。「templates」フォルダと「screenshot.png」は「Twentyfour Seven」用なので、別テーマの場合は消して大丈夫です。

「functions.php」と「style.css」の中身はそれぞれ

<?php 
function tfs_child_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'));
}
add_action( 'wp_enqueue_scripts', 'tfs_child_theme_enqueue_styles' );
?>
/*
Theme Name: Twentyfour Seven Child Theme
Template: twentyfourseven
Theme URI: https://mainichi-web.com/twentyfour-seven/
Description: Twentyfour Seven Child is the Twentyfour Seven Child Theme.
Author: MAINICHI WEB
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentyfour-seven
Tags: welcart,e-commerce
*/

「functions.php」は、親テーマと子テーマの「style.css」を読み込んでいます。別テーマに使用する場合でもこのままのコードでOKです。
(関数名tfs_child_theme_enqueue_stylesの部分くらいは変えてもいいかも)

「style.css」は親テーマに合わせて変更する必要があります。
2行目と3行目以外は消して大丈夫です、2行目「Theme Name:」の右側は子テーマのフォルダー名、3行目「Template:」の右側は親テーマのフォルダー名に変更しましょう。

子テーマのインストール方法

通常のテーマをアップロード&有効化する方法と同じです。
親テーマがインストールされている状態で行いましょう。

  1. 管理画面の左側メニューから「外観 > テーマ」と移動します。
  2. 「新規追加」をクリックし、「テーマを追加」画面で「テーマのアップロード」をクリック。
  3. アップロード枠が表示されるので、ダウンロードしたテーマ(ZIPファイル)を選択し「今すぐインストール」をクリック。
  4. アップロードが完了後「有効化」をクリックで完了です。

子テーマでのカスタマイズ方法

親テーマと同じ名前のテンプレートファイルが子テーマにある場合、子テーマのテンプレートファイルが優先して適用されます。
なので、編集したいテンプレートファイルをFTPソフト等を使って子テーマフォルダ内にアップロードするか、子テーマをインストールするタイミングでフォルダに入れておくといいかと思います。

ウェルカート対応テーマのトゥエンティフォーセブン

Welcart対応テーマ「Twentyfour Seven」

販売価格 29,700(税込)

WordPressでオンラインショップを構築できるプラグイン「Welcart」向けに開発されたテーマです。

共有ボタン
Facebook Twitter LINE
関連キーワード
|
関連アーカイブへの矢印Twentyfour Seven/WordPressの関連アーカイブ
購入したWordPressテーマのインストール方法

購入したWordPressテーマのインストール方法

「TwentyfourSeven」の場合、テーマをインストールする前にカートプラグイン「Welcart」をインストールします。他のテーマの場合は、テーマのインス...

プラグイン「Connect Products with Shopify 」でShopifyとWordPressを連携させる方法

プラグイン「Connect Products with Shopify 」でShopifyとWordPressを連携させる方法

Shopifyの全商品を取得して、WordPressにカスタム投稿として自動登録するプラグイン作成しましたので連携方法をご紹介します。こちらのプラグインはWor...

WordPressテーマをオリジナルプラグインでカスタマイズする方法

WordPressテーマをオリジナルプラグインでカスタマイズする方法

WordPressにおいて、親テーマの直接編集はテーマが更新された際に上書きされてしまうので、テーマのカスタマイズは「子テーマ」を使うか「プラグイン」がおすすめ...

Welcart対応テーマ「Twentyfour Seven」でヘッダーメニュー項目を変更する方法

Welcart対応テーマ「Twentyfour Seven」でヘッダーメニュー項目を変更する方法

当サイトで販売しているWelcart対応テーマ「TwentyfourSeven」のヘッダーメニュー項目のカスタマイズ方法について紹介します。部分的に他のテーマで...

Welcart対応テーマ「Twentyfour Seven」でフッターメニュー項目を変更する方法

Welcart対応テーマ「Twentyfour Seven」でフッターメニュー項目を変更する方法

当サイトで販売しているWelcart対応テーマ「TwentyfourSeven」のフッターメニュー項目のカスタマイズ方法について紹介します。「外観>メニュー」で...