【SWELL】子テーマの使い方と役割を解説【親テーマにも触れる】

こういった悩みにお答えします。

是非、最後までご覧ください。

【SWELL】子テーマの使い方や役割を解説【親テーマにも触れる】

WordPressには、親テーマと子テーマという概念があります。

本記事では、子テーマの使い方や役割をメインに解説しつつ親テーマについても触れていきます。

親テーマとは

親テーマとは、WordPressテーマ「SWELL」本体のことで、購入後に届くメールに掲載されているリンクからダウンロードすることができます。

※ メールの内容を第三者へ公開することは利用規約違反になるため控えさせて頂きます。

その他にも、フォーラムから会員登録を行った後、マイページからでもダウンロードできます。

このダウンロードされたzipファイルswell-○-○-○-○.zipをzipファイルのままWordPressにアップロードしてインストール完了後に「有効化」することで「SWELL」を使い始めることができます。

○の部分はバージョンになります。

子テーマとは

子テーマとは、フォーラムから会員登録を行った後、マイページからダウンロードすることができるzipファイルswell_child.zipのことです。

親テーマと同様、zipファイルのままWordPressにアップロードしてインストール完了後に「有効化」することで「SWELL」を使い始めることができます。

ただし、子テーマ単体で「SWELL」を使うことはできず、先に親テーマがインストールされている必要があります。

親テーマと子テーマの違い

違い①：子テーマのみでは「SWELL」は使えない

既にお伝えしましたが、子テーマ単体で「SWELL」を使うことはできず、先に親テーマがインストールされている必要があります。違い②：開発者がテーマを更新した時に上書きされるかされないか

親テーマは、WordPressテーマ「SWELL」本体であり、開発者が機能追加や不具合修正のためにバージョンアップしていくため、カスタマイズをテーマファイルエディターから行ったとしても「上書き」されてしまいます。

※ 「テーマファイルエディター」については後ほど触れます。

編集作業をミスしてしまうとサイトが表示されなくなる可能性もありますので触らないほうが良いです。

一方で、カスタマイズをテーマファイルエディターから行ったとしても「上書きされない」のが子テーマになります。

では、実際にカスタマイズをテーマファイルエディターから行う方法を解説していきます。

補足

バージョンアップ情報に関しては管理画面やマイページに掲載されていますので、そこから詳細ページへと移動することで内容を確認することができます。

【SWELL】子テーマの使い方【タグの仕様変更を例に解説】

タグ（の役割）とは

例えば、10記事中5記事に「雑記タグ」を付けていた場合に、その「雑記タグ」が付いている記事だけに絞って一覧表示させることができます。

タグの作成方法

管理画面メニューから、「投稿」＞「タグ」を選択します。

「タグ」が表示されました。

このページからタグを作成できます。

テーマファイルエディターを編集する前と後でのタグの仕様の違いを確認

それでは、タグの仕様を変えていきます。

【SWELL】子テーマの使い方【カスタマイズ（タグ仕様の変更）をテーマファイルエディターから行う】

テーマファイルエディターを開く

管理画面メニューから、「外観」＞「テーマファイルエディター」を選択します。

初回時のみ「注意！」と表示されますので「理解しました」を選択します。

これで、テーマファイルエディターを直接編集できるようになりました。

テーマのための関数（functions.php）を編集

テーマを編集から、「テーマのための関数（functions.php）」を選択します。

この中にタグの仕様を変えるコードを書きます。

あわせて読みたい

【WordPress】投稿画面のタグをチェックボックスにする方法 「WordPressの投稿画面のタグをチェックボックスにする方法」を知りたいですか？本記事では、GutenbergとClassic Editorでタグをチェックボックスで選択できるようにする方法（そのために必要となるコードの紹介あり）やその特徴、コードを書く際の注意点まで解説しています。「WordPressの投稿画面のタグをチェックボックスにする方法」を知りたい方は是非ご覧ください。

これで冒頭で紹介したチェック形式の仕様へと変更されました。

続いては、子テーマのテーマファイルにある「スタイルシート（style.css）」について解説します。

【SWELL】子テーマの使い方【テーマファイルエディターにあるスタイルシート（style.css）について】

スタイルシート（style.css）とは

簡単に言うと、コードを書くことでWebサイトの見た目の装飾（文字色、背景色、レイアウトなど）を変えることができます。

「style.css」も「functions.php」と同様に、テーマファイルエディターから直接編集することはできますが、テーマファイルエディターからは行いません。

下記の「ご存知ですか？」に記載されているように「付随のCSSエディター」で編集とライブプレビューを行います。

付随のCSSエディターを開く

管理画面メニューから、「外観」＞「カスタマイズ」を選択します。

画面が移動し「追加CSS」を選択します。

「付随のCSSエディター」が開きました。

実際にコードを書いてみます。

赤枠内にヘッダーを海色にするというコードを書くとすぐに変更が反映されます。

このように編集とライブプレビューが行えます。

【SWELL】子テーマの使い方【まとめ】

今回は「functions.php」と「style.css」を例に解説してきましたが、他の「phpファイル」を親テーマから子テーマにコピーして、カスタマイズすることも可能です。

ですが、公式サイトに「子テーマに親テーマのファイルをコピーして大幅にカスタマイズしていた場合、親テーマのバージョンアップデートにより表示が崩れる可能性がございます。」と記載されていることから大幅な編集はしない方が良いと思います。

今回は以上です。