nanocで手軽にAmazonアソシエイトリンクするフィルタ
nanocでブログを再構築してからは、Amazonのリンクをアソシエイトの管理画面で生成していました。
しかし、やはり毎回管理画面を開いて操作するのは面倒なので、Markdown的な書き方で簡単にリンクできるようにフィルタを追加することにしました。
ここでは、nanocで簡単にAmazonアソシエイトリンクを貼るカスタマイズについて紹介します。
nanoc用Amazonアソシエイトリンク・フィルタ 完成イメージ
本カスタマイズにより、以下のような表記で記事内からAmazonにリンクできるようになります。
インラインリンク
ほげほげ%[入門vi 第6版](4873110831)ふがふがほげほげ入門vi 第6版ふがふが
画像・コメント付きブロック
%[入門vi 第6版](4873110831, Emacsと人気を二分するスクリーンエディタであるviについての、唯一といっていい本格的な解説書。)
入門vi 第6版
Emacsと人気を二分するスクリーンエディタであるviについての、唯一といっていい本格的な解説書。
nanoc用Amazonアソシエイトリンク・フィルタ 実装
実装内容は、まず「lib/default.rb」にフィルタの定義を追加します。
#Amazonアソシエイトリンクフィルタ
class AmazonLinkFilter < Nanoc::Filter
identifier :amazon_link_filter
def run(content, params={})
#インラインリンクフォーマット : %[商品名](商品ID)
amazon_link = '<a href="http://www.amazon.co.jp/gp/product/\2?tag=nase-22" target="_blank" title="\1">\1</a>'
mod_content = content.gsub(/%\[(.*?)\]\(([^,]*?)\)/, amazon_link)
#画像付きブロックフォーマット : %[商品名](商品ID, コメント)
amazon_link = <<'EOS'
<p class="amazon_link">
<a href="http://www.amazon.co.jp/gp/product/\2?tag=nase-22" target="_blank" title="\1">
<img src="http://images-jp.amazon.com/images/P/\2.09.MZZZZZZZ.jpg" alt="\1" />
\1
</a>
<br /><span class="amazon_comment">\3</span>
</p>
EOS
mod_content = mod_content.gsub(/%\[(.*?)\]\(([^,]*?),\s*([^,]*?)\)/, amazon_link)
end
end次に、「Rules」でこのフィルタを適用することを指定します。
compile '*' do
～中略～
case item[:extension]
when 'mkd'
filter :jp_markdown_filter
filter :amazon_link_filter #←追加
filter :redcarpet, :options => {:fenced_code_blocks => true},
:renderer => MyRedcarpetRenderer
layout 'default'
～中略～
end
end
end
あとはCSS(sass＋compass)でレイアウトを調整して完成です。
～中略～
.amazon_link
+clearfix
img
+float-left
:margin-right 10px
:border none
.amazon_comment
:display block
:margin-top 5px
～中略～
参考ページ
おわりに
他にAmazonの商品ページからリンク用文字列をコピーするブックマークレットとかがあるとよい気がします。
