2月 052014
 

本ブログをスタートして、間もなく 1 か月が経過します。初期設定として「Suffusion」というテーマを設定し、その後、細かなデザインを自分用に設定したくて「子テーマ」を作成しました。ただ、知れば知るほど「Suffusion」というテーマが好きになってきて、徹底的に研究してみようかな、なんて考えているここ数日です。

ただ、この「Suffusion」というテーマ、オプションが多過ぎて何から研究を始めたらいいのやら・・・そこで、正しいかどうかは不明ですが、自分が真っ先に気にするブログのレイアウトから研究しようかな・・・

WordPress のブログで;
「外観」=>「Suffusion Options」=>「Sidebar」とメニューを辿っていくと以下のレイアウトが表示されます。現在、とってもオーソドックスなレイアウトにしている本ブログですが、下記画像のように、かなりフレキシブルに設定することができます。

Suffusion_Sidebar_Layout

上記のレイアウト中、「Sidebar 1」と「Right Header Widgets (R Header Widgets)」とが標準で「ON」になっています。「R Header」の部分には、標準で検索用のボックスが設定されているようです。標準だけでも十分に利用できますね。とってもシンプルな「右側にサイドバーがある設定」になります。

本ブログでは、上記の標準の他に「Widget Area Above Footer」の部分にウィジェットを挿入しています。最近よく見かけるフォーマットで、本ブログではカレンダーやアフェリエイト、管理用のリンク等を挿入しています(各ページの末端に表示されています)。各ウィジェットに挿入する内容は、「外観」=>「ウィジェット」をメニューを辿っていって設定することになります。

この設定が行ったり来たりするのがちょっと理解するのを難しくしている原因かもしれませんね・・・

1月 202014
 

20140120_Suffusion_Mgtかなりお気に入りのテーマ「Suffusion」ですが、やっぱり細かいところは自分の好みに変更したい!

そこで、「子テーマ」を設定して、自分専用の設定を試しています。これまでの経験もあって、早速、必要最低限の設定を実装して・・・いきなり「子テーマ」の style.css ファイルの作成を始めてしまいましたが・・・これが、なかなか style.css が反映されない。

週末、試行錯誤して解ったことは・・・

「子テーマ」の設定は、管理画面の設定項目が何よりも優先するので、まずは管理画面のメニューを設定すること!

多分これって、「Suffusion」に限らず、全てのテーマで。「子テーマ」を設定したときの基本なんだろうと思いますが、お粗末にもそれを認識せずに、一生懸命、style.css に必死にコードを書いていました・・・何てこった!

いわゆる「外観」をクリックすると登場する項目をまずは設定すること。付け加えておくと、メニューの上から順番に設定するのが良いでしょう。「Suffusion」の場合、「外観」として以下のメニューが構成されます。

  1. テーマ
  2. カスタマイズ
  3. ウィジェット
  4. メニュー
  5. ヘッダー
  6. 背景
  7. Suffusion Options
  8. テーマ編集

「Suffusion Options」は下から2番目、それこそ「テーマ編集」は最後の手段ということになります。それを知らずに・・・時間を無駄にしたような気分ですが、ここは「勉強になった」と割り切るしかありません。

「Suffusion」の場合、それぞれのメニュー項目の下部に、独自の Note が表示され、「Suffusion Options」のどこで詳細設定が可能かを示してくれますので、テーマによっては、そうした独自メッセージを参考にすると良いでしょう。

1月 162014
 

投稿記事が増加してくると、頻繁に利用する HTML タグに関しては、ちょっとした工夫が欲しくなってきます。例えば、「<table>関連タグ」や「<blockquote>タグ」等は、本ブログでは頻繁に利用するため、適用しているテーマ「Suffusion」でのカスタマイズには、限界がありそうです。

そこで、CSS だけは「子テーマ」を設定して、自分好みのスタイルにしようと決心!

しかし、以前公開した本ブログの投稿記事「「子テーマ」を検討する」でも触れましたが、「2.CSS が完全上書きできない」ということを確認することにしました。

