*

楽天の商品ページの納期情報の文字色やサイズを変更する方法

公開日: : ネットショップ

ダンボール

「楽天商品ページにある納期情報の文字色変えれる?」

突如放たれるその言葉。全く無茶を言ってくれますねと思いつつも、試行錯誤を始めます。試しに google で検索しても特に情報はありません。しかし、google の検索予測ワードに「楽天 納期情報 CSS」が出るという事は、これを解決したら結構求めてる人がいるだろうなと思いました。

楽天の商品ページの納期情報とは、下記画像の赤線部の事です。何日で出荷しますよ等文言が入ります。しかしこの部分、楽天 RMS で文言は変えられますが文字色やサイズは変えられません。

楽天納期情報

普通の人はここで「できませんでした。」と諦めちゃうと思います。しかし、RMS で出来ないからって諦めるにはまだ早いですよ。楽天商品ページのカスタマイズは CSS という手段がまだ残されています。

html ソースをチェックする

Google Chrome なら納期情報の部分で右クリックをしてメニューから「要素を検証」を選択します。するとその部分の html ソースがわかります。それ以外のブラウザなら右クリックして「ソースを表示」を選択して該当部分を頑張って探してください。

ソースを見ると納期情報の部分は以下のようになっています。(ショップによって違うかもしれません。)

<font size="3" color="#FF0000">1-3営業日で発送予定※メーカー欠品時除く</font>

通常、CSS ではクラスや ID が設定されていると該当部分にスタイルを適用できます。しかし、これは…。クラスも ID も設定されていません。「こりゃぁ無理か…。」とちょっと CSS の知識がある人ならここで諦めちゃうと思います。

まだまだ手段は残されている!

早速ですが、解決した CSS を御覧ください。

font[size="3"]{
   color:#000000;
   font-size:80%;
}

ソースに着目するとフォントタグにサイズが3と指定されています。ならfont[size="3"]でフォントタグでサイズが3に指定されているものにスタイルを適用できます。中のプロパティは適当に書いたものですが、文字色やフォントサイズも CSS で自由に変える事ができます。

ただ商品ページでフォントタグを使ってサイズを3指定しているとそこまで影響が出るかもしれません。フォントタグは非推奨なので使っている人は少ないと思いますが、私が実験してみた所影響は出ませんでした。

CSSを置く場所

CSS ファイルは外部で作って GOLD スペースに置きましょう。あとは楽天 RMS のデザイン設定の「ヘッダー・フッター・レフトナビ」でヘッダー部分に CSS を読み込ませましょう。

<link rel="stylesheet" href="style.css" type="text/css" media="screen" />

楽天商品ページカスタマイズ

  • Pocket

おすすめトピックス

関連記事

画像上書きの反映は遅いが一瞬で反映させる代替策はある【楽天ショップ】

楽天ショップを運営している人なら一度は頭を悩まされた事はあるでしょう。楽天の商品画像、すなわち楽天 RMS にアップロードした画像・楽天 GOLD スペースにアップロードした画像を上書きして差し替える場合、画像の反映処理 […]

ミニパソコン
売りたい商品のアピールは第一印象が重要である

ネットショップで商品を売りたいならまずは商品登録して各ショッピングモールへ出品します。今の時代、出品しただけでは売れません。 どこのショップでもいかに自分の商品を売るか考えられ実践されています。商品を売るために商品ページ […]

楽天のカテゴリ表示順序(優先度)変更でエラー「CSVファイルのフォーマットが違います。」

今回は楽天のカテゴリページの話をします。カテゴリページとはそのカテゴリに属する商品が一覧として表示されるページの事です。何も考えずにどんどん商品登録をしていくと、カテゴリページに表示される商品の順番はバラバラになってしま […]

ポスト
どう違うの?ゆうメールとゆうパケットの違い

荷物を送るための郵便局のサービスも多種多様なものがあり、種類が多くてどれがどう違うのかもわからなくなる事もあると思います。今回はゆうメールとゆうパケットの違いについてまとめたいと思います。 目次1 ゆうメールとは1.1 […]

楽天ショップで売り切れ商品が入荷したら通知する機能があります

(また売り切れか…) 楽天ショップで買い物している時、凄く購買意欲をそそらせる良い商品に巡りあう事もあるでしょう。商品説明や画像を見ながらショッピングカートまで進むと目当ての商品が売り切れとなっていた時のショックは大きい […]

Amazonの商品説明文に画像を載せられるようになりました「商品紹介コンテンツ」

Amazon の商品ページを想像してみてください。商品画像に商品説明がリストで列挙されている程度で実にシンプルですよね。楽天など他ショッピングモールと比べて商品アピール具合が大人しいと思いませんか? その理由は Amaz […]

著者について

名前:Azell
作曲したり風景写真撮ったりWeb制作したりする人です。 好きな事を楽しくブログに綴れていけたらと思います。

フォローはこちら

       

       
梱包用ppバンドのストッパーのはさみを使わない外し方

ダンボールで荷物を梱包する時、より強固にする為に pp バンド

ローチョコレート
彦根市に生カカオが活きたローチョコレート専門店「ハレトケト」

滋賀県彦根市、彦根城周辺の古き町並みが残る地に滋賀県初のローチ

アサシンクリードオデッセイ
アサシンクリードオデッセイPC版をGeforce GTX 1070でプレイした感想

2018年10月5日に発売されたアサシンクリードオデッセイの

大垣市のお洒落なビストロ「洋食もくれん」でディナー

岐阜県大垣市の大垣駅近くに「洋食もくれん(洋食 MOQLEN)

Youtubeライブ(生放送)をタイムシフトのように後で見る事はできるか?

インターネット上で生放送ができるウェブサービスは色々ありますが

→もっと見る