楽天市場　スマホでのお気に入りボタン表示

Question

スマホで楽天市場の商品を見ると下部に「商品をかごに追加する」と「ご購入手続きへ」のボタンが並んでいます。ここに「お気に入り商品に追加」のボタンを並べて表示することはできますか？可能ならその方法を教えていただきたいのですが。

Answer

ECマスターズの田中です。※RMSの、禁止タグを入力できるバグを利用する方法ですので、　今後、RMSの改修により、使用できなくなる可能性があります。最初に、下記内容をメモ帳に貼り付けてファイル名の末尾を「.js」にして、外部JSファイルとして保存し、楽天GOLDにアップロードしてください。= この下の行から ====================jQuery(function($){ $('#floatingThirdButton').appendTo('#floatingCartContainer'); $('#floatingThirdButton a').attr('href', 'https://my.bookmark.rakuten.co.jp/?func=reg&shop_bid=ショップID&itype=1&svid=101&iid=' + $("meta[property='apprakuten:item_id']").attr("content") );});= この上の行まで ====================※ショップIDは、ショップ内検索のURLに含まれる６桁の数字、　または、商品編集画面でご確認いただけるRAC番号の上６桁にご変更ください。次に、下記内容をメモ帳に貼り付けてファイル名の末尾を「.css」にして、外部CSSファイルとして保存し、楽天GOLDにアップロードしてください。= この下の行から ====================#floatingCartContainer .cartButton { width: calc( 50% - 30px ) !important;}#floatingCartContainer .cartButton>a { font-size: 11px !important;}div#floatingThirdButton { float: left; width: 52px; height: 52px; background: red;}= この上の行まで ====================最後に、下記内容をスマートフォン用の商品ページ共通説明文に挿入していただくことで、商品ページ下部に「お気に入り商品に追加」機能を持つボタンを追加することができます。= この下の行から ====================

★

= この上の行まで ====================※外部CSSファイルのURL・外部JSファイルのURLは、　実際のURLに置き換えてご利用ください。上記ソースの場合、「お気に入り商品に追加」ボタンの部分には赤背景に★が１つ表示される状態となります。まずは上記ソースの状態で設置して、表示をご確認いただき、★をタグに置き換えて、ご希望の画像ファイルに差し替えるなど、改良を行った上でご利用ください。

Answer

スマートフォン用の商品ページ共通説明文に挿入したところ、「許可されないHTMLタグ "script" が入力されています。」のエラーが出て登録できません。どうしたらよいでしょうか？

Answer

ECマスターズの田中です。失礼いたしました、共通説明文に挿入するソースに必要な記述（禁止タグ入力バグ用の記述、および終了タグ）が抜けておりましたので、追記させていただきました。お手数をおかけしますが、再度ソースをご確認の上、共通説明文への挿入をお試しいただきますようよろしくお願いいたします。

Answer

追記のソースを使用しましたが、今度は許可されないHTMLタグ "a" の属性 "style" が入力されています。 HTMLタグ "a" の属性値 "href" には、 https から始まるURLを入力してください。のエラーメッセージが出ます。

Answer

ECマスターズの田中です。度々お手数をおかけしてしまい、申し訳ありません。改めて修正させていただいたソースの通り、<a>タグからhref属性およびstyle属性を削除していただきますよう、何卒よろしくお願いいたします。

Answer

ボタンをアップすることはできましたが、「商品をかごに追加する」と「ご購入手続きへ」と「お気に入り商品に追加」のボタンの大きさを揃えたいと思います。今は、「商品をかごに追加する」と「ご購入手続きへ」のボタンが同じ大きさで、「お気に入り商品に追加」のボタンが小さい表示となっています。

Answer

ECマスターズの田中です。＞「商品をかごに追加する」と＞「ご購入手続きへ」と「お気に入り商品に追加」のボタンの大きさを揃えたいと思います。「商品をかごに追加する」「ご購入手続きへ」各ボタンの横幅を#floatingCartContainer .cartButton の width属性で縮めて、「お気に入り商品に追加」ボタンの横幅をdiv#floatingThirdButton の width属性で設定する、という仕組みになっておりますので、縮める横幅・設定する横幅、各値を調整することで揃えることができます。たとえば、それぞれwidth: calc( 50% - 15% ) !important;width: calc( 30% - 8px );にご変更いただくことで幅を近づけることができます。本番環境でご変更いただく前に予めお含みおきいただきたいのですが、今回ご変更いただく各ボタンは楽天全ショップで共通のパーツとなっております。ガイドラインの禁止行為で触れられてはおりませんので、ご変更いただいても減点の対象とはなりませんが、変更しすぎることによって、本来あると思った位置にボタンが存在しないことでお客様にご不便をおかけすることになる可能性がございますので、過度な変更はなさらないよう、お含みおきいただきますようお願いします。

Answer

何度もお手数をおかけいたしました。ありがとうございました。

楽天市場 スマホでのお気に入りボタン表示

カテゴリーから探す

楽天市場　スマホでのお気に入りボタン表示