SmallStyle


2010-09-15

_ 日記のテーマを修正した

ずいぶん前から iPhone でここをみるとレイアウトが大崩壊していることは認識していながら,ながらく放置していた日記のテーマをやっとのことで改修.といっても見た目はそう大きくは変えてない.変えてないけど CSS は完全に書き直したもの.大きく変更したのは,これまではサイドバーを右に表示していたけど,もろもろの情報はまとめて日記の下部に移動させたこと.どうも横にごちゃごちゃあっても見づらいだけだよなぁ,ということで.

ちなみにベースというかテンプレートにしたのは gustav.css.少なくとも iPhone での表示に問題がないことが確認できているテーマだったので,これをベースに手をいれたのだが,iPhone で表示したときに長い URL が折り返されずにレイアウトが崩れることになかなか気がつけずに時間がかかった.

CSS3 で新しく利用できるものなどもいくつか利用してみていて,なかなかすっきりまとまった感.Safari5,Chrome5,Firefox3.6 でとりあえずは問題なく表示されるのが確認できたので,まぁ,いいかな.

もともとこのベースとなったこのデザインに変更したのが 5 年ほど前ということで,ずいぶんと長い間変えていないということに自分でもびっくりしてみたり.無難にまとまっていて自分では気に入ってるからいいんですけどね.


2010-09-10

_ Picasa の画像を簡単に日記に挿入できるプラグインを書いてみた

しばらく Picasa の API をさわっていたので,せっかくなので tDiary のプラグインに使えないかなということで,ちょっと書いてみた.久々に Ruby のコード書くぞーと思っていたら,コードのほとんどが JavaScript になってしまった.というのも,tDiary の編集画面では,jQuery が標準でサポートされるようになったので,日記の編集画面で Picasa から写真をひっぱってきたりとかという部分を JavaScript で実装してみたから.Ruby のコードは日記に表示するためのと,更新画面のフォームを作成するくらい.

最初は jQuery のお作法がよくわからずに,あれやこれやと書いているうちになんとなく理解できてきたので,とりあえず動くところまではもってこれた.なんかもっときれいに書けそうな気もするけど…

picasa プラグインは,ウェブ上で一般公開指定されているアルバムを対象に,日記の編集画面からアルバムの一覧,画像の一覧を表示し,日記編集エリアに簡単に挿入することができるプラグインです.jQuery ライブラリを利用しているので tDiary 3.0 以降で動作します.

プラグインを動作させるためにはあらかじめ,tdiary.conf に以下の値を設定します.

@options['picasa.user'] = 'username'
@options['picasa.default_size'] = 400

picasa.user の設定は必須です.設定する値は Picasa の設定で全般で設定しているギャラリーの URL で指定しているユーザー名です.picasa.default_size は日記で表示する際の写真のサイズを指定します.

picasaプラグインのサンプル

日記の編集画面で本文の入力エリアの下に,「Get Picasa Album List」というボタンが追加されます.このボタンでアルバム一覧を取得し,表示されたアルバム一覧から,適当なアルバム名を選択すると画像のサムネイル一覧が表示されます.サムネイル画像をクリックすると日記の本文にプラグインを呼び出す形で URL が追記されます.(ちなみに一般公開されているアルバムなら指定したユーザーの誰のものでも取得できるので,サンプル画像はたださんの公開アルバムを勝手ながら利用させてもらっています)

プラグインでは,画像 URL の指定と,タイトルの指定ができるようになっています.また,picasa_right や picasa_left といった image プラグイン相当の呼び出し方も可能です.右のサンプル画像も Picasa の画像を直接表示しています.

というわけで,Picasa に一般公開の画像さえ用意すれば,簡単に日記に追加することが可能となるプラグインの紹介でした.よろしければご利用ください.


2010-09-04

_ 公式 Tweet ボタンがたくさんあると Safari がしばらく応答しなくなった

tDiary を利用しているサイトをいくつか開いたときに,なんだか読み込み完了までに妙に時間がかかることがあった.レインボーがくるくるまわって何もできなくなるので,なんだろなーと思って,時間のかかったのを見比べてみて共通していたのは…

  • 日記を月表示などでまとめて表示した場合に遅い
  • 公式 Tweet ボタンがセクション毎に設置されている

各日記の Tweet 数を取得してレンダリングするまでに時間がかかっているということか.日毎に表示した場合や数件の場合は影響はないけれども,月別表示など比較的日記のセクション数が多くなる場合はやっかいだなぁ.

とりあえず自分のところはやっつけプラグイン書いてたので,対策案が思いつくまではいったんプラグインを無効化することにした.月表示の時とかは Tweet 数を取得しないように切り替えるとか,なんかうまいこと考えた方がよさそう.(その後,日毎と最新の日記表示のときに表示するようにした)

まだ他のブラウザでは確認していないのですが,少なくとも Mac 版 Safari ではこうした問題が発生しています.

section_footer プラグインでツイートボタンを表示している tDiary には共通して発生する可能性のある問題になるんだろうな.


about me

いろいろと興味を持ったことを書いてます.ちょっとしたことは hb(@smallstyle) on Twitter で書いてます.

Archive

2003|01|02|03|04|05|06|07|08|09|10|11|12|
2004|01|02|03|04|05|06|07|08|09|10|11|12|
2005|01|02|03|04|05|06|07|08|09|10|11|12|
2006|01|02|03|04|05|06|07|08|09|10|11|12|
2007|01|02|03|04|05|06|07|08|09|10|11|12|
2008|01|02|03|04|05|06|07|08|09|10|12|
2009|01|02|03|04|05|06|07|08|09|10|11|12|
2010|01|02|03|04|05|06|07|08|09|10|11|12|
2011|01|02|03|04|05|06|07|08|09|10|11|12|
2012|01|02|03|04|05|06|07|08|09|10|11|12|
2013|01|02|03|04|05|06|07|08|09|10|11|12|
2014|01|02|03|04|05|06|07|08|09|10|11|12|
2015|01|02|03|04|05|06|07|08|09|10|11|12|
2016|01|02|03|04|05|06|07|08|09|12|