PC用のイベントバナー(カウントダウンタイマー)をスマホページに設置するやり方

現在、ツールボックスの「イベントバナー」(カウントダウンタイマー)は
レスポンシブ(スマホ)対応となっておりません。m(_)m

就きましては、「ページクリエイター」などで
作成したスマホページに設置する際は
以下のやり方である程度キレイに収まりますので
企画部にてご案内しますのでご参考ください。

1)ツールボックスでの設定
 ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄
ツールボックス>イベントバナー>新規作成>テンプレ選択>アップロード>HTMLソース取得 

今回記事で使用するテンプレ
・SSミニ_黒帯_スマホ向け調整_期間要確認
・SSミニ_白帯_スマホ向け調整_期間要確認
・SSミニ_ハッピ女の子_スマホ向け調整_期間要確認


上記にて開催期間を設定し、アップロードし、
貼り付けソースを取得します。


2)HTMLを用意します
 ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄
下記の<div>~</div>の間に
1)で取得したソースを入れます。 

<div style="text-align:center; background-color:#111111;">

</div>


※「SSミニ_白帯_スマホ向け調整_期間要確認」を選択した場合は 
 background-color:#fff;に変更願います。 

NEW!!
※「SSミニ_ハッピ女の子_スマホ向け調整_期間要確認」も
 新たにご用意致しました。(2018/8)
 サンプル:https://www.rakuten.ne.jp/gold/iimonostore/ss201809-m.html


3)ページクリエイターに設置
 ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄

ページクリエイターにて表示したい場所に 
HTML直接入力ブロックを配置していただき 
そこへ登録をお願いします。 



※楽天スマホ商品ページに設置する場合は 2)の作業は行わずに裏技適用にてそのまま入れる形になります。
その際は「SSミニ_ハッピ女の子_スマホ向け調整_期間要確認」のタイプがお勧めになります。
(但し、ページ左側には寄ってしまいます。)

⇒裏技に就きましては2020/9にて全面的に終了となっております。
 ご参考:楽天市場 スマホページ「本来利用できないHTMLタグの修正」について
 https://manual.ecsystem.jp/20200530iframe/



関連:
HTML直接入力ブロック




うまくいきましたでしょうか?

こちらでのご対応を宜しくお願い致します。


--------------------------------
※HTML直接入力ブロックに記述するHTML、javascriptに就きましては
 ECステーションサービスとしては正式サポート外となります。
 予めご了承の程お願い申し上げます。
 (とは言え、なにかあれば企画部あてご連絡ください。)
--------------------------------
PAGE TOP