AFFILIATEBLOGWebデザインWordPressの子テーマを作る理由と子テーマを自作する方法Webデザイン2018.06.12WordPressの子テーマを作る理由と子テーマを自作する方法メディアを運用するには、アクセス数の増加や成約率の向上は、目標の一つ。それらの為に、サイトのデザインをカスタマイズするというところについては、皆さんが取り組まれていることかと思います。カスタマイズの事例を調べたり、phpやcssの参考となるコードを調べる際、検索結果でよく「子テーマ」という単語を目にするのではないでしょうか。今回はその子テーマを自作・導入する方法についてご紹介していきます。子テーマ化についてはコチラの記事も是非参考にしてみてください。子テーマ化についてはコチラの記事も是非参考にしてみてください。子テーマを作る一番の理由はテーマを直接カスタマイズしてしまうと、テーマのバージョンアップによって変更した内容が上書きされてしまうからです。テーマをバージョンアップしないという選択肢もありますが、テーマのバージョンアップには様々な理由(致命的なエラー、セキュリティに対する対応)が含まれます。サイトの運用においてバージョンアップを無視するということは好ましくない状態であるわけです。テーマをバージョンアップすると同名ファイルのカスタマイズが存在した場合、そのカスタマイズ内容はバージョンアップしたファイルに上書きをされます。カスタマイズしたものが無くなってしまうというわけで、「テーマはカスタマイズしたい」「でもバージョンアップもしたい」という2つの目的を果たすために子テーマが存在します。子テーマを使うメリットというのは、親テーマをバージョンアップさせても自分の変更内容を保持できるという点にあります。親テーマのバージョンアップ内容を理解して、必要に応じて子テーマにも同様の対応を施すようにしましょう。子テーマ化についてはコチラの記事も是非参考にしてみてください。2018.06.23実は損してる?WordPressで子テーマを作ることのデメリットについてWordPressでホームページを作成しようとされている方は色々調べられていることと思います。最近は初心者向けとして書かれている内容でも「子テーマの作り方」というものを目にするのではないでしょうか。子テーマを作...子テーマ制作に必要なものとは?子テーマを自前で用意する場合、子テーマの要素となるファイルを先に作る必要があります。そこで利用するファイルは主に2つ。functions.php:WordPressに機能を追加する役割(プラグインのような機能)をもつ。子テーマにおいては親テーマのfunctions.phpにある記述は上書きし、ない記述は追加します。style.css:テーマのデザインスタイルを追加します。子テーマにおいては親テーマのstyle.cssにある記述は上書きし、ない記述は追加します。これ以外にもファイルごとに細かくカスタマイズしたい場合は、header.phpやindex.phpなど、親テーマにおいて変更したいファイルを子テーマに作って記述を変更、追記していきますが、便宜上、基本的なカスタマイズに絞ってご紹介していきます。自前で子テーマを用意する際にやることとしては、functions.phpで親テーマと子テーマを連携させ、親テーマをベースとした子テーマのデザインカスタマイズをしていくだけです。そのためにもまずは子テーマのファイルを組み立てていきます。最初に子テーマを作っていくにあたって、子テーマのフォルダを作っていきます。フォルダの作り方は簡単。エクスプローラー画面を開き、何もない空間で右クリック。すると「新規作成」>「フォルダー」と表示できるので、新しいフォルダを作りましょう。ちなみにフォルダ名は、分かれば何でもOKですが、後でファイルを探しやすいように「テーマ名-child」と表記するといいでしょう。TCDテーマのOpinionを利用しているならば「Opinion-child」という感じです。フォルダを新規で作成できたら、functions.phpとstyle.cssのファイルをそのフォルダの中に作っていきます。次に子テーマのstyle.cssを設定します。エディタツール(メモ帳やterapad、Bracketsなど)を開き、以下のコードをコピー&ペーストしてください。URI:Description:WordPressテーマ「Opinion」の自作子テーマです。URI:https://design-plus1.com/tcd-w/Version:0.0.8*/コードをコピー&ペーストできたら、このコードをもとにテーマ用の記述に変更していきましょう。Name:子テーマのテーマ名を入力します。「親テーマ名+child」といった感じで自分が後で読んでもわかりやすい名前にしておきましょう。URI:子テーマのURLを記載します。基本的に空欄でもOKです。Description:子テーマの役割や説明の注釈書き欄です。「親テーマ「〇〇」の子テーマです。」といった形で親テーマ名称がわかるように書いておくと、後で見返す際にいいかもしれません。Template:親テーマのフォルダ名を入力します。親テーマとの連携の際に記入必須な項目です。Author:テーマの作成者名を記述します。URI:テーマ作成者のURLを記載します。Version:子テーマのバージョン情報を入力します。親テーマと同一のバージョンを記載しておきましょう。書ける内容はたくさんありますが、最低これくらいの情報だけでも記載しておくといいかもしれませんね。この中でもっとも間違いやすいのが「Template」の項目です。テンプレートと表記されているため、親テーマのテンプレート名を記載してしまいがちですが、ここで記入するのは親テーマの「フォルダ名」です。テンプレート名を入力してしまうと、子テーマがきちんと呼び出されなくなってしまうので、入力する際はくれぐれも記載を誤らないようにしましょう。ここまで入力できたら、「名前を付けて保存」。ファイルの種類を「すべてのファイル」にして「style.css」という名称で保存しましょう。これでstyle.cssの準備は完了です。最後にfunctions.phpを用意していきます。先ほど同様、以下のコードをコピー&ペーストします。array('parent-style'));}?>今回の作業上、functions.phpにおいて、基本的にコードを書き換える部分はありません。一応コードの内容も解説しておくと...add_action:WordPressに機能を追加する宣言です。ここでは子テーマのCSSとJavascriptを読み込んでいます。4行目のwp_enqueue_style:親テーマのCSSを読み込みます。5行目のwp_enqueue_style:親テーマのCSSを上書きします。ここでは、4行目のstyle.cssの後に子テーマが読み込むよう設定するのがポイントです。することで、親テーマのスタイルの後から、追加した子テーマのスタイルを読み込みます。ここまで入力できたら、「名前を付けて保存」。ファイルの種類を「すべてのファイル」にして「functions.php」という名称で保存しましょう。これで子テーマの完成です。次は子テーマをオンライン上にアップロードしていきます。作った子テーマをアップロードするには?子テーマをオンライン上にアップロードする方法は大きく2つの方法があります。フォルダをZIP形式に圧縮してWordPress管理画面上からアップロードする方法FTPソフトを使用して子テーマをアップロードする方法このページでは、その中から「フォルダをZIP形式に圧縮してWordPress管理画面上からアップロードする方法」を例に、子テーマをアップロードしていきます。「フォルダをZIP形式に圧縮してWordPress管理画面上からアップロードする方法」では、プラグインを使った方法やFTPソフトのやり方と異なり、特別なソフトやツール等はいっさい使いません。やり方は簡単で、先ほど作った子テーマのフォルダを圧縮してZIP形式にするだけ。子テーマとなるフォルダを右クリックで選択し、「圧縮」>「.zip」コマンドで圧縮します。するとデスクトップ上にZIPファイルが出来上がるので、そのZIP形式で圧縮された子テーマを親テーマがアップロードされているWordPressの「外観」>「テーマ」画面より、テーマをアップロードするときと同じ方法でアップロードします。テーマを有効化して、子テーマの編集画面に「この子テーマは親テーマ「○○(テーマ名)」のテンプレートを引き継ぎます」と表記されていれば、親テーマの読み込みが成功しています。まとめ今回は、子テーマを自作する方法についてご紹介しました。子テーマの運用は、難しい印象があるかもしれませんが、一度作ってしまうと親テーマのコードを追加変更するよりも便利な運用が可能です。今のサイトを自分らしく仕上げたいという方は、ぜひ使ってみてください。今回は「フォルダをZIP形式に圧縮してWordPress管理画面上からアップロードする方法」で子テーマを用意したわけですが、他にもプラグインを使うことでもっと手早く作れたり、FTPソフトでファイルを管理・運用することも可能です。取り組みやすい方法で子テーマを運用してみましょう。Theme」FTPソフトでファイルをアップロードする方法:初心者におすすめの無料FTPソフトベスト3子テーマ化についてはコチラの記事も是非参考にしてみてください。2018.06.23実は損してる?WordPressで子テーマを作ることのデメリットについてWordPressでホームページを作成しようとされている方は色々調べられていることと思います。最近は初心者向けとして書かれている内容でも「子テーマの作り方」というものを目にするのではないでしょうか。...2020.02.11ワードやエクセルの表をテーブルタグに変換する便利なツール・ジェネレータ集2020.02.10上質な癒しを感覚レベルで訴えかける。Macでzip圧縮する時に注意しておきたいこと。2019.12.28【初心者向け】Gitとは何なのか。基本用語やその仕組みをまとめています。2019.12.27WEBマーケティングより広義のデジタルマーケティングについて基本から考える2019.09.18今更聞けない?Webサイトのアクセス解析やマーケティングにおいて知っておくべき基本用語2019.09.17読み手の心を動かすコピーライターの仕事とは?ライティングやコピーの基本要素を知ろう2019.07.21国内有力ウェブメディア17サイトの記事更新頻度を調査してみた。No.1】人はコンテンツのどこをどう評価するのか。コンテンツマーケティングに関する重要な話2019.07.01スクリーンショットの撮り方でここまで変わる!かっこいい記事にする為の10のテクニック2019.04.07強烈なインパクトでユーザーの視線を鷲掴みにするWordPressテーマ【MAXX】のトップページについて2017.01.26ファーストビューで動画を使うと見る側にどう伝わっているかという考察記事2019.12.15プロ級の会員制サイト運営をあなたの手に。No.1】人はコンテンツのどこをどう評価するのか。