質問: スマホ 商品ページ 共通パーツ設定 並び替えの方法? 毎々、お世話になっております。他店舗をスマートフォンで調査をしていくなか、ぜひ、真似をしたい事例がありご指導をお願いしたいのです。楽天のマニュアルを見ても、スマホの商品ページ 共通パーツの並べ替えは出来ない仕様になっており添付のようにする方法があれば教えて頂きたいのです。通常、スマートフォンページでは、楽天市場共通のバナーの後に、店名があり、その後に画像がスクロールされます。しかしながら、添付のhttps://item.rakuten.co.jp/macocca/mcstl001/さんでは、本日ですと、black fridayのクーポンの2画像、macoccaさんの店名、店名、topページのバナー画像のスクロールと続きます。実際にクリックした商品以外の売れ筋商品などを探す際にも、見やすくわかりやすく、自分でできる範囲であれば真似したいと思っております。よろしくお願い致します。
回答: ecマスターズの田中です。https://club.ec-masters.net/index.php?design_page4上記デザインレシピをご覧いただいた、ということですね。はい、スライドバナー用に限らず、商品画像の上に設置したい内容のhtmlファイルをご設置いただくことができます。同ページにて紹介されておりますとおり、タグ名の後ろに「 =""」を追記することで、スマートフォン用項目で本来使用が禁止されているタグをご記載いただくことができるようになります。なお、タグをタグにご変更いただくことで、ページ上部に移動させたい内容をタグの中で直接ご記載いただくことができます。内容の中でも、禁止タグに対して先述の「 =""」の追記が必要ですが、iframeタグ設置後の高さ調整も不要となりますので、こちらの方法をおすすめいたします。> 20画像のすぐ下に、クーポンが貼り付けられています。> こんな事もできるのでしょうか???レシピにてご紹介しているjavascriptの中でbefore を after にご変更いただくことで、商品画像の下に貼り付けることができます。before と after を同時にご利用される場合は、同じパーツを移動させてしまうことのないようご注意ください。たとえば、$('#itemimageslider').before($('.iframebefore'));$('#itemimageslider').after($('.iframebefore'));と記載されますと、商品画像上に移動した要素が即座に商品画像下に移動し、結局商品画像下にしか表示されません。