楽天スマホページの商品名・価格表記について

Question

お世話になっております。

下記店舗さまのスマホ商品ページのように
商品ページ上部に、価格を入れたいのですが
どのように行えばよいでしょうか？

https://item.rakuten.co.jp/low-ya/vg-lewis/

お手数ですが、ご返信お願い致します。

Answer

ECマスターズの田中です。

※RMSの、禁止タグを入力できるバグを利用する方法ですので、
　今後、RMSの改修により、使用できなくなる可能性があります。

> 下記店舗さまのスマホ商品ページのように
> 商品ページ上部に、価格を入れたいのですが
> どのように行えばよいでしょうか？

いただいた店舗では、JavaScriptにより
価格表示用のHTMLをコピーして、商品ページ上部に複製しております。

最初に、下記内容をメモ帳に貼り付けて
ファイル名の末尾を「.js」にして、
外部JSファイルとして保存し、
楽天GOLDにアップロードしてください。

= この下から ================
jQuery(function($) {
    "use strict";
  var cart = $("#rakutenLimitedId_cart").html();
  $("#itemName").after('' + cart + '');
});
= この上まで ================

次に、下記内容を
スマートフォン デザイン設定にある
商品ページ共通パーツ設定に挿入していただきますようお願いします。

= この下の行から ====================

= この上の行まで ====================
※外部JSファイルのURLは、実際のURLに置き換えてください。

JavaScriptが動作するようになりましたら、
複製された価格部分の見た目をスタイルシートで
調整していただきますようお願いします。

Answer

ECマスターズ田中さま

ご返信頂きありがとうございます。
早速試してみたところ、価格が上に表示されました。
あとは見た目を調整していきたいと思います。

ちなみになんですが…
価格と同じように、商品場号や送料も上に表示させるようにする際には
どのように行えばよろしいでしょうか？

宜しくお願い致します。

Answer

ECマスターズの塚本です。

いただいたご質問ですが、
担当が本日休みをとっておりますので
明日の回答となる予定です。

今しばらくお待ちいただければと思います。

Answer

ECマスターズの田中です。

> 価格と同じように、商品場号や送料も上に表示させるようにする際には
> どのように行えばよろしいでしょうか？

私よりご案内差し上げたソースに含まれる
変数 cart が複製される部分の内容になりますので、
cart に、追記したい部分のソースを
追加で挿入していただければ結構です。

「$("#rakutenLimitedId_cart").html()」が
価格部分のHTMLソースを表しており、
JavaScriptでは + 演算子で文字列を連結することができます。

商品番号部分は
$("#itemModelNumber").html()
で取得できますので、

var cart = $("#itemModelNumber").html() + $("#rakutenLimitedId_cart").html();

とすることで、
商品番号および価格を表示することができます。
なお、送料は既に価格の下に表示されておりました。
さらに調整が必要な場合はご返信ください。