*

ポンパレモールの商品ページで外部CSSを使用する方法

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

ポンパレモールに出店されている方向けの記事となります。

ポンパレモールと言えば、ページ作成において使用できるタグが制限されており作りづらい仕様でした。しかし、2014年12月からタグの規制が一部緩和されました。緩和されたものは以下の通りです。

  • linkタグが使用可能
  • styleタグが使用可能

スタイルシート(CSS)関連の規制が緩和されてデザイン的にかなりやりやすくなり、link タグが許容された事で外部 CSS を使う事も可能になりました。

ポンパレモールproで外部CSSを利用

外部 CSS を使うためにはポンパレモール pro を使う必要があります。ポンパレモール pro とは楽天で言う gold スペースと同じで各ショップで自由に使えるフリースペースの事です。

ポンパレモール pro を利用するためには、ポンパレモール管理画面より利用申請をする必要があります。(無料です)

詳しくは公式ヘルプで「ポンパレモールpro」を検索するなどして頂きご確認ください。

外部CSSの使い方

ポンパレモール pro のスペースで外部読み込み用の CSS をアップロードします。

ponpare-css1

ポンパレモール管理画面よりデザイン設定から「ヘッダー・フッター・サイドバー」を開きます。

ponpare-css2

テンプレートの中から使用しているテンプレートを編集します。

ponpare-css3

ヘッダーコンテンツの中にも link タグの使用が許可されるようになりました。それにより外部 CSS を読み込むことが可能になります。以下のように記載します。

<link rel="stylesheet" href="CSSのURL" type="text/css" />

外部スタイルシートが使用可能になった事により、商品説明文の装飾等が容易になります。詰まった行間も広げる事ができます。

外部CSSが利用可能でもやってはいけない事もあるよ

外部 CSS が使える事により、商品ページ内も独自のデザインが可能になります。商品名の文字の大きさ、ショッピングカートボタンをオリジナルの物に変える等もできます。しかしここで罠があります。ポンパレモールの規約に外部 CSS を使ってやってはいけない事が記載されています。

ポンパレモールPROに配置したCSSまたは JavaScript を用いて、下記ページの デザイン改竄 や スクリプトの適用を一切行わないこと
  (ア) PCトップページ
  (イ) スマートフォントップページ
  (ウ) カテゴリページ
  (エ) 商品ページ
  (オ) 複数商品ページ
  (カ) 会社概要ページ
  (キ) 支払・送料について

カートボタンも変更可能になると思いきや、規約で禁止されていました。これはちょっとガッカリですね。でもルールはルールなので守らなくてはいけません。

ようは、ショップ側で作成したコンテンツ以外は CSS などで弄るなと言っています。

おわりに

楽天などではショッピングカートボタンを独自のものに変えている所はよく見かけますが、ポンパレモールでは全く見かけません。それはこの規約が効いているわけです。

外部スタイルシートは使えますが、ポンパレモールでは極めて限定的な用途でしか使うことができません。違反したらどんな処置が来るかわかりませんので、注意しましょう。

  • Pocket

おすすめトピックス

関連記事

初心者でも簡単、Photoshopでバナーのボタンを簡単に作成できる作り方

Photoshop で簡単にバナー画像などに付けるボタンの作成方法を紹介します。Web 制作や EC ショップ運営をされている方なら作成する機会も多い事でしょう。Photoshop でボタン作成は難しく感じますが、知って […]

楽天商品ページに複数の買い物かごボタンを設置する方法

今日は楽天ショップの商品ページについてのお話です。 これからAという商品を商品ページに載せるとします。そのAという商品には多数のオプション品があり、合わせてオプション品もたくさん売りたいという場合結構頭を悩ます問題だった […]

ランキング1位獲得
要注意!楽天商品ページへのランクイン実績表示についてルールを制定

楽天で買い物をしていると商品ページに「この商品は楽天ランキングで1位獲得!」というようなアピールをよく見かけると思います。売れてるアピールをする為に、楽天ランキングのランクイン実績を画像なりにまとめて商品ページにドンッと […]

楽天会社概要
楽天ショップ会社概要ページもCSSを使って若干のデザイン付けが可能です

楽天ショップで買い物しようとするとき、送料や支払い方法、納期、利用規約等を調べるために会社概要ページを見る事もあると思います。 その会社概要ページ、字ばかりでダラダラと書き連ねられており読むのも辛いほど読みづらい構成とな […]

iphone
Yahooショッピングのトリプルページを手っ取り早くスマホ対応に

Yahoo!ショッピングにショップを出店している方で、jquery や CSS が自由に使えてデザインができる「トリプル」を契約していらっしゃる方も多いと思います。しかし、トリプルで普通に PC 用のトップページを作った […]

アウトレットセール
アウトレット品はこれからの時代を生き抜く為の重要なファクターとなるだろう

よく巷でアウトレットセール、訳ありセールなど催されている所を見かける事もあると思います。そのアウトレットセールって何のセールかご存知でしょうか? 目次1 アウトレットとは2 商品は毎日捨てられている3 商品を安く買う方法 […]

著者について

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

フォローはこちら

       

       
ジョモ
JOMOというガソリンスタンドは今どうなったのか?

ガソリンスタンドと言えば、有名所で ENEOS、出光、コスモ石

岐阜県大垣市で栃木のご当地佐野ラーメンが食べられる「政吉食堂」

佐野ラーメンというものをご存知でしょうか?佐野ラーメンとは栃木

ヤマト運輸の送料値上げでも送料を安く抑える為に出来る事5つ【2017年10月から】

クロネコヤマトのヤマト運輸が2017年10月より送料の値上げを

キャプテンラ・フランス
珍しい味のかき氷シロップ「キャプテンラ・フランス」の感想

気温も30度が近くなってくるといよいよかき氷のシーズンですね。

セブンイレブンからアイスキャラメルラテが発売されていたので感想など

セブンイレブンでお馴染みのセブンカフェからアイスキャラメルラテ

→もっと見る