完全解説！商品リンクプラグインRinker(リンカー)が超便利！設定と使い方

Rinker設定・AmazonPA-APIの利用ポリシー変更とPA-API v5への移行について

Rinkerとは、Amazon、楽天、Yahoo、他、最大７つのASPリンクが可能でフリーHTMLも記述できる商品検索からリンク挿入までワンクリックで可能な商品管理プラグインです。 Rinker自体の設定は以下をご覧ください。 Amazon...

ayaito.net

商品リンクをCSSのみで利用する方法は以下をご覧ください。

コピペで！アフィリエイト商品リンクをツールを使わずCSSのみでデザイン

はじめに アフィリエイトで商品を紹介する際のリンクカードデザインとして ツールでは　カエレバ、プラグインでは　Rinker　など便利なものががあります。 カエレバサンプル Rinkerサンプル ツールやプラグインのデメリット カエレバは、１...

ayaito.net

Rinkerの特徴

「Rinker」は無料のプラグインで、ワードプレスのエディタ内で商品検索からリンク作成までクリック数回で完了するので、圧倒的に時短できます。

デフォルトで見た目はこんな感じです。

 

Yahooショッピングについては、「もしもアフィリエイト」経由より「バリューコマース」経由の方が報酬率が良いため、バリューコマースにも対応しています。

 

日々、進化しているプラグインですので、最新情報はリリース情報をご覧下さい。

Rinkerリリース情報

 

カエレバとの比較

Rinkerの方が優れている点

商品紹介ブログパーツでは「カエレバ」が有名で、使われている方も多いですが、商品リンクを貼る際はブラウザですべての情報を入力する仕組みでブラウザを行ったり来たりするのがちょっと面倒です。

その点「Rinker」なら超簡単で速いです。

最初にプラグインの設定だけしておけば、あとはいつでも記事を書きながらエディタ内のボタンからスイスイ、リンクを作れますし、作成したリンクも保存されていてワンクリックで再利用可能。

 

更に「カエレバ」の商品リンクは長いコードになりますが、「Rinker」ならショートコードなので短いだけでなく、リンク枠のすぐ下から通常入力してもデザインが崩れるような事はありません。

リンクも自由設定可能。（Ver.1.4.10～　４つ）

 

ASPリンク数

対応アフィリエイトは「カエレバ」の方が多いですが、Rinkerには自由ボタンが４つ設定可能なので最大７つのASPリンクが可能、フリーHTMLも記述できます。

• Amazon
• 楽天
• Yahooショッピング
• ＋　自由ボタン４つ

ボタン１と３は前に、２と４は後ろに表示されます。

 

• Yahooショッピング
• Amazon
• 楽天
• セブンネットショッピング
• 価格.com
• ベルメゾンネット
• セシール

カエレバの見た目　例（CSSカスタマイズ後）

 

カエレバは定番ブログパーツなので、利用者が多く、カスタマイズサイトなども多い事や、テーマによっては「カエレバ」のデザイン編集が設定されているものもあります。

 

 

必要なもの

• プラグイン　Rinker
• Amazonアソシエイトのアカウント（Access Key、Secret Key）
• もしもアフィリエイトの楽天 ID、Amazon ID
• バリューコマースのYahoo用設定コード

※Rinkerで対応できる「楽天」「Amazon」「Yahoo」のアカウントはすべてあった方が良いですが、「もしもアフィリエイト」と「バリューコマース」は必須ではありません。

それぞれの本家からも可能ですし、「もしもアフィリエイト」経由も可能です。

 

「もしもアフィリエイト」「バリューコマース」利用の場合

もしもアフィリエイトの登録～使い方は以下を参考にして下さい。

もしもアフィリエイトの始め方（登録・提携・広告掲載方法）

※アイキャッチ画像や画面コピーはもしもアフィリエイトより引用 「もしもアフィリエイト」とは ASP(Affiliate Service Provider)。アフィリエイト広告を配信しているサービスです。 個人特化型アフィリエイトサービス。使...

ayaito.net

 

もしもアフィリエイトにログイン（またはアカウント作成）し、楽天・Amazonと提携しておきましょう。

※確か、楽天は即時提携可能でしたが、Amazonは申請から数日かかります。

 

はじめて登録した場合は、「はじめての方」のリンクから、内容に従い最初にするサイト設定などを行います。

 

更に下に進むと「STEP2」の項目に、Amazonと楽天市場がありますので、ここからそれぞれのページへ遷移し「提携申請」を行います。

 

バリューコマースは登録がなくても、この設定の流れから作成～コード取得まで出来ますので、設定しながら必要な時に作成で大丈夫です。

 

ダウンロード・インストール

RinkerはBOOTHのサイトより（無料）ダウンロードします。
BOOTHを初めて利用する場合は、pixiv に登録する必要があります。

Rinker ダウンロードサイト

 

初めて登録した場合は、「pixiv IDを発行しました。IDの認証を行ってください」というメールが届きますので、内容に従って認証を行います。

 

 

 

プラグインのアップロード

ダウンロードしたファイルを圧縮形式のままアップロードします。

 

 

設定方法

基本設定

プラグインを有効化すると、「設定」メニューに「Rinker設定」が追加されます。

 

商品情報を再取得するかどうかの設定。「再取得しない」にすると価格が表示されません。「再取得する」にチェックが良いかと思いますがお好みで。

 

Amazonの設定

 

Amazonアソシエイトにログインします。

 

 

 

 

 

 

楽天の設定

 

 

 

 

 

Yahoo!の設定

Yahooショッピングについては、「バリューコマース」経由で設定します。

 

 

 

 

 

もしもアフィリエイトの設定

もしもアフィリエイトにログインし、提携中プロモーションページへ。

 

 

