【ワードプレス】ライトニングの子テーマを3分で設定する方法

LINEで送る
Pocket

タイトル

こんにちは! るーしーです。

 

今回は「WordPress(ワードプレス)のテーマLightning(ライトニング)の子テーマを3分で設定する方法」についてです。

むしろ今まで手を付けずにいてすみません。

 

今回調べてみた所、Lightning(ライトニング)を作っている株式会社ベクトルさんLightning(ライトニング)のホームページで「子テーマ」の素材を一式配布しておりました。

有難く使わせていただこうと思います。

 

勿論今回も【初心者向け】で簡単に出来る手順なのでぜひ試してみてください。

スポンサーリンク

 

「子テーマ」とは

説明

ざっくりとした説明になりますが、

「子テーマ」は親テーマの設定を引き継ぎ(継承)ます。

 

そのため、(設定以外)何も定義されていない「子テーマ」を使用しても親テーマの定義はそのまま使用出来ます。

継承説明

 

「子テーマ」を使うメリット

メリット

「子テーマ」へ(デザイン等の)独自の設定をする事が出来ます。

 

もちろん親テーマにも出来ますが親テーマがアップデートされると独自に追加した設定は全て無くなってしまいます

開発者側から見ると皆さん一人一人がカスタマイズした部分を把握したり管理するすべがないので仕方ありませんね。

アップデート説明

 

ですので、カスタマイズなど変更点は「子テーマ」で管理する事により親テーマがバージョンアップされた場合でも変更点を保持出来ます。

保持の説明

スポンサーリンク

 

「子テーマ」の設定手順

手順

では実際に「子テーマ」の設定手順を紹介していきます。

 

前提

・WordPress(ワードプレス)のテーマはLightning(ライトニング)を使用している事

 

「子テーマ」素材をダウンロード

1:株式会社ベクトルさんの「子テーマ」ダウンロードページへ


ダウンロードはこちら

2:子テーマカスタマイズサンプルをダウンロード

「lightning_child_sample_v_0_1_2.zip」がダウンロードされます。

保存場所はとりあえずデスクトップとかでOKです。

ダウンロードファイル

 

「子テーマ」素材の使用準備

手順

ダウンロードしたサンプルファイルを使用する準備をします。

実はこのまま使うと「子テーマ」の名前がサンプルのまま表示されあまり美しくありません。

 

1:「lightning_child_sample_v_0_1_2.zip」を解凍

・解凍前
ダウンロードファイル

ダブルクリックで解凍されます。

・解凍後
解凍後

2:解凍したフォルダを開く

・中身
1:_module_loop_event.php
2:_sidebar-event.php
3:functions.php
4:style.css

中身

3:「style.css」を開く

開くファイル

開くとこのような記述がされています。

開いたファイル

4:「style.css」の「Theme Name」を編集

・編集前
「 Lightning Child Sample」

編集前

・編集後
「 Lightning Child」

編集後

 

これでWordPress(ワードプレス)の管理画面上でも「Lightning Child」と表示されます。

その他の表示をさせたい場合はここに表示させたい内容を記述してください。

5:「style.css」を保存して閉じる

保存

6:フォルダ名を変更する

・変更前
「lightning_child_sample」

解凍後

・変更後
「lightning_child」

フォルダ名変更後

7:「lightning_childフォルダをzipファイルに圧縮する

圧縮

厳密にいうとWordPress(ワードプレス)の管理画面表示にこのファイル名は関係ありません。

しかしFTPソフト等でこのファイルが保存される場所を見るとファイル名まで見えますので「sample」と付いているとあまり良く無いです。

 

これで「子テーマ」素材の使用準備は完了です。

スポンサーリンク

「子テーマ」を有効化する

有効化手順

WordPress(ワードプレス)の管理画面から素材のアップロード~有効化まで説明します。

 

1:WordPress(ワードプレス)の管理画面にログイン

http://(ドメイン)/wp-admin

2:「外観」→「テーマ」をクリック

テーマ選択

3:「新規追加」をクリック

新規追加

4:「テーマのアップロード」をクリック

アップロード

5:「ファイルを選択」をクリック

ファイル選択

6:「lightning_child.zip」を選択し「開く」をクリック

開く

7:「今すぐインストール」をクリック

インストール

インストールが完了するとこのような画面が表示される。

完了画面

8:「有効化」をクリック

有効化完了

「新しいテーマを有効化しました。」と表示されればOK。

完了

 

以上で「子テーマ」の設定は完了です。

お疲れ様でした!!

 

WordPress(ワードプレス)の管理画面「外観」→「テーマの編集」を見ると「lightning_child」が出来ています。

子テーマ

親テーマの「style.css」にカスタマイズを記述していた場合は「子テーマ:lightning_child」の「style.css」に書き換えましょう。

 

【関連記事】
見やすいと思いませんでしたか?当サイトのフォント設定状態も公開しています。

WordPress(ワードプレス)のデフォルトフォントサイズを簡単に変更する方法

WordPress(ワードプレス)のデフォルトフォントサイズを簡単に変更する方法

サイトのHTTPS化できてますか?
サイト開設時のHTTPS化をWordPress(ワードプレス)とXSERVER(エックスサーバー)で簡単に行う方法

サイト開設時のHTTPS化をWordPress(ワードプレス)とXSERVER(エックスサーバー)で簡単に行う方法

スポンサーリンク

まとめ

いかがでしたか?

 

これでテーマのアップデートがされる度に、

「あ、またstyle.cssを書き直さないと」

という手間が無くなります。

 

少しの手間はかかりますが今後の事を考えると断然「子テーマ」を使用した方が良いですね。

ずぼらな私は反省です。

 

今後もやっておいた方がいいなというものがあればどんどん紹介していきます。

【関連記事】
見やすいと思いませんでしたか?当サイトのフォント設定状態も公開しています。

WordPress(ワードプレス)のデフォルトフォントサイズを簡単に変更する方法

WordPress(ワードプレス)のデフォルトフォントサイズを簡単に変更する方法

サイトのHTTPS化できてますか?
サイト開設時のHTTPS化をWordPress(ワードプレス)とXSERVER(エックスサーバー)で簡単に行う方法

サイト開設時のHTTPS化をWordPress(ワードプレス)とXSERVER(エックスサーバー)で簡単に行う方法

るーしー

ではまた!

スポンサーリンク



LINEで送る
Pocket

コメントを残す

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