Yahoo!の在庫項目選択の表示のカスタマイズ

Question

いつもお世話になっております。在庫項目選択が現在シンプルすぎるので出来れば、お客様にもわかりやすいようにしたいと思いました。方法がありましたらご教示願います。よろしくお願いいたします。

Answer

ECマスターズの田中です。Yahoo！ショッピングのオプション（楽天の項目選択肢別在庫にあたる部分）の表示をカスタマイズするには、外部スタイルシートファイルを利用する必要があり、ファイル設置のためにYahoo!トリプルが必要となります。トリプル内に外部スタイルシートファイルを設置し、ストアクリエイターPro → ストアデザインからヘッダー・サイドナビ・フッター、いずれかの「フリースペース」の中に外部スタイルシートファイルを読み込むタグを記入することで、オプションの表示をカスタマイズすることができます。オプション用のタグには「class="stock"」が設定されておりますので、「.stock」またはそれ以下の要素に対して規則を作ってください。たとえば、オプション表の文字に対して、大きさを14ポイント、文字色を赤に設定する場合は、外部スタイルシートファイルの内容は下記の通りになります。===== この下の行から ================.stock td { font-size: 14pt; color: red; }===== この上の行まで ================外部スタイルシートの使い方がわからない場合は、下記URLにてご確認ください。http://ab10.sakura.ne.jp/sc/css/css03.html例えば、ショップ「shopurl」が、トリプルの「css」フォルダに「stock.css」ファイルを保存した場合、このファイルを読み込むタグは、下記のようになります。

Answer

ありがとうございます。行ってみましたがうまくできませんでした。・；

Answer

ECマスターズの田中です。商品ページを確認したところ、<link>タグ、およびトリプル内のstock.cssは、正しく適用されておりました。私にて改めて確認したところ、Yahoo!ショッピングの通常設定によって#ItemInfo .mdItemInfoStock .dvItemInfoStock table.stock thおよび#ItemInfo .mdItemInfoStock .dvItemInfoStock table.stock tdに対してスタイルシートによる指定がされておりましたので、それを上書きするように設定をする必要がありました。ご案内した内容が不足しており、失礼いたしました。たとえば、外部スタイルシートファイルの内容を===== この下の行から ================body #ItemInfo .mdItemInfoStock .dvItemInfoStock table.stock th, body #ItemInfo .mdItemInfoStock .dvItemInfoStock table.stock td { font-size: 14pt; color: red; }===== この上の行まで ================とすると、前回申し上げたとおり、大きさを14ポイント、文字色を赤に設定することができます。一度、動作をご確認いただいた上で、ご希望の見た目になるよう修正していただきますようお願いいたします。

Yahoo!の在庫項目選択の表示のカスタマイズ

カテゴリーから探す