Suffusionにテーマを切り替えてまず最初に目についたのが、サイドバーに置いているAdSenseがウィジェットに収まりきっていないところ（右図）。AdSenseの広告の幅が300pxなのに対して、ウィジェットの幅は260pxしかないので、サイドバー全体の幅を拡張してやる必要がある。
ダッシュボードの「外観／Suffusion Options」をクリックすると（何度見ても「DON’T PANIC!!」というメッセージに面食らうw）、CSSを書き換えずにテーマのスタイルを変更できるようなUIが出てくる。配色とかレイアウトとか、かなり細かく設定できるようになっているようだ。Skinningのタブは、配色とかアイコンセットとかを変更するがわりかし直観的だったのだが、いざサイドバーの幅を広げようと思ったら、Layoutsタブの下にあるDefault Sidebar Layoutや1 Right Sideber、Sidebarsタブの下にあるSidebar 1と、同じような設定があちこちにあって大混乱。あちこちのWidthを変えてみたものの、なかなか期待した表示にならなかったり。
WordPressのテーマをSuffusionに乗り換えて気持ちもなんだかリフレッシュしたところで、さっそくスタイルのカスタマイズに着手していこう。スタイルシートは「外観／テーマの編集」から編集することができるが、一般的には、スタイルとかをカスタマイズするには子テーマを使うのが定石らしい。そうしないと、（iFeatureでしくじったように）テーマをアップデートしたらカスタマイズしたスタイルが消えてしまう。子テーマの作り方はWordPress Codexに詳しく書かれているが、この辺の面倒な作業を代わりにやってくれるOne-Click Child Themeという便利なプラグインがあったのでインストール＆有効化。ダッシュボードに追加された「外観／Child Theme」というメニューをクリックする。
ブログ開設当初はWordPressのテーマにiFeatureを使っていたのだが、カスタマイズしていく上でいろいろ不便なところがあったのでSuffusionに乗り換えることにした。iFeatureの何がイケてなかったかというと、CSSをちょこっと変えたいといったときに、メインのstyle.cssにスタイルを書き加えてもまったく反映されないところ。WordPressのダッシュボードから、「外観／テーマの編集」をクリックして、右側の一番下にある「スタイルシート（style.css）」を選択すると、一般のテーマではグローバルなスタイルを変更できるのだが、HTMLのソースを見てみるとiFeatureはどういうわけかstyle.cssを読み込んでいないのだ。
ブログを開設してから1ヶ月ちょっとだが、はてブされるエントリが出てきたので、ブログ内で被はてブ数を表示させるようにしてみる。ブックマーク数を画像で取得するAPIによると、被はてブ数のアイコンを表示させるには
<img src="http://b.hatena.ne.jp/entry/image/エントリーのURL" />
というimgタグを使えばいい。さらに、アイコンを該当するはてブにリンクさせるには
<a href="http://b.hatena.ne.jp/entry/エントリーのURL"> <img src="http://b.hatena.ne.jp/entry/image/エントリーのURL" /> </a>
というaタグで囲めばいい。
まずはここまでを実現するJavaScriptを書いてみる。
Continue reading »
コンテンツ上にあるリンク先に飛んだ後、いちいちブラウザの「戻る」操作をするのが面倒なので、リンクを右クリックして「リンクを新しいタブで開く」習慣は誰でもあるだろう。この右クリックという操作自体が煩わしくなってきたので、とりまこのブログ内だけでもなんとか自動化できないかとjQueryを組んでみる。
2011年も残りわずか。世間はクリスマスホリデーですっかりおやすみモードに。この休みを利用してWordPressで新しくブログを立ててみた。ホスト先のMySQLが4.1系なので最新のWordPress 3.3系は使えずやむなく3.1系をインストール。テーマはiFeatureを使うことにした。
プログラミング関連の記事を中心にしつつ、シリコンバレーの生活風景もちょろっと書いていこうかと。