*

ポンパレモールの商品ページで外部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

おすすめトピックス

関連記事

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

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

ガラケーとスマホ
楽天スマホ商品ページで制限なく画像説明を載せる方法

楽天に限らずネットショッピング界隈ではスマートフォンでのアクセスが PC を上回るなど年々スマートフォン比率が上昇してきています。今まではスマートフォンは後回し~にしてきた所もあるかと思いますが、パソコン版もスマートフォ […]

商品ページの回遊率アップで売上向上を狙う為の施策について

どこのネットショップ、ショッピングモールでもそうですがマニュアル通りにただ商品を載せただけでは売上向上に繋がりません。ちょっとしたカスタマイズで商品ページの回遊率を高め、商品が売れる機会を増やすことができます。 カスタマ […]

スマホ対応
早くネットショップのスマホ対応を!非対応サイトは誰も来なくなりそう

最近スマートフォンでの google 検索結果の画面が変わりました。スマートフォンに対応しているサイトは「スマホ対応」という文字が表示されています。google がこのサイトはスマートフォンで快適に閲覧できますよ~と太鼓 […]

ポンパレ
ポンパレモールの商品ページにアクセスできない時の対処法

リクルート社が運営しているショッピングモールで「ポンパレモール」があります。多数のネットショップさんが集まって出店しているという所は楽天と同じです。 ポンパレモール:ネット通販/オンラインショッピングサイト トップページ […]

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

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

著者について

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

フォローはこちら

       

       
Flash享年24歳、2020年に完全終了!Flashゲームの行先と代替方法は?

Adobe、2020年末でFlashのサポートを終了と発表 |

ログアウト
Googleアカウントのログアウト後も残るメールアドレスの消し方【ブラウザ別対処】

Google アカウントは今や多くの方が利用されていると思いま

わらび餅入り黒蜜かき氷
長浜市の和菓子屋さんが作る和風かき氷「ちゃらく」のわらび餅入り黒蜜かき氷

滋賀県長浜市ではかき氷専門店はありませんし本格かき氷を提供して

Premiere Elementsで動画の明るさや色調コントラストを補正する方法

写真の明るさや色調を補正する方法なら馴染みのある方法で Pho

ラジオのおすすめ音楽番組は「坂本美雨のディアフレンズ」

テレビの音楽番組は次々と終了して激減していますが、ラジオではま

→もっと見る