楽天 オリジナルのお気に入りボタン設置方法(PCページ)

楽天市場のPCページのお気に入りボタン、
少し小さくてわかり辛いですよね。

今購入を決められないけど、
気になってるお客様がいた時に、お気に入りに入れてもらえれば、クーポン発行時や、値下げした時、ポイントアップした時などに、楽天から自動で通知が届くようになっているので、
お気に入り登録者を増やすことで、購入につなげていくことも大切です。

そこで、お気に入り登録ボタンをオリジナルのものにする方法をご紹介します。

まずオリジナルの画像を準備しましょう。

例えばシンプルなものだと、こんな感じ。

この画像はキャビネットへ保存しておいてください。

次は設置ですね。設置場所は、
RMSトップ>デザイン設定>ヘッダー・フッター・レフトナビ

もしくは、
RMSトップ>デザイン設定>共通説明文(大)

どちらでも反映されます。(2021.06現在)

/——-PCお気に入りボタン————/
.favorite div.bookmarkArea div.bkm a.addBkm {
width: 数字を入れるpx !important; /ボタン画像の幅/
height: 数字を入れるpx !important; /ボタン画像の高さ/
}


.favorite div.bookmarkArea div.bkm a.addBkm span.bkmStar {background:url(“キャビネットへ登録した画像のURLを入れる”) no-repeat !important;
width: 数字を入れるpx !important; /ボタン画像の幅/
height: 数字を入れるpx !important; /ボタン画像の高さ/
}

指定の場所へ、上記のコードを張り付けましょう。
ボタンの画像の幅は、おおよそ400pxまで程度がお勧めです。