Amazonの「広告リンク取得」ボタンを押します。

 

 

 

 

最後に「Google Analytics トラッキング」にチェックを入れておくと、アナリティクスでクリック数やクリックされた記事などが見られます。

アナリティクスの見方は、「行動」→「イベント」→「ページ」です。

 

 

使い方

 

 

 

ver1.4.6からkindle機能が追加され、Amazonのカテゴリーが選択出来るようになりました。

 

 

 

商品リンクの文字列を変更する

商品名が長すぎる場合や、タイトルの編集を行いたい場合は、

商品リンク追加ボタンから「登録済み商品リンクから検索」タブを選択し、対象の商品の「リンク編集」ボタンを押します。

 

記事と同様の画面が開きますので、タイトルに当たる部分を編集し、記事同様「更新」ボタンを押します。

 

これでタイトルが編集され、リンクを挿入すると変更されています。

※タイトル編集した画面は、「更新」ボタンを押した後、閉じて大丈夫です。

 

商品リンクの編集

商品リンクから「編集」で個別に編集が可能です。

 

 

楽天・Amazon・Yahooボタンを外す

初期ボタンの３つ（のどれか）を表示したくない場合も、商品リンク編集から可能です。

 

Amazon、楽天を削除した表示例

 

自由ボタンの使い方

 

商品リンク設定の項目に自由ボタン１～４があり、それぞれにボタンの名前とURLを入れる事で表示されます。

※ボタン名のみ入力し、URL未入力だと表示されません。

 

表示される位置やボタンのカラーは以下の通りです。

 

 

 

ブランド名・フリーHTMLの使い方

ブランド名やフリーHTMLも自由に追加できます。

 

 

表示される位置は以下の通りです。

 

 

商品リンクの管理

メニューの「商品リンク」から管理できます。

作成済みリンクの管理

• 表示数
• ショートコード
• 利用記事

 

以下はクイック編集時の画面

 

 

商品リンクカテゴリー

通常のカテゴリーのように編集できます。

 

表示例　↓

 

カスタマイズ

リンクボタンの文字を変更する

以下のパラメータに自由に文字列を指定し、ショートコードに追加する事でリンクボタンの文字列を変更できます。

 

【例】

［itemlink post_id=”○○○”］

 

 

ボタンの色やデザインを編集する

ボタンの色、タイトルの文字サイズなどCSSで自在にカスタマイズも可能です。

商品リンクのHTMLは、ざっと以下のようになっています。

<div class="yyi-rinker-contents>
<div class="yyi-rinker-box">
<div class="yyi-rinker-image">
画像
<div class="yyi-rinker-info"></div>
<div class="yyi-rinker-title"><p>タイトル</p></div>
<div class="yyi-rinker-detail">
<div class="credit">Rinker</div>
<div class="price-box"></div>
<ul class="yyi-rinker-links">
<li class="freelink1"></li>/*自由ボタン１～４は使っている場合のみ*/
<li class="freelink2"></li>
<li class="amazonlink"></li>
<li class="rakutenlink"></li>
<li class="yahoolink"></li>
<li class="freelink3"></li>
<li class="freelink4"></li>
</ul>
</div>
</div>
</div>

 

上記から、それぞれのクラスを使ってCSSでデザインをカスタマイズ出来ます。

全体　－　yyi-rinker-contents
枠　－　yyi-rinker-box
商品画像　－　yyi-rinker-image
商品タイトル　－　yyi-rinker-title
商品詳細　－　yyi-rinker-detail
リンクボタン　－　yyi-rinker-links
Amazonリンク　－　amazonlink
楽天リンク　－　rakutenlink
Yahooリンク　－　yahoolink
自由ボタン１　－　freelink1
自由ボタン２　－　freelink2
自由ボタン３　－　freelink3
自由ボタン４　－　freelink4

 

【例】タイトル編集

.yyi-rinker-title a {/*商品タイトル*/
font-size: 16px;/*文字サイズ*/
font-weight: bold;/*文字を太字*/
}

【例】ボックス枠編集

div.yyi-rinker-contents {/*商品リンク*/
background-color: #ffffff;/*全体の背景色*/
box-shadow: 0 2px 5px rgba(0, 0, 0, .13);/*影*/
}

【例】リンクボタンを各ショップテーマカラーにする

div.yyi-rinker-contents ul.yyi-rinker-links li.amazonlink {/*Amazonボタン*/
background: #ff9900;
}
div.yyi-rinker-contents ul.yyi-rinker-links li.rakutenlink {/*楽天ボタン*/
background: #bf0000;
}
div.yyi-rinker-contents ul.yyi-rinker-links li.yahoolink a{/*Yahoo!ボタン*/
background: #410093;
}

上記２つ（枠とボタン色）のカスタマイズでの見た目

 

自由ボタンの色を変える

自由ボタン１～４のクラス名は以下ですので、色を変更したいボタンのクラスで記述して下さい。

自由ボタン１　－　freelink1
自由ボタン２　－　freelink2
自由ボタン３　－　freelink3
自由ボタン４　－　freelink4

例：ボタン１のカラーを黒にした場合

div.yyi-rinker-contents ul.yyi-rinker-links li.freelink1 {/*自由ボタン１*/
background: #000000;}

 

デフォルトの色は以下

 

色変更の場合は以下もご利用下さい。

マカロンビビッドパステル和色セーフ色名 赤桃青紫黄橙緑茶黒

 

 

アップデート

Rinkerのアップデートは、リリースされるとワードプレスのプラグインに更新情報が出ますので、そちらから簡単に更新可能です。

 

Rinker　クレジットを消したい場合は、note支援、スポンサー、fannboxサポーターになる事で可能です。
詳細は　こちら

 

以上です。