スマホ商品ページにお気に入りボタンを作成したい

Question

http://item.rakuten.co.jp/e-zakkamania/70133-9080599/こちらのスマホ商品ページのように右側にお気に入りボタンを設定したいのですが、現在画像のみ準備しただけで設置に悩んでおります。現在、スマホ商品共通ページにはアイフレームでGOLDにページを作成したもの（フローティングヘッダーとバナーを並べただけの状態の商品共通ページ）を入れ込んでいます。お時間頂き誠に恐縮ですが、ご教授をお願いします。

Answer

ECマスターズの田中です。※楽天RMSの、禁止タグを入力できるバグを利用する方法ですので、　今後、RMSの改修により、使用できなくなる可能性があります。最初に、お気に入りボタンとして表示させる画像ファイルをご用意いただき、R-CabinetもしくはGOLDにアップロードしてください。次に、下記の内容をメモ帳に貼り付け、ファイル名の末尾を「.css」にして保存していただき、GOLD内にアップロードしてください。===== この下の行から ================#spFixedBookmark {display: block;position: fixed;top: 画面上端からの距離px;right: 画面右端からの距離px;width: お気に入りボタン画像の表示横幅px;height: お気に入りボタン画像の表示縦幅px;z-index: 100000;background: url(お気に入りボタン用画像URL) no-repeat center 0;text-indent: -100%;overflow: hidden;background-size: contain;}===== この上の行まで ================※画面上（右）端からの距離、お気に入りボタン画像の表示横（縦）幅は、　実際の半角数字にご変更ください。※topをbottomに変更することで下端から、　rightをleftに変更することで左端からの距離で　位置を指定することができます。※お気に入りボタン用画像URLは、実際のURLにご変更ください。続いて、下記の内容をメモ帳に貼り付け、ファイル名の末尾を「.js」にして保存していただき、GOLD内にアップロードしてください。===== この下の行から ================jQuery(function($){ $('#spFixedBookmark').attr('href', 'https://my.bookmark.rakuten.co.jp/?func=reg&shop_bid=ショップID&panf=0&tax=0&postage=0&itype=1&svid=101&iid=' + $('input[name=item_id]').eq(0).val() );});===== この上の行まで ================※ショップIDの部分は、ショップ内検索のURLに含まれる６桁の数字、　またはRAC番号の上６桁にご変更ください。最後に、スマートフォン用共通説明文に下記のHTMLタグを貼り付けることで、お気に入りボタンを設置することができます。===== この下の行から ================　===== この上の行まで ================※外部CSSファイルのURL、外部JSファイルのURLは、実際のURLにご変更ください。

Answer

ありがとうございます。おかげ様で無事設置することができました。位置の変化で様々なことに応用できそうなので、また別に挑戦してみます。

スマホ商品ページにお気に入りボタンを作成したい

カテゴリーから探す