スマホのお気に入りボタン設置について

Question

お世話になっております。
モノリスの茂呂です。

スマホのお気に入りボタン設置方法について、デザインレシピを参考に商品名下と固定バナーに設定しています。

商品名下のバナーのお気に入りボタン下に、あと何枚か画像を貼りたい（イベント告知やカウントダウンバナーなど）のですが、どのように記述すればよろしいでしょうか？

お忙しいところ恐縮ですが、ご教授頂きたくお願いします。

Accepted Answer

ECマスターズの田中です。

> 例えば、sp_item_com_page_.css　というcssファイルを作り、cssをページ先頭で読み込むようにし、そのcssの中に読み込んでいるcssファイルの記述内容一式を入れることで、

Answer

ECマスターズの伊藤です。

> 商品名下のバナーのお気に入りボタン下に、あと何枚か画像を貼りたい（イベント告知やカウントダウンバナーなど）のですが、どのように記述すればよろしいでしょうか？

下記を編集していただき、
商品ページ共通説明文などに
貼り付けていただきますと
商品名の下に、コンテンツを
表示していただくことができます。

＝＝＝＝＝以下を貼り付け＝＝＝＝＝

ここに商品名下に移動させたい内容を記入



jQuery(function($){
$('#itemName').after($('.divAfter'));
});

＝＝＝＝＝以上を貼り付け＝＝＝＝＝

Answer

ご返答ありがとうございました。
残念ながらスマホ共通説明文が長すぎるとのことで登録できませんでした。

現在のスマホ説明文の内容を添付しました。
設置する方法はございますか？


https://www.rakuten.ne.jp/gold/cordy/js/sp_cuopon23.js
ファイルに、お気に入りボタンを記述すれば良いのかもしれませんが、方法が分かりません。

宜しくお願いします。

Answer

ECマスターズの田中です。

現在のスマートフォン用共通説明文より、
RMSのバグ利用に使われている不要な全角スペースを
取り除いていただくことで、文字数を省略することができます。

下記ソースにて、設置をお試しいただきますようお願いします。


















#fixedBanner1 {
position: fixed;
z-index: 9999;
margin: 0;
padding: 0;
top: 100px;
right: 0px;
text-align: center;
width: 200px;
height: auto;
}

#fixedBanner1 img {
width: 100%;
height: auto;
vertical-align: bottom;
}

Answer

ECマスターズの田中です。

今回、私にて字数削減した以外にも、
共通説明文の中で頻繁に使われている
タグやタグは、
複数ファイルを１つにまとめることが可能です。

例）
bookmark1rev.js の末尾に
bookmark2rev.js の内容を貼り付けて
楽天GOLDにアップロードすると、
bookmark1rev.js に bookmark2rev.js の機能が追加されるため、

のタグを削除することができる。

また、タグで囲まれた内容も、
タグで読み込んでいるcssファイルの中に
移動させて、削除していただくことも可能です。

他のページで利用しているため
ファイルを分けておく必要がある、
まとめられると更新作業がややこしい、など、
一概にまとめることができない場合もございますので、
まずは、どのファイルがまとめられるか
ご検討いただければ幸いです。

楽天GOLD内のファイルの編集ができない、
GOLDが何なのかわからない、など、
不明な点がございましたらお知らせ願います。

Answer

ECマスターズの田中です。

タグの内容は、
楽天GOLDにcssファイルとして保存して
タグにご変更いただくことも可能です。

= この下の行から ====================

#fixedBanner1 {
position: fixed;
z-index: 9999;
margin: 0;
padding: 0;
top: 100px;
right: 0px;
text-align: center;
width: 200px;
height: auto;
}

#fixedBanner1 img {
width: 100%;
height: auto;
vertical-align: bottom;
}

= この上の行まで ====================

このようなタグの場合、
最初に、下記内容をテキストエディタ（メモ帳など）に貼り付けて
ファイル名の末尾を「.css」にして、
外部CSSファイルとして保存し、
楽天GOLDにアップロードしてください。

= この下の行から ====================
#fixedBanner1 {
position: fixed;
z-index: 9999;
margin: 0;
padding: 0;
top: 100px;
right: 0px;
text-align: center;
width: 200px;
height: auto;
}

#fixedBanner1 img {
width: 100%;
height: auto;
vertical-align: bottom;
}
= この上の行まで ====================

次に、下記内容を
スマートフォン用の商品ページ共通説明文に挿入していただくことで
同じ内容を適用させることができます。

= この下の行から ====================

= この上の行まで ====================
※外部CSSファイルのURLは、実際のURLに置き換えてご利用ください。

Answer

ECマスターズ　田中様

お世話になっております。
校長です。

例えば、sp_item_com_page_.css　というcssファイルを作り、cssをページ先頭で読み込むようにし、そのcssの中に読み込んでいるcssファイルの記述内容一式を入れることで、

Answer

ECマスターズの田中様

お陰様で解決できました。
ありがとうございました。