wordpress

【WordPress】子テーマの作成方法とメリットを解説

2021年7月24日

WordPressの子テーマのメリットデメリット

こんにちは、よしです。

me
悩んでいる人

WordPressの学習を始めたのですが、子テーマの作り方がわかりません!

また、子テーマのデメリットはありますか?

今回は、 そんなWordPress初学者が悩みがちな子テーマの作成方法と子テーマ導入のメリット、デメリットを解説していきます!

子テーマの知識は WordPress案件をこなす上で必ず必要になってくるので、しっかりマスターしましょう!

もしあなたがWordPressを独学で学びたいなら、"独学でOK" WordPress案件を取れる学習ロードマップの記事が参考になるのでぜひチェックしてみてください。

この記事で分かること

・ WordPressの子テーマとは

・子テーマを導入するメリット、デメリット

・子テーマが必要な場合と必要ない場合

・ WordPressで子テーマを作成する方法

チェック!
"独学でOK" 未経験でもWordPress案件を取れる学習方法
"独学でOK" WordPress案件を取れる学習ロードマップ

続きを見る

チェック!
【Local By Flywheel】WordPressのローカル環境構築手順
Local By FlywheelでWordPressローカル環境を構築する方法

続きを見る

WordPressの子テーマとは

WordPressを学習している方なら、「子テーマ」という単語は聞いたことがあるのではないでしょうか。

子テーマを作成することで、既存の WordPressテーマに機能を追加したり、デザインをカスタマイズしたりすることが出来ます。

IMG 5924
よし

少し分かりにくいですよね、、

既存のテーマ(棒人間)を元に子テーマ(洋服、髪の毛)を作成することで、オリジナルの人物を作ろう!というイメージで考えると分かりやすいかも知れません。

WordPressの管理画面でも追加CSSで簡単なカスタマイズをすることは可能ですが、子テーマを作成するとさらに複雑なカスタマイズやPHPを使ったカスタマイズも可能になります。

実際に WordPress案件も子テーマを使用する事が多々あるので、使い方、作成方法をマスターしましょう。

WordPressで子テーマを導入するメリット、デメリット

WordPressの子テーマはとても便利で、メリットも多いですが、多少のデメリットもあります。

メリット、デメリットをそれぞれ解説していきます。

WordPressで子テーマを導入するメリット

子テーマを使用する主なメリットは以下の通りです。

子テーマのメリット

・幅広いカスタマイズが可能になる

・親テーマがバージョンアップしても、カスタマイズがリセットされない

・重要なファイルを誤編集する危険がない

簡単に説明を加えていきます。

幅広いカスタマイズが可能になる

子テーマを利用すると、親テーマの機能を保ったまま自由にカスタマイズすることが可能になります。

0からWordPressテーマを作る場合、それぞれのページのテンプレートやSEO対策などかなりの作業量が必要になります。

それに対して、子テーマをしようする場合、既に完成している親テーマに自由に追加したい機能、デザインを実装できるので、簡単に思い通りの

サイトを作成する事ができます。

親テーマがバージョンアップしても、カスタマイズがリセットされない

わざわざ子テーマなんて作らなくても、親テーマを直接編集すればいいじゃん!と思うかもしれませんが、そうはいきません。

WordPressのテーマは頻繁にアップデートされることが多いです。

親テーマのファイルを直接編集していると、アップデート時に全てリセットされてしますのです。

一生懸命カスタマイズしたのに、全てリセットなんてつらすぎますよね。

そこで、子テーマを作成し、そちらでカスタマイズすると、親テーマがアップデートしても子テーマは変わらないのでリセットされることはありません!

WordPressで子テーマを導入するデメリット

子テーマを使用する主なデメリットは以下の通りです。

子テーマのデメリット

・HTML,CSS,WordPress(PHP)の専門的な知識が必要

・SEOに悪影響の可能性がある

こちらも簡単に説明を加えていきます。

HTML,CSS,WordPress(PHP)の専門的な知識が必要

WordPressで子テーマを作成するには、HTM,CSSの知識はもちろん、WordPressで扱われているPHPの知識もある程度必要になってきます。

全く知識がない状態で子テーマの作成に挑戦すると、かなりの時間がかかったり、うまく表示されないという現象がおきたりするので、最低限の参考書は持っておいた方がいいです。

こちらの参考書を一冊持っておけば、WordPressの基本的な知識は網羅されているので、辞書的に使えておすすめです。

SEOに悪影響の可能性がある

絶対悪影響があると言い切れるわけではないので、参考程度に。

子テーマを使用し、読み込みデータが多くなり速度が低下することで結果的にSEOに悪影響があるのではないかと言われることがあります。

全く使うことがないのに子テーマを作成するのは避けた方が良いかもしれません。

WordPressで子テーマが必要な場合と必要ない場合

WordPressで子テーマを使用するメリットとデメリットを元に、子テーマが必要なサイトと必要ないサイトを解説します。

子テーマが必要な場合

  • 複雑なCSSカスタマイズが必要な場合
  • 固定ページにオリジナルページを作成したい場合
  • カスタム投稿タイプやカスタムフィールドを自由に使いたい場合
  • 直接テンプレートファイルを編集したい場合

