アフィリエイトを行う場合、Amazonや楽天市場など、これまで1つ1つ記事に貼り付けていたリンクを1つにまとめて行うことができます。ユーザーにとっても、同じ商品を価格など比較しながら複数のサイトを同時にみれるため、非常に便利です。
「わかったブログ」管理人のかん吉さんが最強のブログパーツを開発してくれました。
カエレバ、ヨメレバは、いづれも複数のショップリンクがついた商品紹介のブログパーツです。カエレバは、商品を紹介するブログパーツで、ヨメレバは、書籍専用のブログパーツです。カエレバでは、Amazon、楽天市場、Yahooショッピングなどの複数のショッピングモールへのリンク、ヨメレバではAmazon、楽天ブックス、e-honなどの複数のブックショップへのリンクを表示できます。ヨメレバ、カエレバともに「ユーザデータ入力」の画面に、サイト名、各アフィリエイトのIDを入力し、登録すれば、あとは作成したい商品名で検索すると、自動で商品リンクを作成してくれますので、ブログに貼り付ければ完成です。
目次
サイトの表示

ユーザーデータの登録
登録画面の表示

ユーザーデータの登録
サイト名、アフィリエイトIDなどのユーザーデータを登録したら、「保存」を押下します。ユーザーデーターの保存はCookieを利用しているため、Cookie機能をONにします。
カエレバのユーザーデータ
ヨメレバのユーザーデータ
ブログパーツの生成
サイトの表示
ここでは、ICレコーダと入力してみます。

商品の選択

ブログパーツの装飾
rel=nofollowを選択
ショップの選択
リンクリストの取得
リンクリストをコピーして、ブログに貼り付けます。
CSSのカスタマイズ
CSSをカスタマイズして、下記のコードをsimplicityのstyle.cssに追加します。
RoughLog(ラフログ)さんのサイトのカスタマイズを使わさせて頂きました。ありがとうございます。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 | /* カエレバ、ヨメレバ、トマレバ */ .cstmreba { width:100%; height:auto; margin:36px 0; } .booklink-box, .kaerebalink-box, .tomarebalink-box { width:100%; background-color: #fff; overflow: hidden; } /* サムネイル画像ボックス */ .booklink-image, .kaerebalink-image, .tomarebalink-image { width:150px; float:left; margin:0 14px 0 0; text-align: center; } .booklink-image a, .kaerebalink-image a, .tomarebalink-image a { width:100%; display:block; } /* サムネイル画像 */ .booklink-image a img, .kaerebalink-image a img, .tomarebalink-image a img { margin:0 ; padding: 0; text-align:center; } .booklink-info, .kaerebalink-info, .tomarebalink-info { overflow:hidden; line-height:170%; color: #333; } /* infoボックス内リンク下線非表示 */ .booklink-info a, .kaerebalink-info a, .tomarebalink-info a { text-decoration: none; } /* 作品・商品・ホテル名 リンク */ .booklink-name>a, .kaerebalink-name>a, .tomarebalink-name>a { border-bottom: 1px dotted ; color:#2098A8; font-size:16px; } /* 作品・商品・ホテル名ホテル名 リンク ホバー時 */ .booklink-name>a:hover, .kaerebalink-name>a:hover, .tomarebalink-name>a:hover { color: #722031; } /* powered by */ .booklink-powered-date, .kaerebalink-powered-date, .tomarebalink-powered-date { font-size:10px; line-height:150%; } .booklink-powered-date a, .kaerebalink-powered-date a, .tomarebalink-powered-date a { border-bottom: 1px dotted ; color: #2098A8; } /* 著者・住所 */ .booklink-detail, .kaerebalink-detail, .tomarebalink-address { font-size:12px; } .kaerebalink-link1 img, .booklink-link2 img, .tomarebalink-link1 img { display:none; } .booklink-link2>div, .kaerebalink-link1>div, .tomarebalink-link1>div { float:left; width:31%; min-width:125px; margin:0.5% 1%; } .booklink-link2 a, .kaerebalink-link1 a, .tomarebalink-link1 a { width: 100%; display: inline-block; text-align: center; font-size: 13px; font-weight: bold; line-height: 180%; padding:3% 1%; border-radius: 4px; box-shadow: 0 2px 0 #ccc; background: -moz-linear-gradient(top,#FFF 0%,#EEE); background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee)); } .booklink-link2 a:hover, .kaerebalink-link1 a:hover, .tomarebalink-link1 a:hover { text-decoration: underline; } /* ボタンカラー */ /* トマレバ */ .tomarebalink-link1 .shoplinkrakuten a { color: #76ae25; }/* 楽天トラベル */ .tomarebalink-link1 .shoplinkjalan a { color: #ff7a15; }/* じゃらん */ .tomarebalink-link1 .shoplinkjtb a { color: #c81528; }/* JTB */ .tomarebalink-link1 .shoplinkknt a { color: #0b499d; }/* KNT */ .tomarebalink-link1 .shoplinkikyu a { color: #bf9500; }/* 一休 */ .tomarebalink-link1 .shoplinkrurubu a { color: #000066; }/* るるぶ */ .tomarebalink-link1 .shoplinkyahoo a { color: #ff0033; }/* Yahoo!トラベル */ /* カエレバ */ .kaerebalink-link1 .shoplinkyahoo a {color:#ff0033;} /* Yahoo!ショッピング */ .kaerebalink-link1 .shoplinkbellemaison a { color:#84be24 ; } /* ベルメゾン */ .kaerebalink-link1 .shoplinkcecile a { color:#8d124b; } /* セシール */ .kaerebalink-link1 .shoplinkkakakucom a {color:#314995;} /* 価格コム */ /* ヨメレバ */ .booklink-link2 .shoplinkkindle a { color:#007dcd;} /* Kindle */ .booklink-link2 .shoplinkrakukobo a{ color:#d50000; } /* 楽天kobo */ .booklink-link2 .shoplinkbk1 a { color:#0085cd; } /* honto */ .booklink-link2 .shoplinkehon a { color:#2a2c6d; } /* ehon */ .booklink-link2 .shoplinkkino a { color:#003e92; } /* 紀伊國屋書店 */ .booklink-link2 .shoplinktoshokan a { color:#333333; } /* 図書館 */ /* カエレバ・ヨメレバ共通 */ .kaerebalink-link1 .shoplinkamazon a, .booklink-link2 .shoplinkamazon a { color:#FF9901; } /* Amazon */ .kaerebalink-link1 .shoplinkrakuten a , .booklink-link2 .shoplinkrakuten a { color: #c20004; } /* 楽天 */ .kaerebalink-link1 .shoplinkseven a, .booklink-link2 .shoplinkseven a { color:#225496;} /* 7net */ /* ボタンカラー ここまで*/ .booklink-footer { clear:both; } /*** 解像度480px以下のスタイル ***/ @media screen and (max-width:480px){ .booklink-image, .kaerebalink-image, .tomarebalink-image { width:100%; float:none; } .booklink-link2>div, .kaerebalink-link1>div, .tomarebalink-link1>div { width: 48%; } .booklink-info, .kaerebalink-info, .tomarebalink-info { text-align:center; } } |
「トマレバ」の画像サイズは「150px」を選択、「カエレバ」「ヨメレバ」の画像サイズは「小」を使用します。