Octopressブログに画像を挿入するには、source/images下に画像ファイルをコピーし、Image Tag - Octopressに従って記事中にタグを記載すればよいらしい。
1
| {% img /images/a0960_005150_r.jpg 480 360 コスモス %}
|
だが、クリックで元画像を表示するという風には出来ないようだ。
元画像をポップアップで表示するプラグインも公開されているが、そこまで凝らなくてもよいと思ったので、画像に関してはhtmlタグを使うことにした。
1
| <img src="/images/a0960_005150_r.jpg" onclick="location.href = '/images/a0960_005150_r.jpg'; return false;" style="cursor:pointer;" border="0" width="480" height="360" alt="コスモス">
|
元画像を別ウィンドウで開きたい時は下記で良いようだ。
1
| <img src="/images/a0960_005150_r.jpg" onclick="window.open('/images/a0960_005150_r.jpg'); return false;" style="cursor:pointer;" border="0" width="480" height="360" alt="コスモス">
|
ーー
（追記）
下記のような馴染みの表記の方が良いような気もする。
1
| <a href="/images/a0960_005150_r.jpg" target=_blank><img src="/images/a0960_005150_r.jpg" alt="コスモス" width="480" height="360"></a>
|
それと、imgにはalt属性は必ず指定した方が良く、指定するほどの内容ではない場合にもalt=""と空欄で入れておいた方が良いのだとか。
img要素でalt属性の内容がポップアップしない - Web標準普及プロジェクト
