WordPressブログをカスタムする方法
WordPressには公式を含めて様々なテーマがあり、以下のような方法で配色やレイアウトをカスタムし、自分好みのデザインでブログを構築していくことができます。
テーマを適用後、それぞれのテーマが持つカスタマイザーを使って、基本的な配色、背景画像やメニュー項目などをカスタムします（テーマだけでは再現できない部分などは、追加CSSを使って調整します）。
HTMLやCSSなどの専門的な知識がなくても編集することができるので、初心者の方でも気軽にカスタムすることができます。
子テーマを作成することで、既存のテーマに必要なものだけを追加する形でCSSやJavaScript、画像ファイルなどを読み込ませることができます。
CSSやJavaScriptを書ける方なら、自分の思い描くデザインに合わせて見た目を調整したり、アニメーションを追加するなど、幅広くカスタムすることができます。
また、子テーマは構造上、親となるテーマのアップデートに左右されるので、継続的なメンテナンスが必要になります。
同じく子テーマを作成した後、親テーマを構成するPHPファイルを子テーマにコピーして編集することで、文書構造自体を作り替えることができます。
もっとも大規模なカスタムも可能ですが、専門的な知識が必要となり、親テーマのセキュリティアップデートなどが反映されなくなることもあるので、使いどころとアフターケアには注意する必要があります。
「SWELL」について
今ご覧になっているこのC5log（シーファイブログ）は、WordPressテーマ「SWELL」を使って構築しています。
「SWELL」は数あるWordPress用テーマの一つですが、その特徴を一言で言うと、上記で説明したテーマをカスタムする方法の中で、STEP 1のカスタマイザーを使ってカスタムする方法が物凄く充実しているテーマです。
これらのカスタマイザーをポチポチと設定するだけで、CSSなどのコードを記述することなく、体裁を整えたブログを最速で公開することも可能です。
例えば、サンプル記事をいくつか作成して「SWELL」テーマを適用し、カスタマイザーで設定することで、10分ほどで以下のようなトップページになりました。
また、WordPressのブロックエディタで使用できる独自のSWELL専用ブロックがあり、ボタンや吹き出し、タブボックスなど、ブログでよく使うパーツを選択して配置するだけで簡単に記事を構築することができます。
このように、「SWELL」はHTMLやCSSなどの専門的な知識がない初心者の方におすすめできるテーマになっています。
しかし、SWELLカスタマイザーとSWELL専用ブロックは、ブログを公開・運用するにあたっての制作時間を大幅に削減してくれる強力な機能ですが、その反面、それらに依存していると、将来的にテーマを切り替える際の移行作業が大変になるという懸念もあります。
「SWELL」を本気でカスタムする
「SWELL」テーマは、初心者の方に大変優しいテーマですが、もちろんデザインやコーディングの知識がある方にとっても、カスタムしがいのあるテーマになっています。
このブログでは、SWELLカスタマイザーに加えて、Step 2の子テーマを作成してCSSとJavaScriptを追加することで、アニメーションを含むデザインをカスタムしています。
（PHPはfunction.phpのみ修正）
まとめ
- HTMLやCSSの専門知識のない方
- ブログデザインをカスタムすることが好きな方
- 初期投資をしてでも、早く楽に見栄えのするブログを公開したい方
- テーマを頻繁に変えない方
- 有料テーマを購入したくない方
- テーマを頻繁に変える方
このC5log（シーファイブログ）では、このようにSWELLカスタマイザーだけでは表現できないデザインやアニメーションを取り入れるためのTipsを随時公開していきます。
ただコードをコピペするだけではなく、そのデザインを再現するために必要なHTMLやCSSについて解説することで、訪れてくれた方にとって、ちょっとしたWebデザインの学びの場となれたら幸いです。