楽天の買い物かごボタンをカスタマイズ

Tweet

Check

この記事の「買い物かごをカスタマイズする方法」は、2015年に楽天RMSのHTMLソースが変わったため、変更不可になりました。
ここに記載してあるのは、過去RMSで出来た裏ワザの情報です。

楽天の店舗様でよく見る、買い物かごボタンを目立つ画像にする方法です。

まず、「買い物かごに入れる」ボタンを作ってR－Cabinetに登録しておきます。

場所はどこでもいいですが、共通説明文（大）が分かりやすいので、
RMSの1-2デザイン設定で「共通説明文（大）」を開き、以下のHTMLを入力します。

買い物かごボタンをカスタマイズするHTML

<style type="text/css">
div table table table table input[value="買い物かごに入れる"] {
text-indent:-9999px;
width:219px;height:54px;
background: url(画像URL) no-repeat;
border:0;
margin:0px 0;
cursor:pointer;
font-size:12px;
color:#000000;
}
-->
</style>

HTMLの注意

div table table table table input[value=”買い物かごに入れる”]
の部分は、買い物かごに入れるボタンの名前を変えている場合は、そのボタン名を入れましょう。

width:219px;height:54px;
の部分は、作成した買い物かごボタンの画像サイズに合わせます。
widthの部分に作成した画像の横幅、heightの部分に縦を入力します。

background: url(画像URL) no-repeat;
の画像URLには、作成した画像をR-Cabinetに登録してそのURLを入力します。

表示の確認

入力ができたら、実際のページで確認します。

このようになっていたら、大丈夫です。