Blog

Rinker(リンカー)を導入してシンプルに可愛くするカスタマイズ!

こんにちは、ナナエ( @bemyselfusa)です。

ご覧いただきまして、ありがとうございます!

ブログを始めて3週間が経過しました。

最近ではInstagramやブログ村からもアクセスがあって、俄然やる気になっています!

ブログテーマJINの使い方にも慣れてきて、ちょっとずつカスタマイズしたくなってきた今日この頃(笑)

リンカーを導入してみたのですが、そのままだと見た目があまり可愛くなかったので、カスタマイズしてみました。

《Before》

《After》

やったー!可愛くなった♡

 

文字の大きさやボタンの色もお好みで変更できます。

リンカーを使えるようになるまでがなかなか大変で、設定からカスタマイズするのにちょっと苦労しました。

今回はリンカーの設定からカスタマイズするまでの流れ

私が実際にやってみて説明が分かりやすかったサイトを紹介していきますね!

Rinker(リンカー)とは

WordPressのプラグイン『Rinker』は記事の中に楽天やAmazon、Yahoo!ショッピングのアフィリエイトリンクが簡単に挿入できちゃう

とーーーっても便利なプラグイン!

ずっと気になってて、やっと使えた!

設定するまでが少し長かったですが、一度登録してしまえば本当に使いやすいです。

こちらが公式サイトになりますので、ダウンロードしてくださいね。

Rinker公式サイト

Rinkerを使うには

リンカーをダウンロードしただけではまだ使えません。

楽天AmazonYahoo!ショッピングが使えるように、各サイトでの登録が必要です。

それぞれのIDが必要だよ!

リンカーをダウンロードすると同時に以下のことをやる必要があります。

まずはざっくりと流れを頭に入れてください。

  1. 楽天会員になる(すでに会員の場合は登録必要なし)
  2. Amazonアソシエイトに登録する
  3. バリューコマース(ASP)に登録する
  4. バリューコマースでYahoo!ショッピングと提携する
  5. もしもアフィリエイト(ASP)に登録する
  6. もしもアフィリエイトで楽天とAmazonと提携する
  7. それぞれのIDをコピーしてリンカーに貼り付ける

 

ちょっと長いですが、一つ一つ順番にやっていきましょう。

バリューコマースともしもアフィリエイトに登録するのは、そこを経由して広告を出したほうが報酬の利率がいいからです。

簡単に登録できましたので、この二つのASPは登録しておきましょう!

《バリューコマース登録サイト》

《もしもアフィリエイト登録サイト》

 

Amazonアソシエイトに関しては、私はまだ登録できていない(2回も落ちてます…泣)ので、リンカーでは使えない状態です。

もしもアフィリエイトでAmazonと提携できたとしても、アソシエイトに登録できていなければIDを入手することができません。

 

詳しい設定のやり方は@sigezo150さんのブログで紹介されていましたので、登録が済み次第そちらを見ながら進めていけばスムーズに設定ができます。

sigezoさん、どうも有難うございました!

リンカーを使ってみよう!

設定が終わったらさっそく商品リンクを作ってみましょう♪

リンカーの使い方に関してもsigezoさんが詳しく説明してくださっています!

またしても人頼み!

だって素人には難しいんだもん!!

 

sigezoさん、本当に助かりました(涙)

もっと可愛くしたい!

さぁ、リンカーのダウンロードから設定、使い方までは理解しましたね?

長かったですよね、お疲れ様です!

でも、もうこれで楽に商品リンクを貼り付けることができます♪

通常であればリンカーで貼り付けたリンクはこんな感じです。

このリンクが貼れただけでも感動もの!

 

ボタンも1セットになってて最高だー♪

でも欲をいえばもっと可愛くしたい…笑

というわけで、カスタマイズ法を調べました。

リンカーのカスタマイズ法

まずは二つのことに注意してください!

①リンカーのカスタマイズはCSS部分の変更をする為、必ず事前にバックアップを取っておく。

②テーマを使用している場合は『子テーマ』で編集する。

私が参考にしたブログはこちらのHaruさんのカスタマイズページ↓

コピペして自分のCSSに貼り付けるだけでとっても簡単でした!

上記のHaruさんの記事内にコードがあるので、それをコピーしてくださいね。

Haruさん、有難うございます!

 

こんな感じに仕上がりましたよ〜!

可愛い!!!

色合いも好きだったので、私はとくに変更せずに使っています!

でも一つ気になるのが、この商品名の文字の羅列…。

ゴチャゴチャ書かれていて見にくいし、いかにも貼り付けました!って感じで好きじゃない(汗)

あとショップ名のボタンに『〜で探す』っていう文字を付け加えたい!

というわけで、Haruさんのカスタマイズ記事を参考にいじってみました。

私がやりたいことは2点。

  • ショップボタンを『楽天で探す』『Yahoo!ショッピングで探す』に変えたい。
  • 商品名を自分の好きなように書き換えたい。

 

これらを変えるには、商品リンクを貼り付けたあとにコードを変える必要があります。

まずは商品リンクを追加してくださいね。

そうする画面にこんなコードが表示されます↓

この数字のあとにコードを入れることでカスタマイズが可能。

Haruさんのカスタマイズ記事にいろんなカスタマイズのコードが紹介されているので、それを参考にアレンジしてくださいね♪

 

私のように両方とも変更したい場合は下記のようなコードになりました!

商品のIDのあとにコピペするだけ!

プレビューで見るとこんな感じです。

変更したかった2点がきちんとカスタマイズできています!

やっと完成!

 

長かったー!泣

でも自分のブログにあったリンクが貼れるようになったので大満足です!

文字色やボタンの色が違うだけでもイメージが変わると思うので、ぜひ自分のブログに合わせてカスタマイズしてみましょう。

最後までお読みいただき有難うございました。

それでは今日はこのへんで!

nana

ABOUT ME
nana
初めまして! ブログ管理人のnanaです。 アメリカ在住のアラサー主婦。 ちょっと人見知り。英語できない。家事も苦手。基本的にぼっちで自宅警備員やってます(笑)リアルなアメリカでの生活模様や教育での悩み、お得情報を共有したいと思ってブログを始めました。令和もよろしくお願いします!