子テーマが必要ない場合

  • 既存テーマをそのまま使う場合
  • カラーの変更などの小さなCSSカスタマイズで済む場合

WordPressで子テーマを作成する方

WordPressの子テーマは、style.cssとfunctions.phpがあれば最低限作ることができます。

簡単に、以下の流れで作成します。

  1. フォルダにstyle.css,functions.phpを作成
  2. wp-content/themes にフォルダを格納(管理画面からアップロードも可)
  3. 子テーマを選択
  4. function.phpにコードの記述
  5. 子テーマ完成

style.cssとfunctions.cssの作成

子テーマ作成ステップ1
子テーマ作成ステップ1

画像のように、自分のPCに新規フォルダを作り、style.cssとfunctions.cssを作成しましょう。

functions.phpは現状空の状態でも問題ありません。

style.cssには、

Theme Nameには子テーマの名前Templateには親テーマのフォルダ名(親テーマのstyle.cssに書いてあるTheme Nameとは異なるので注意しましょう)

を記述します。

作者名やバージョンも記述できるのですが、上記の記述で子テーマ作成は可能です。

WordPress上にアップする

子テーマ作成ステップ2
子テーマ作成ステップ2-1

WordPressのテーマは、wp-content/themesに格納されているので、作成したフォルダを同じ階層に入れます。

スクリーンショット 2021 07 24 22.17.17
子テーマ作成ステップ2-2

作成したフォルダは、WordPress管理画面からアップロードする事もできます。

WordPress管理画面で小テーマを選択する

子テーマ作成ステップ3
子テーマ作成ステップ3

ここまで問題なく進められていれば、上の画像のように、作成したテーマが選択できるので、有効化しましょう。

テーマ選択画面に子テーマが表示されない場合は、画面下部を確認してみてください。

画像のようにエラーが表示されているはずなので、修正してもう一度アップしましょう。

スクリーンショット 2021 07 24 22.29.17

【子テーマ作成ステップ4】functions.phpに必要なコードを書く

この状態で子テーマのstyle.cssにコードを書いても、まだ反映されません。

子テーマのCSSを反映させるために、先ほど作成したfunctions.phpにコードを記述する必要があります。

functions.phpに以下を追記してください。

基本的にこのコードで子テーマのCSSが反映されるようになります。

まとめ  WordPressの子テーマは必要に応じて使えるように!

いかがでしたか?

WordPressの子テーマはとても便利で、オリジナリティーのあるサイト制作には必須です!必要に応じて使えるようにしておきましょう。

それではまた!

no image

NFT

2022/4/8

【OpenSea】Polygon(ポリゴン)NFTは売れない?デメリットはある?

no image

NFT

2022/4/16

OpenSeaで予約販売(List)する方法【自動で出品】

no image

NFT

2022/4/5

売れないNFTアートと売れたNFTアートを徹底比較【実体験】

no image

NFT

2022/3/3

【超簡単】OpenSeaのアイテムをコレクション移動させる方法【販売後も可能】

no image

NFT

2022/2/5

写真のNFT化・販売方法について徹底解説!

no image

NFT

2022/2/2

OpenSeaが突然の出品制限【50作品×5コレクションが上限に?】

no image

NFT

2022/1/26

【簡単】OpenSeaのアカウントを複数作る方法

no image

WEB制作

2022/4/3

テックアカデミー「はじめての副業コース」のLiteプランがヤバすぎる!

no image

仮想通貨 NFT

2022/1/5

【簡単】コインチェックで仮想通貨を購入・MetaMaskに送金する手順

no image

NFT 仮想通貨

2022/1/5

【2022年】メタマスクの使い方・送金方法を徹底解説【初心者でも簡単】

no image

仮想通貨

2022/1/24

【実体験】仮想通貨初心者にコインチェックがおすすめな理由

no image

仮想通貨

2022/1/24

【2022年】コインチェックの口座開設方法を5段階で解説

no image

NFT

2022/1/6

【バズるコツも紹介】NFTギブアウェイ(Giveaway)のやり方とメリット・デメリットを解説

no image

仮想通貨

2022/1/6

Hi Dollars(ハイダラーズ)アプリのマイニングで仮想通貨を貰おう【無料でゲット】

no image

NFT

2021/12/30

NFTエアドロップの受け取り方・送り方を解説【初心者でも簡単】

no image

NFT

2021/12/26

NFTアートが売れないときの対処法と稼ぐコツ【今すぐできる】

no image

NFT

2022/1/5

OpenSeaでのNFTアートの作り方【出品手数料やガス代も解説】

no image

WEB制作 プログラミング

2021/12/21

分割払いできる?デイトラの支払い方法を解説!【結論:カード使えば分割可能】

no image

プログラミング

2021/12/7

【退会料はかかる?】レバテックルーキーの退会方法【他のIT就活サービスも紹介】

no image

WEB制作

2021/12/5

デジタルハリウッドSTUDIO by LIG(Webデザイナー専攻)の学習内容と評判【2021年最新】

-wordpress

© 2022 よしブログ Powered by AFFINGER5