スマホヘッターバナーに検索窓を付ける方法

Question

いつもありがとうございます。

他の方が質問しているかもしれませんがお許しください。

http://item.rakuten.co.jp/z-sports/1644-1023/

スマホ環境にてヘッター部分に検索窓、おすすめカテゴリーへのリンクバナーを
設置したいと考えています。（回遊性ＵＰのため）

方法をお教え頂けませんでしょうか。

何卒宜しくお願い致します。

Answer

ECマスターズの田中です。

今回ご案内する方法は、
楽天RMSの、禁止タグを入力できるバグを利用した方法ですので、
今後、RMSの改修により、使用できなくなる可能性があります。

いただいた商品ページでは
JavaScriptを利用する方法を採用しておりますが、
方法が少々複雑になりますので、
を利用して少し簡単に設置できる方法をご案内いたします。

最初に、ヘッダーとして表示させるためのHTMLファイルを、
楽天GOLD内に設置してください。
他店の例ですと、たとえば
http://www.rakuten.ne.jp/gold/baby-smile/frame/tesunon.html
このようなページが設置されておりますので、
HTMLの記載がわからない場合はソースをご参照ください。

次に、下記の内容でCSSファイルを作成し、
楽天GOLD内に設置してください。
===== この下の行から ============
.spHeader{
display: block;
position: fixed;
left: 0px;
top: 0px;
z-index: 999;
width: 100%;
height: HTMLの内容の高さpx;
}
===== この上の行まで ============
※HTMLの内容の高さは、実際の数値にご変更ください。

最後に、スマートフォン用共通説明文に
下記のHTMLタグを貼り付けることで、
画面上にヘッダー用HTMLの内容を固定させることができます。
===== この下の行から ============


===== この上の行まで ============
※CSSファイルのURL、ヘッダー用ページのURLは、実際のURLにご変更ください。

Answer

ご配慮頂きありがとうございます。

これから実施してみたいと思います。
また、途中で質問させて頂くかと思いますが何卒宜しくお願い申し上げます。