Hexoで画像を挿入する場合、画像を表示するためのタグはOctopressと同様で、

{(半角の%) img (class名) (画像へのパス) (幅) (高さ) (タイトル) %}

例えば

{(半角の%) img /images/a0960_005150_r.jpg 480 360 コスモス %}  #class名は省略

で良いようだ。
代わりに下記のようなhtmlタグを使っても良い。

<img src="/images/a0960_005150_r.jpg" alt="コスモス" width="320" height="240">

コスモス

OctopressではMarkdown式のタグだと、画像をクリックしたら原寸大で表示というのが出来なかったので、htmlタグの方が良いかと思ったが、Hexoの場合、Markdownタグで画像クリック→原寸大表示が出来るようだ。

Hexoでは_config.ymlのWritingの箇所でpost_asset_folderの値をtrueにするようを推奨している。
Writing | Hexo

説明通りpost_asset_folder: trueにして新規postを作ると、postフォルダ内に.mdファイルと同名のフォルダが作成される。
このフォルダに画像ファイルを入れよということらしい。
画像を多用する場合は整理に便利なのかもしれないが、ほとんど画像を使わない場合はかえって煩雑なので、source下にimageなどのフォルダを作ってそこへ入れた方が便利そうだ。

ーー
(追記)
テーマをFreewillにしたら画像が強制的に最大表示になってしまったので、freewill/source/css/style.cssのimgの箇所でwidth: auto;height: auto;を削除した。

表示   このエントリーをはてなブックマークに追加

Comments

2014年12月3日