商品別で項目選択肢のCSSを適用する方法について

Question

お世話になります。

PCの項目選択肢で左側に画像を表示させている会社さんがありますが、画像を表示していない商品もあります。
商品毎に有・無を設定するにはどのように設定すればいいのでしょうか。

画像あり
https://item.rakuten.co.jp/gourmetcoffee/2699/

画像なし
https://item.rakuten.co.jp/gourmetcoffee/0913/

また、上記サイトさんのように選択肢の中のフォントサイズ・太さを大きく変更したいのですが、どのように設定すればいいでしょうか。

お忙しいところ恐れ入りますが、設定方法を教えてください。
よろしくお願い致します。

Accepted Answer

ECマスターズの田中です。

＞商品毎に有・無を設定するにはどのように設定すればいいのでしょうか。

有の商品が少ない場合は、
PC用販売説明文にCSSを設置する方法が早いと思いますが、

多くて難しい場合は、
ヘッダー・フッター・レフトナビ、もしくは共通説明文（大）にて
画像を表示させるCSSを設置したバージョン・設置しないバージョンを
２通りご用意いただき、商品ごとに切り替えていただく方法が良いと思います。


＞また、上記サイトさんのように選択肢の中のフォントサイズ・太さを大きく変更したいのですが、どのように設定すればいいでしょうか。

選択肢を表示するタグに対して、CSSで書式設定を行ってください。

いただいた商品ページでは、
ヘッダーコンテンツ内のタグで読み込んだ
外部CSSファイルにて設定を行っております。
タグとして該当部分を切り出すと、下記のような内容になります。

= この下の行から ====================

#rakutenLimitedId_aroundCart select {
    padding: 10px;
    font-size: 21px !important;
    font-weight: bold !important;
    width: 300px;
    border-color: #DDD;
}

= この上の行まで ====================

Answer

ECマスターズの田中です。

項目選択肢の変更について、
確認の上、改めてご返信いたします。

Answer

田中様

いつもお世話になっております。
早々のご対応ありがとうございました。

無事設定が出来ました。
今までgoldにcssをあげて全体に適用させていましたが、商品販売説明文で個別で設定する方法があるんですね。
ありがとうございます。

今後ともよろしくお願い致します。