シン・チャンネル ブログ

情弱アナログ人間ですがデジタルガジェット好きです。

メディアマーカーのはてなブログサイドバーへの設置方法。amazonアソシエイトも連携可能です。

 

読書管理をメディアマーカーのサイトでしており、このブログでもサイドバーに「読み終わった本」の表示をしています。

 

今日はメディアマーカーはてなブログサイドバーへの設置方法の話です。

 

 

 ブログパーツをつくります

 

メディアマーカーのサイトでサイドバー設置用のブログパーツを作ります。

 

その前に、amazonアソシエイトをしている方は、メディアマーカーの「設定」から

amazonアソシエイトIDを入力しておいて下さい。

 

それでは、ブログパーツの作成方法を紹介します。

まずは、メディアマーカーへログインし、「設定」→(右欄)「出力・連携」→「ブログパーツ」と進みます。

 

そこで、表示するパーツの詳細を設定します。

 

f:id:nonbirihappy:20150724145852p:plain

 

「テンプレート」ではパーツの種類を選択します。わたしのは「登録メディア【詳細・縦長】」です。

「登録メディア【シンプル・縦長】」がその名の通りシンプルで使いやすいかもしれません。

画面の下にいけばプレビューで確認できます。

 

「登録メディア【詳細・縦長】」の場合は「詳細」で表示するものを選ばなければなりません。わたしは「著者」だけを選択しています。

 

ちなみに、わたしの「画像サイズ」は「中」です。

 

「ヘッダー」の「文字」では、「メディアマーカー登録本」と表示されてますが、これは削除して空欄にしたほうがいいです。

はてなブログのサイドバー設定でもタイトルが選べます。

ここで入れてしまうと二重で表示されますし、はてなブログのタイトルのほうがかっこいいです。

 

f:id:nonbirihappy:20150724150333p:plain

 

あとは、表示する内容、タイミングを設定します。

わたしは、読み終わった本を表示させてますので、「読書」は「読了」を選択し、「並び順」は「読了日」を選択しています。

 

ここで、ひとつ注意点です。

リンク先は「アマゾンやWeサイトへ直接リンク」を選択してほうがいいと思います。

 

ここでは、本をクリックしたときにどのサイトに行くのかを選択するのですが、最初は「Myバインダー」になっています。

そのままですと、自分のメディアマーカーに飛ぶだけです。

 

ですので、アマゾンアフィリエイトをしている方だけでなく、「読んだ本の紹介をしているだけで自分のメディアマーカーまでオープンにするつもりはないよ」という方も「アマゾンやWeサイトへ直接リンク」を選んでおいたほうが無難です。

(ちなみに、Myバインダーの公開、非公開はバインダー設定から変更できます)

 

f:id:nonbirihappy:20150724150712p:plain

あとは、「コード取得」からコードをコピペすれば完成です。

 

 はてなブログへの設定方法

 

コピーしたコードをそのままはてなブログへ貼り付けます。

 

はてなブログでは、「デザイン」→「カスタマイズ」→「サイドバー」へ行きます。

 

「モジュールを追加」をクリックし、「</>HTML」を選択すると以下の画面になりますので、「タイトル」とコードを貼り付けると完成です。

 

f:id:nonbirihappy:20150724152606p:plain

 

 「タイトル」に入力したものが、サイドバーの上に表示されます。

 

これで完成です。

 

読書管理をオープンにしてもいいかなと思っている方は、サイドバーで遊んでみるのもおもしろいと思います。