スマホ商品ページのHTMLタグ

Question

お世話になります。
楽天市場のスマホ商品ページの構成変更にともなって、フリックする商品画像のすぐ上に、カテゴリーのアイコンをつけようと思っています。
「カットソー」「ブラウス」などのカテゴリーをスマホで見たとき1cmほどの写真&文字で、9項目ほど横に並べて、フリックして見られるようにします。
クリックしたらカテゴリーページに飛ぶようにします。

他の有名店でもやっているため、ガイドラインに違反はないかと思います。

HTMLタグを使用することなので、専門の業者に見積もりを依頼したところ、
アイコンの画像を用意して、36.000円(税抜)ということでした。

この料金は高いでしょうか？
専門の業者なら、すでにあるタグをほぼコピー&ペーストしてできるものだったら高い気がします。
もしくは、同じようなことができるHTMLタグを知っていますか？

Answer

ECマスターズの伊藤です。

> 他の有名店でもやっているため、ガイドラインに違反はないかと思います。

恐れ入りますが、実際の動作を確認させていただきたいと思いますので
参考店舗様のURLを頂戴できますでしょうか。

お手数おかけいたしますが、どうぞよろしくお願いいたします。

Answer

https://item.rakuten.co.jp/osharewalker/ars-401k/

参考店舗です。
ご確認ください。

ECマスターズさんでこのhtmlタグをご提供できるかどうかもご回答お願いいたします。

Answer

ECマスターズの伊藤です。

> 参考店舗です。
> ご確認ください。

参考店舗様のご連絡ありがとうございました。

> ECマスターズさんでこのhtmlタグをご提供できるかどうかもご回答お願いいたします。

はい、こちらHTMLタグにてご提供させていただくことは可能となっております。

基本的なソースは下記の通りとなっております。
ヘッダーに表示されおりますIFRAMEにて読み出しているページに追加していただくなどで
ご利用ください。

例えば、リンクの色を変えたい、などがございましたら、
ご返信にて、ご希望をご連絡くださいませ。

＝＝＝＝＝HTML＝＝＝＝＝

  【カテゴリ名】
  【カテゴリ名】
  【カテゴリ名】
：
(カテゴリ数分、上記１行を追加してください)
：
  
＝＝＝＝＝＝＝＝＝＝＝＝

＝＝＝＝＝CSS＝＝＝＝＝
#category,#category *{
  margin: 0;
  padding: 0;
}
#category{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#category li{
  list-style:none;
  text-align: center;
  width: calc(100% / 10);
}
#category li a{
  display: block;
}
＝＝＝＝＝＝＝＝＝＝＝＝

width: calc(100% / 10)
10は一行に表示させたいアイコンの数となっております。
ご希望の数に修正してご利用ください。

Answer

お返事ありがとうございます。
不明点あれば、再度ご連絡いたします。

Answer

ECマスターズの伊藤です。

かしこまりました。
些細なことでも構いませんので、気になる点がございましたら、ご質問くださいませ。

Answer

お世話になります。

ヘッダーに表示されおりますIFRAMEにて読み出しているページに追加していただくなどで
ご利用ください。
↓
楽天ゴールドに上記のHTMLとCSSのタグを入れさせていただきました。
スマホの商品ページの一番上　（商品画像の上）にカテゴリを表示させたいのですが、どのようなタグをどこに記入すれば良いのでしょうか？
https://ec-tsushin.com/rms_original_header2/
を参考に商品ページ共通パーツ設定にアイフレームを呼び込むコードを記入しましたが、楽天よりエラーが出て表示されませんでした。
スマホの商品ページの一番上　（商品画像の上）にカテゴリを表示させるコードをお教えして頂くことは、できますでしょうか？

Answer

ECマスターズの伊藤です。

> https://ec-tsushin.com/rms_original_header2/
> を参考に商品ページ共通パーツ設定にアイフレームを呼び込むコードを記入しましたが、楽天よりエラーが出て表示されませんでした。

楽天では、禁止されているタグがあり、IFRAMEは禁止タグに当たります。
そのため、IFRAMEご利用の際は、楽天のバグを利用した方法にて
ご登録いただく必要がございます。


> スマホの商品ページの一番上　（商品画像の上）にカテゴリを表示させたいのですが、どのようなタグをどこに記入すれば良いのでしょうか？
商品画像の上にコンテンツを表示させる方法は、下記デザインレシピに
詳しく記載されております。
スライドバナーとなっておりますが、
「１：スライドバナー作成方法」は飛ばしていただき、
「2：スライドバナーを上部に表示させる」より、ご確認ください。
https://club.ec-masters.net/index.php?design_page4


なお、デザインレシピでも触れておりますが、
楽天RSMのバグを利用した方法となっております。
仕様変更となった際に、ご利用いただけなくなる可能性がございますので
ご了承の上、ご利用くださいますよう、お願いいたします。