日記をスマートフォン対応に

この日記を iPod touch で開いてみたら、まともに表示されなくて読めたものじゃなかった。 先日の某飲み会では、参加者の全員が iPhone もしくは iPod touch を所有していたこともあり、スマートフォンでもちゃんと読めるようにした。

スタイルシートの修正

これまで使っていたスタイルシートをやめて、たださんのグスタフテーマベースに変更した。 変更した理由は、最初からスマートフォン対応のCSSが書かれているため。

スマートフォンでサイドバーを非表示に

iPhoneなどのスマートフォン向けデザイン手法 - tDiary.orgを参考に、スマートフォンの場合はサイドバーを表示させないようにした。

flickr.rb プラグインの画像サイズをスマートフォンに対応

flickr プラグインで写真を大きめに出力していると、スマートフォンで表示した場合に横幅が大きくはみ出してしまっていた。 なので、スマートフォンの場合は出力サイズを強制的に small (幅240ピクセル) に設定するようにした。

Index: flickr.rb
===================================================================
--- flickr.rb   (リビジョン 38304)
+++ flickr.rb   (リビジョン 38305)
@@ -27,6 +27,7 @@
     return '[ERROR] flickr.rb: API Key is not specified.'
   end
   size ||= @conf['flickr.default_size'] || 'small'
+  size = 'small' if @conf.iphone?
   photo = flickr_photo_info(photo_id.to_s, size)
   unless photo
     return '[ERROR] flickr.rb: failed to get photo.'

その他、スタイルシートを微調整して完成。 一応、まともに表示されるようになったはず。