こちらのページのようにする方法を教えて下さい。

Question

世話になっております。

当店はスマホ商品ページとPC販売ページを同じもの使っているのですか現在スマホをメインなので特大の画像になってしまっています。なのでPC用販売説明文ページをこちらのページのように左右の幅を狭めて、後ろに背景となるようなカラーだけの画像を差し込みたいのですがどのようにすればよろしいでしょうか？

【楽天市場】【公式店】SALONIA ヘアアイロン ストレートヘアアイロン 15mm 24mm 35mm ヘアーアイロン サロニア 海外対応 1年保証 ポーチ hk さろにあ ギフト プレゼント 家族 女性 男性 メンズ 家電 送料無料：アンド ハビット https://item.rakuten.co.jp/kobe-beauty-labo/main-salo6/###HR######IMG0191e2b0dd9604ee08758cb5c1d44b68f.pngIMG0###

Accepted Answer

ECマスターズの伊藤です。

> 【楽天市場】指輪 護身 用 スマホリング キーホルダー グッズ リングストラップ スマホストラップ iphone13 pro ケース スマホ リングホルダー 護身用 落下防止 人差し指 指輪 フリーサイズ 最強 グッズ シンプル 猫 防犯 黒 ブラック 金属アレルギー 面白い グッズ ホワイトデー お返し：宝石スマホリングストラップ指輪匠 https://item.rakuten.co.jp/takumi-hagane/788238sr1/

URLのご連絡ありがとうございました。

先にご連絡しておりました、

の下に


.sale_desc {
    width: 1200px;
    display: block;
}

こちらを追加いただき、ご確認をお願いいたします。


> ECマスターズ配布のSALE用縦バナーが設定URLのみ表示されてないのでこちらの設定をした場合縦バナーの表示はできない感じでしょうか？両立できる場合のみ設定教えていただけたらありがたいです。

こちらは、たしかに現在の記述方法ですと、できなくなってしまいます。

楽天の構造が変わった場合、
ご利用いただけなくなる可能性がございますが、

body
↓
body > div > table

に書き換えていただき、
商品説明文等、RMSではHTMLエラーとなってしまうため、
外部CSSとして記述いただくことで、
ご対応いただくことが可能となります。

Answer

ECマスターズの菅原です。

いただいたご質問につきましては
明日担当よりご回答させていただきます。

恐れ入りますが、もうしばらくお時間いただけますと幸いです。

Answer

ECマスターズの伊藤です。

> 当店はスマホ商品ページとPC販売ページを同じもの使っているのですか現在スマホをメインなので特大の画像になってしまっています。なのでPC用販売説明文ページをこちらのページのように左右の幅を狭めて、後ろに背景となるようなカラーだけの画像を差し込みたいのですがどのようにすればよろしいでしょうか？

対象のページを確認させていただいたところ、
おそらく、ヘッダー・フッター・レフトナビの
ヘッダーを利用していただいているかと思います。

ヘッダー・フッター・レフトナビは、20こまでしか
登録することができないため、
消費説明を記載するには、適さないと思いますので、

代替案として、
テンプレートA もしくは Bを使用して、
PC用販売説明文に
下記のコードの通り記載いただき、
ご希望に近いかたちとなるか、
お試しいただけますでしょうか。

背景画像のURL
は、背景にしたい画像のURLを指定
width:750px
は、ご希望の横幅に変更をお願いします。
750は頂いたサイトさんと同じサイズになります。

==== 以下をPC用販売説明文に記載


ここにPC用販売説明文に記載の内容を記述


/* 背景 */
body{
    background-image: url(背景画像のURL)!important;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
}
/* 商品説明文 */
.main_container{
    width:750px; /* 横幅を指定 */
    margin:auto;
}

Answer

伊藤さんありがとうございます。

試しに入れてみたところイメージ通りバックの画像の方を入れることできました。
また画像の大きさもちょうどよくなったので見やすくなりました。ありがとうございます！

ひとつだけ、画像がすこしサイドへ寄っているのですがこちら中央にしたいです。どのようにすればよろしいでしょうか###HR######IMG070ceb124ed3d880bbeadddfae986e847.pngIMG0###

Answer

ECマスターズの伊藤です。

> ひとつだけ、画像がすこしサイドへ寄っているのですがこちら中央にしたいです。どのようにすればよろしいでしょうか

こちら、実際のページを確認させていただきたいので、
URLをご連絡いただけますでしょうか。

Answer

伊藤さんありがとうございます。

URL こちらになります↓

【楽天市場】指輪 護身 用 スマホリング キーホルダー グッズ リングストラップ スマホストラップ iphone13 pro ケース スマホ リングホルダー 護身用 落下防止 人差し指 指輪 フリーサイズ 最強 グッズ シンプル 猫 防犯 黒 ブラック 金属アレルギー 面白い グッズ ホワイトデー お返し：宝石スマホリングストラップ指輪匠 https://item.rakuten.co.jp/takumi-hagane/788238sr1/

Answer

お世話になっております。

ECマスターズ配布のSALE用縦バナーが設定URLのみ表示されてないのでこちらの設定をした場合縦バナーの表示はできない感じでしょうか？両立できる場合のみ設定教えていただけたらありがたいです。

Answer

伊藤さんありがとうございます。

> こちらを追加いただき、ご確認をお願いいたします。

この方法で中央寄りまで確認できましたありがとうございます！

> 商品説明文等、RMSではHTMLエラーとなってしまうため、
> 外部CSSとして記述いただくことで、
> ご対応いただくことが可能となります。

こちら優先事項がなくなったあとにトライしてみようと思います。
ありがとうございました！