Elevenは、管理画面で設定できることが多くなっていたり、そのままでもスマートフォンでみられるよう調節してくれたり、とても高機能です。実際に少し変えてみようかな〜と、思ったときに難しくなってしまっていることも事実です。Elevenの、便利なところと、それがどのようにカスタマイズを難しくしているのかを、書いてみたいと思います。Elevenの一番の特徴は、そのままでスマートフォンやタブレット表示に対応してくれていることかもしれません。Elevenを有効にした状態で、ブラウザのウインドウのサイズを変えてみてください。ウインドウのサイズに合わせて、コンテンツやサイドバーの幅、ヘッダー画像の大きさなどが変わりますね。小さくしていくと、あるところでサイドバーが下に落っこちて1カラムになります。ウインドウのサイズがある大きさより小さくなると、フォントのサイズも変わります。すごいですね!こういうのを、「レスポンシブwebデザイン」と呼んでいて、いろんな環境からサイトを見ることが多くなってきていることに対応するひとつの方法です。同じHTMLを使ってウインドウのサイズに合わせてレイアウトやデザインなどをCSSによって変えていくものです。スマートフォンサイトなどを別に用意しなくていいのでとても便利です。「いいじゃない!どんどん使おうよ!」と言いたいところなのですが。これがとってもややこしいんです。ElevenのCSSファイルの68行目当たりから始まる「Structure」という部分を見てみましょう。18.8%;}これは基本のレイアウトの部分なのですが、すごく微妙な感じの%で設定されていますね。」「content」「secondary」などはそれに対するパーセントで大きさを決めています。微妙な数字になってしまうのは、もともとのレイアウトをピクセルで考えておいて、それをパーセントに直すからなんですが、ちょっと見ただけでは、どういう意味の数字なのか分かりにくくなってしまっています。コンテンツの幅などを変えたい、と思ったときに、今まではピクセルで簡単に指定できました。この相対的な設定の仕方のために、どことどこが影響しあっているのかとか、この数字はどこから出てきているのか、ということを見つけ出すのも難しくなっていると思います。うっかりすると、カラム落ち..なんてことにもなりかねないので、しっかり計算しないといけませんね。スマートフォンに対応(1)〜MediaQuery(メディアクエリ)はい、また耳慣れない言葉が出てきました。聞いたことがある方、使っている方もいらっしゃると思いますが、ちょっと説明します。MediaQuery(メディアクエリ)というのは、すごく簡単に言うと、デバイス(ウインドウのサイズ)に合わせて、それぞれの設定ができるCSSの事です。ElevenのCSSの2237行目当たりを見てみましょう。Structure」というコメントがある部分です。見つけられましたか?最大幅800px、650px、450px、これはふつうのブラウザからタブレットくらいまでですね。最後のは、デバイスの最小幅が320px、最大幅が480px、とスマートフォン向けになっている感じです。この部分のおかげで、スマートフォンやタブレット、大きなディスプレイや小さなディスプレイ、色々なものに対応できるのですが、レイアウトを変えたくなったときには、この部分にも変更を加えないといけません。レイアウトやフォントサイズなどを変更するためには、パーセントの計算をした上で、MediaQuery(メディアクエリ)で指定されている部分も変えてあげないといけない、という何重かの手間がかかるわけです。管理画面で、外観>テーマ設定のところを見ると、「デフォルトのレイアウト」とあって、3種類のレイアウトを選択できるようになっています。「おお!!!これば便利!」と思った人も多いのでは?でも、これもカスタマイズするとき、意外にクセモノです。contentというスタイルがbodyに書きこまれます。微調整したい時には、該当剃る部分をしっかり探して変えてあげないと、「CSSが効かないよ〜〜」って、何時間も悩むことになったりしかねません。管理画面の、外観>テーマ設定に「色の設定」という部分があります。デフォルトでは「ライトカラー」の白っぽい色ですが、「ダークカラー」を選ぶと黒っぽい感じになります。ElevenのCSSを探してみても.....それらしい記述がありません。このカラー設定に関するCSSは、テーマフォルダの中にある、colorsというフォルダの中、drak.cssというファイルで設定しています。管理画面で色の設定を変えると、このスタイルシートへのリンクが、headに自動で追加される仕組みです。どちらの設定にしたのか、しっかり把握してないと、やっぱり「CSSが効かないよ〜〜」って悩むことになるかもしれません。その他いっぱいその他にも、たくさんのページのフォーマットが選べるようになっている分、それ専用のスタイルの設定がされています。これもうまく該当箇所を見つけて変えていかないと、うまく変わらなかったり、一カ所だけ変になったりと、つまずくことが多くなるかもしれません。高機能な分、CSSだけではどうにもならなくて、functions.phpなど、テーマ本体のほうをいじらないと、ということも増えてくると思います。楽しいよだいぶ脅かしてしまったでしょうか。Elevenには、WordPressで出来ることの見本がいっぱい詰まっています。Tenのカスタマイズについて考える時にやってきたように、出てくるHTMLとテーマファイルをじっくり見比べれば、分かってくることも多いです。テーマを作っていきたい人にも、こんな機能を持たせるにはこんなことをすればいいんだ、という見本がいっぱいです。いじって楽しんでみてください。Tenや、その他のシンプルなテーマを使ってみるのも良いと思います。4月からWordPressによるブログを始めてみまして、ブログの更新や自分の文体の確立といった所からWordPress自体の運用についてまで勉強中の身です。WPについての情報がたくさんあって大変勉強になります。拝見しながら自分のサイトもすこしずつバージョンアップさせてみようと思います。twentyelevenのカスタマイズは確かに複雑ですね。グローバルナビの配色をコピペで変更できるように下記サイトで配布しています。よろしかったらリンクしてくださいませ。Webourgeon。