前回の続きです。
画像投稿の方法とブログ感を出すために必要な各種プラグインの導入について書きます。
#画像の投稿方法
Hexoにおいて画像の投稿は若干癖があります。
##記事に画像を添付する場合
_config.yml
の次の値をtrueに書き換えます。(デフォルト値はfalse)
post_asset_folder: true
これにより記事作成時にsource/_posts/
下に記事名と同名のディレクトリが作成されるようになります。
このディレクトリに対して添付したい画像を追加します。ここではlena.bmp
とします。
記事名.md
の中で画像を挿入したいところで{% asset_img lena.bmp 画像のタイトル %}
と記述することで画像の挿入ができます。
画像をリンクにしたいときは{% asset_link lena.bmp 画像のタイトル %}
と記述することで可能になります。
画像のタイトルを省略すると画像ファイル名がそのまま出力されてしまうのでご注意願います。
なおこの方法では画像のスケーリングができないので、今後のプラグイン拡充に期待です。
これらの詳細については公式リファランスを参照願います。
##markdown記法による画像の挿入
markdownに対応しているので![レナ](lena.bmp)
と記述することで画像が挿入できるのですが…
仕様上URLルートから参照することになってしまうため、この記述だとhttp://example.com/lena.bmp
を見ているのと同義になります。
以前のHexo 2.x系ならば解決できるプラグインhexo-tag-asset-res
があったのですが、現在のHexoに対して対応していません。
なおここで{% post_path 記事名 %}/
による補完が可能かどうかを調べましたがパースがおかしくなるため正しく動作しません。
##imgタグの挿入
公式の画像タグによる画像挿入はうまく動作しません。
またassetディレクトリを参照する方法もうまくできません。
そのためかなりアレゲですがmarkdownの中でHTMLのimgを挿入することでお茶を濁す方法があります。
次のように記述するとその個所にasseディレクトリの画像を参照してその個所に画像を挿入できます。
<img src="{% post_path 記事名 %}/lena.bmp" />
この方法であればスケーリングも可能ですし、その他もろもろのことが可能です。
なおHexoは{% post_path 記事名 %}
によってリンクを生成するときに絶対パスに変換してくれるので、個別の記事でもインデックスページでも見ることができます。
#各種プラグインの導入
##RSS
npm install hexo-generator-feed --save
を実行することでRSSが出力される様になります。
なお標準設定(フォーマットがatomで出力先がatom.xmlで20件まで)であれば_config.yml
の編集はいりません。
##Sitemap
hexoは標準ではsitemapを出力する機能が備わっていません。
sitemapを出力するプラグインは2つありますが、まあ人があまり見るものでもないし...ということでSEO向けとされるプラグインを入れることをお勧めします。
npm install hexo-generator-seo-friendly-sitemap --save
を実行することでsitemap.xml
が出力される様になります。
_config.yml
を編集することで出力ファイル名を編集できますが恐らくする必要はないでしょう。
##コメント機能
まあ普通disqusを入れればいいのですが…3.xになってからドキュメントを見る限りその機能が保留状態の様です。(正確に言えばテーマファイルが対応していない)ので今後に期待ということで…
以上になります。