マルチサイト機能によるサイト構築
この記事は2019年6月7日に書かれたものです。情報が古い可能性がありますのでご注意ください。
この度、弊社WillさんいんのWebサイトをリニューアルしました。これまでは一つのWillさんいんのサイトとして WordPress で構築し、このブログもその中にカスタム投稿タイプを使って組み込んでいましたが、今回のリニューアルでは、WordPress のマルチサイト機能を使い、ブログだけでなく事業毎にサイトを分けて構築しました。
マルチサイト機能を使ったサイト構築は、これまでの業務の中で多言語サイトなどいくつかの制作実績がありますが、これまではデザインがほぼ同じサイトでした。でも今回は、ベースとなるデザインは同じですが、ブログは元より、それぞれの事業サイトでも異なるデザインとなっています。
一般的に企業サイトとブログが存在する場合、それぞれに WordPress をインストールして構築・運用されているパターンが多いような気がしますが、一つの WordPress で構築・運用すると、プラグイン等を一元管理できるというメリットがあります。その一方で、デザインが異なる場合は特にテーマの設計が複雑になります。
マルチサイトの構成
今回のリニューアルによる弊社サイトの構成は以下の7サイトになります。
- 「有限会社Willさんいん」(メインサイト)
- 「人材育成」(サブサイト)
- 「テレワーク」(サブサイト)
- 「Web制作&システム開発」(サブサイト)
- 「フロントエンドエンジニアのblog」(このブログ)
- 「スタッフブログ」(6月7日現在未公開)
- 「かわもとテレワークスペースOTO-LaVo」(これから構築予定)
この内、メインサイトと3つのサブサイトは基本的なレイアウトは同じですが、フロントページのデザインやサイト全体の色合いが異なり、サイト毎に独自のパーツデザインもあります。一方、ブログ2つは上記のサイトとはほとんど異なるデザイン、これから構築するサイトも異なるデザインとなる予定です。
親テーマと子テーマ
WordPress のマルチサイトでテーマを構成するとき、全てのサイトが同じデザインであればシングルサイトと同じように一つのテーマで構成すればよいですが、サイト毎にデザインが異なる場合は、親テーマと子テーマを使い分けることになります。(一つのテーマで条件分岐を駆使してできないこともないですが)
そして、親テーマと子テーマの特性を理解しておく必要があります。それは、子テーマの各ファイル(***.php)は親テーマの同ファイル(***.php)を上書きする、ただし、functions.php は上書きではなく、親テーマの内容に子テーマの内容が追加されるということです。
テーマ構成
今回のマルチサイトでは、メインサイトと3つのサブサイトで共通する page.php や archive.php、single.php、footer.php などのファイルは親テーマの中に置き、その中でサイト毎に異なる部分はサイトIDによる条件分岐で記述内容を振り分けました。
そして、デザインの異なる fornt-page.php や、各サイト独自のカスタム投稿タイプやカスタムフィールドを出力するための page-***.php や single-***.php などはそれぞれのサイトに割り当てた子テーマのフォルダの中に置きました。
また、header.php については、3つのサブサイトで共通のファイルを使用するため、親テーマの中に com-header.php などと任意のファイル名で作成し、include 文を使って読み込むようにしました。
functions.php と style.css については、親テーマの中のファイルで全サイト共通の内容を記述し、各子テーマの中の同ファイルで個別の内容を記述しています。
一方、ブログについては上記とデザインが異なりますので、2つのブログ共通の子テーマを作り、必要なファイルをその中に置いています。JavaScript の読み込みや基本的に行なっているカスタマイズなど、functions.php に記述する内容は全サイトで共有したいので、独立したテーマではなく子テーマとしています。
これから作成するサイトもブログと同様、別の子テーマとして作成する予定です。
ファイルの読み込み
なお、テーマの記述の中で他のファイル読み込む場合、親テーマのファイルを読み込みたい場合と、現在の子テーマのファイルを読み込みたい場合がありますが、以下のように記述することで読み込むファイルを区別します。
include 文でテーマの中の .php ファイルを読み込む
- 親テーマのファイルを読み込む場合
include( TEMPLATEPATH . '/***.php' );
- 子テーマのファイルを読み込む場合
include( STYLESHEETPATH . '/***.php' );
CSS や JavaScript、画像などのファイルを読み込む
- 親テーマのファイルを読み込む場合
get_template_directory_uri(). '/***.css';
- 子テーマのファイルを読み込む場合
get_stylesheet_directory_uri(). '/***.css';
今回、テーマの構成がかなり複雑になってしまったので、少なくともブログについては WordPress を別にインストールした方がよかったのかもしれません。共通化すると見通しがよさそうですが、ある修正が思わぬ誤算を生むということにもなりかねませんので。
サイト構築の効率だけでなく、メンテナンス性や運用方法なども考慮して、どのように構成するか設計段階でよく検討する必要があると感じました。
“マルチサイト機能によるサイト構築”への 1 件のコメント
(wordpess)マルチサイトで子テーマを使用する際は注意が必要か | うさぎの森
[…] 有限会社Willさんいん「マルチサイト機能によるサイト構築」 […]