単純に、親テーマを引き継ぐだけの「子テーマ」を採用してみて確認します。

本ブログで採用している「Suffusion」は、「Suffusion Options -> Skinning -> Theme Selection (Color Scheme)」のみを「Royal Blue on a light theme」へ変更している以外は、全てのカスタマイズ可能なオプションは標準のままの設定です。下図が、一つの投稿記事のコピーです。

20140117_Suffusion_RoyalBlue

これをスタイルをそのままに「子テーマ」にすると CSS を上書きしないのが明確です。

20140117_Suffusion_Child

ブログの背景色が変わってしまっているし、ブログタイトルの配色も違ってしまっている・・・詳細に比べてみれば、もっと存在しているのでしょうけど、「子テーマ」で変更していけばいいかな、と考えていますが、これまで「親テーマ」を完全に引き継いでくれると思っていただけに勉強になりました。

1月 152014
 

本ブログで現在適用している「Suffusion」というテーマ。標準で準備されているカスタマイズ領域が多くて素晴らしい・・・しかし、どうしても痒いところに手が届かないこともあって、いよいよ自分専用のカスタマイズを加えていこうかな、と考えています。

WordPress の鉄則として!?、自分専用のカスタマイズを実施する時には、「子テーマ」というのを設定して、そこでカスタマイズすることで、今後のアップグレードに支障を出さない、というのがあります。私個人も、他のブログでは「子テーマ」を設定していますので、それほど難しくはなさそうです。

  1. カスタマイズしたいテーマのディレクトリーと同じレベルに「子テーマ」用のディレクトリー設定。
  2. 「子テーマ」に必要なファイルを上記のディレクトリーに配置する(最低でも style.css を配置)。

これだけで機能しだすので、ちょっと知識があればできますよね!

私も、スタイルだけをカスタマイズしたいので、style.css のみで、以下のコードを「子テーマ」の準備を始めました。

/*
Theme Name:     Suffusion_Zero
Theme URI:      http://www.nakui.net/wordpress/wp_theme
Description:    This is the Child theme for Suffusion
Author:         Zero Cool
Author URI:     http://www.nakui.net/about
Template:       suffusion
Version:        1.0
*/
 
@import url('../suffusion/style.css');

詳細に関しては、ネットに溢れるほど素晴らしい情報が公開されていますから、ここで詳細を説明することは避けますが・・・ただ、ちょっと気になる情報を見つけました!それが、「40代からのストレスフリー人生計画:WordPress で子テーマを作ってサイト運営してみてわかった 3つのデメリット」という公開投稿記事。

どうやら以下のような問題がありそうです。

  1. functions.php の管理が面倒
  2. CSS が完全上書きできない
  3. 親テーマファイルの構成が大幅に変わると子テーマの修正もハンパない修正作業になってしまう

私の場合、上記の「css が完全に上書きできない」というのがかなり気になります・・・これから、詳細を検討してみなければなりませんが・・・またまた、楽しみが増えたような気がして、ワクワクしています。

1月 032014
 

本ブログは、今更説明の必要がないと思いますが「WordPress」で運用しています。初期設定のままでも十分に楽しめますが、私個人としては、お気に入りのテーマ(ブログのデザインを左右する)を探す時間が結構好きです。

実は、今でも同じように「WordPress」で個人運用しているブログは複数あるし、閉鎖したブログも数知れずの状態なので、気になっているテーマがいくつかあります。

そんな中、本ブログでは「Suffusion」を適用してみることにしました。

suffusion

標準では日本語がカバーされていませんが、「TrippyBoyの情報の館 ServersMan@VPS」で日本語化のためのファイルが公開されていますので、必要であればインストールするのが良いでしょう。ただし、公開されるブログの部分が日本語されますが、管理画面は英語のままですので。

それにしても、多くのカスタマイズが可能ではあるのですが、Option が多過ぎるので、かなり研究が必要そうです・・・