読者です 読者をやめる 読者になる 読者になる

上機嫌でいこう。

本とか、音楽とか。本は新書を読むことが多く、音楽はクラシックやサウンドトラックを中心に。映画やDVDも好きで見ています。

はてなブログのサイドバーに、Amazonへのリンクを表示させる

こんばんは。

Amazonへのリンクを貼り込む

今日はちょっと投稿多めで失礼します。ご覧になるとお分かりいただけるように、サイドバーにAmazonへの商品リンクを掲示させました。ちょっとかっこいいと思いますけど、いかがでしょうか(笑)これのやり方を以下に記しておきます。

1)商品リンクを表示させる

まず、通常のやり方で、表示させたい商品のリンクを編集画面に写しこみます。こんな感じですね。

 

分断社会・日本――なぜ私たちは引き裂かれるのか (岩波ブックレット)

分断社会・日本――なぜ私たちは引き裂かれるのか (岩波ブックレット)

 

 

2)HTMLを取得(←この言い方、あっていますか?)

次に、HTMLを取得します。「見たまま」編集の方は、上部の「HTML編集」の項目をクリックします。すると、こんな表示がされています。

<div class="freezed">
<div class="hatena-asin-detail"><a href="http://www.amazon.co.jp/exec/obidos/ASIN/4002709523/AmazonアソシエイトのID/"><img class="hatena-asin-detail-image" title="分断社会・日本――なぜ私たちは引き裂かれるのか (岩波ブックレット)" src="http://ecx.images-amazon.com/images/I/51RZLwWx-kL._SL160_.jpg" alt="分断社会・日本――なぜ私たちは引き裂かれるのか (岩波ブックレット)" /></a>
<div class="hatena-asin-detail-info">
<p class="hatena-asin-detail-title"><a href="http://www.amazon.co.jp/exec/obidos/ASIN/4002709523/AmazonアソシエイトのID/">分断社会・日本――なぜ私たちは引き裂かれるのか (岩波ブックレット)</a></p>
<ul>
<li><span class="hatena-asin-detail-label">作者:</span> 井手英策,松沢裕作</li>
<li><span class="hatena-asin-detail-label">出版社/メーカー:</span> 岩波書店</li>
<li><span class="hatena-asin-detail-label">発売日:</span> 2016/06/04</li>
<li><span class="hatena-asin-detail-label">メディア:</span> 単行本(ソフトカバー)</li>
<li><a href="http://d.hatena.ne.jp/asin/4002709523/AmazonアソシエイトのID" target="_blank">この商品を含むブログ (1件) を見る</a></li>
</ul>
</div>
<div class="hatena-asin-detail-foot"> </div>
</div>
</div>

これをコピーします。

3)サイドバーを編集

最後にサイドバーを編集します。

・デザイン>カスタマイズ(スパナのマーク)>サイドバーと選択して、

・「モジュールを追加」。さらに、

・</>HTMLを選択して適当なタイトルをつけ、

・2)で取得した記述をペーストします。

・「適用」を押し、表示させたい位置に移動させて「変更を保存する」。

以上です。最初から「HTML編集」を利用されている方は、何ら問題なく表示させられると思います。

私は「見たまま編集」なので、1ステップ増えてしまいますが、ちょっといいなと思ってご紹介させていただきました。使い方に問題があるようなら、ご指摘いただければと思います。どうぞよろしくお願いいたします。