楽天RMSのカスタマイズで使えるclass名の一覧。
楽天でのショップカスタマイズには必須のスタイルシート(CSS)。
GOLDで外部化するかRMSに直接書き込むかはさておき、
素敵ショップの構築には、CSS編集は避けては通れません。
ここでは楽天でスタイルシートを使用する際によく使われるclass名を、
共通テンプレート、商品・カテゴリページ別に一覧としてまとめました。
今後CSSを使った店舗カスタマイズにチャレンジしてみたいという方は、
ぜひ一度こちらを参考に挑戦してみてください!
共通テンプレートのclass名
サイト内共通で使用するテンプレート部分のclass名一覧です。
RMSでは「デザイン設定」→「共通テンプレート設定」から編集します。
class名 | 使用箇所 |
---|---|
.topT_sdtext | 共通説明文(小) |
.exT_sdtext | 共通説明文(大) |
.lossleader_item_name | 目玉商品名 |
.lossleader_price1 | 目玉商品価格(見出し) |
.lossleader_price2 | 目玉商品価格(数字) |
共通テンプレートを使って商品ページを全画面にカスタマイズする。
商品ページのclass名
商品ページ内で使用されているclass名の一覧です。
RMSでは「商品ページ設定」→「商品個別編集機能」から編集します。
class名 | 使用箇所 |
---|---|
.item_desc | PC用商品説明文 |
.sale_desc | PC用販売説明文 |
.item_number | 商品番号 |
.item_name | 商品名 |
.catch_copy | PC用キャッチコピー |
.price1 | 価格(見出し) |
.price2 | 価格(数字)/ポイント倍付 |
.tax_postage | 価格(税込/送料) |
.shippingCost_free | 送料無料 |
.pointGet | 楽天カードPR |
.soldout_msg | 完売表示 |
.inventory_choice_name | 項目選択肢(見出し) |
.inventory | 項目選択肢(セル内) |
.choice | セレクトボックス |
.favorite | お気に入り(全体) |
.bkm | お気に入り(商品) |
.shopBkm | お気に入り(ショップ) |
.review | レビュー(全体) |
.see | レビュー(見る) |
.write | レビュー(書く) |
.iconMail | 友達にメールですすめる |
カテゴリページのclass名
カテゴリページ内で使用されているclass名の一覧です。
RMSでは「カテゴリページ設定」→「カテゴリページ編集」から編集します。
class名 | 使用箇所 |
---|---|
.category_uppertext | カテゴリ説明文上 |
.category_lowertext | カテゴリ説明文下 |
.subcategory_list | 下位カテゴリ一覧 |
.category_itemnamelink | 商品名(商品一覧) |
.category_itemprice | 商品価格(商品一覧) |
.category_itemtaxpostage | 税込/送料(商品一覧) |
.shippingCost_free | 送料無料(商品一覧) |
画像素材とCSSで楽天のカテゴリーページをカスタマイズする。
そのほかのclass名
そのほかRMSで使用されているclass名の一覧です。
class名 | 使用箇所 |
---|---|
.breadcrumbs_list | パンくず |
#rakutenLimitedId_header | ショップ共通固定ヘッダー |
無料のテンプレートを利用して楽天ショップをカスタマイズする。
まとめ
使われやすいものだけでも一覧化してみると、案外たくさんありますね!
これらのidやclass名は、ブラウザのデバッグツールなどで簡単に把握できます。
自分でも調べてみたい!ここには載っていないものがある!という方は、
この機会にぜひツール(ChromeやIEではF12で起動)を使って調べてみては?
楽天サイトの仕組みが理解しやすくなりますよ!
また今回はPC用のclass名だけしかご紹介できませんでした。
スマートフォン用のデザイン設定で使用されているclass名も、
また機会があればご紹介したいと思います。ではまた!
※掲載しているid・class名は記事作成時点(2016/10)のものです。
デザイン目線でSOY振り返り。2015年楽天ショップトレンドまとめ。
ショップ運営でお悩みの方へ。
ネット通販やウェブ制作、ECサポート事業を行っている(株)ビリオンプラン・ジャパンが運営しています。楽天やYahoo!ショッピングなど各モールへの出店サポートや、商品撮影からページ制作までの運用提案、海外ローカライズ作業も行っています。
ショップ運営のお悩み、ご相談ください。
ビリオンプラン・ジャパンは日本を拠点に、香港などの海外グループ会社も生かし各種サービスをご提供しています。まずはお気軽にご相談くださいませ。
または、お電話でも承ります。
※ただいま新規ウェブ制作の受付は停止しております
10:00 - 19:00(土日祝休み)
06-6271-7761
ABOUT ME
- デザイナー/編集Twitter:@BILLIONPLAN_JP
- 大阪在住WEBデザイナー。制作会社、EC業界でデザイナーをやった後に、ゲームアプリの世界へ。そんなにゲーム好きじゃないことに気づいてウェブに出戻り。その後ビリオンプラン立ち上げに参加。ご相談はこちらにお願いします。フェネック飼いたい。 →記事一覧
Recent Posts
2016.10.26EC楽天RMSのカスタマイズで使えるclass名の一覧。
2016.09.30WEBWordPressプラグイン利用で、オリジナルシェアボタンを簡単設置。
2016.08.10EC注目のキッズファッション!楽天の参考デザインまとめ、子供服サイト10選。
2016.07.15DESIGNロゴだけでも変更しとこ!WordPressのログイン画面を簡単カスタマイズ。
新着記事を配信しています
FacebookやGoogle+で新着記事を配信しています。よろしければ「いいね!」や「フォロー」をお願いします。