楽天市場のスマートフォンページがリニューアル！！ 遂にこの時がきたようです。2020年8月19日(水)に楽天市場のスマートフォンページがリニューアルされるそうです！！ってかさ、楽天さんよ何回システムエラー起こしてる[…]
楽天市場に出店されていると、よく他店舗のページを参考にしようと思って色々なページをぐるぐる見て回るときある思います。たまに親切な楽天市場の担当者だと、「今このお店売れてるからチェックしておくといいですよ」なんて情報をくれたりします。
そんな時にちょっと思うのが、
「あれ？なんでこのお店はこんな表示になってるの？」とか・・・
「スマホの商品ページって、画像は10枚までなのに何でこのお店は10枚以上あるんだろう？」
などなど。。。
ってことで、今回は楽天RMSで改造できる裏技コードを公開したいと思います。
基本的にはスマホメイン情報かもしれないので、ご容赦下さい。
但し、予め伝えておきますが、この施策を施してもそこまで売上上がりません。
色々テストを行った結果を持ってお伝えするので、うそではありません。
じゃぁなんでそんな情報を公開するんだってことになりますが…(笑)
それは、お店の情報しっかりと認知して頂くため。
そして販売する商品の魅力を最大限際立たせる為です。
画像の枚数が10枚以上掲載できるからといって、無意味な画像をだらだらと並べてるよりも、魅力的で分かりやすい画像を5枚だけ掲載した方が圧倒的に、【売上】は作れます。
なので、他店舗の情報や見た目に振り回されず自店舗の内容にマッチするようあれば是非この裏技お使い下さい。
また、今回の記事に掲載していない箇所など、個別相談にも乗りますのでお気軽にご連絡下さい。
楽天市場 RMSの裏技コード解説
今回ご紹介する楽天RMSの裏技は、基本的な主要部分のみとなります。
あれもこれも記載すると、とんでもない量になってしまうのでご容赦下さい…
PC版 全部の商品ページにCSSを一括適用
これは、裏技というよりも最もポピュラーな編集技術になるかもしれません。
PC版商品ページの全てにCSSを適用させたい時に用いる技です。
編集箇所はコチラ
RMSトップの左メニュー > 店舗設定 > 2デザイン設定 へ進みます。
その中でPCデザイン設定の共通テンプレート設定からヘッダー・フッター・レフトナビを選択。その中から通常使用されている添付レートの編集ボタンをクリックします。
ちなみに、デフォルトで設定されているテンプレート名には（自動選択）と記載がされておりますので、まずはそのテンプレートを編集するのがいいですね。
編集画面に入ったあら、ヘッダーコンテンツの中に下記のCSSソースを設置。
<link href="https://www.rakuten.ne.jp/gold/店舗名/css/ファイル名.css" rel="stylesheet">.cssのようなファイルを設置するのが面倒な場合は…
<style type="text/css">
<!--
[ココにcssを記述]
-->
</style>上記のような形で、CSSをダイレクトに記述してもOKです。
これを設置すると商品ページとカテゴリページにCSSが提供されますので、簡単にイメージを一新した場合やフォントを一気に変更した場合などは、是非ご活用下さい。
スマホ版 トップページのリダイレクト設定方法
ほとんどのショップさんが、楽天FTPのGOLDを使ってスマホ版トップページを作っているかと思います。楽天RMSがデフォルトで用意しているスマホ版トップページもありますが、掲載できる情報量が少なすぎるのと、使用できるタグの制限がありすぎてほとんど何もできません…
ただ、イベントページや商品ページなどショップ側が自前で設定できる箇所にはGOLDを使ったスマホ版トップページのURLを設置することはできますが、楽天市場がデフォルトで設置されている箇所は全て楽天が用意しているトップページのURLが設置されています。
URLを使って簡単に説明すると…
https://www.rakuten.co.jp/店舗名
これは楽天がデフォルトで設定しているスマホトップページのURLです。
楽天スマホから、このURLをクリックすると上記のデフォルトページにとばされてしまいます。
PC版はGOLDで作成したトップページに自動でとばしてくれるのですが…
そこで今回は、スマホ版でこのページをクリックされた場合、自動的に下記のようなスマホ版のトップページにとばしてくれるタグの設置をご紹介します。
下記がGOLDを使ったスマホ版のトップページだった場合、
[https://www.rakuten.ne.jp/gold/店舗名/ファイル名.html]
<meta http-equiv="refresh"
content="0;URL=https://www.rakuten.ne.jp/gold/店舗名/ファイル名.html">URLを店舗ように変更の上、上記のソースコードを使って自動ジャンプを適用させて下さい。
その際に、スペースや改行などを消したり変更せずに必ず使って下さいね。
また、設置上記のURLを設置する場所は
RMSトップ > 店舗設定 > 2スマートフォン デザイン設定
その中でトップページ設定 > トップページ編集に入ります。
ページ内にトップ説明文(1)の項目がありますので、上記のタグをそこに設置すれば完了です。
これでhttps://www.rakuten.co.jp/店舗名をクリックされても、GOLDで作ったスマホ用トップページに自動ジャンプがされます。
ちなみに、スマートフォン用のカテゴリページも上記の設定をすると、カテゴリページからGOLDで作成した特集ページに自動ジャンプすることができます。
詳しい内容を知りたい場合は、お気軽にご連絡下さい。
スマホ版 商品ページの掲載画像数UPやiframeの導入
そして、たぶん今回の記事でこれが1番重要な項目かもしれません。
同時におおくの店舗さんがこの情報を探しているかと思います。
それが、スマートフォン用商品説明文を改造する裏技です。
まずはスマートフォン用商品説明文の項目には画像が10枚までしか入れられません。
要するに<img src=””>のタグが10個までしか入れることができないってことです。
たぶん楽天側のサーバー容量などが問題かと思いますが、やっぱり画像が10枚だけだと情報量が限られてしまいます。これは結構もったいないです。
ってことで、imgタグを下記のように記述すると何個でもimgタグを入れることができます。
<img src="画像URL"width="数値"="">上記のタグを入れると、imgタグは何個でもOKです。
タグの最後の部分を注目してほしいのですが、タグの最後にあえて[ =”” ]を入れています。これが重要で、この記述をしておくと楽天のシステムがimgタグと認識しなくなります。
他のサイトですと、「全角の空白を13文字入れる」とか色々ありますが、これだと文字数が大幅に食われ、文字数オーバーで商品情報が入れらないケースが頻繁に発生しました。
なので、私個人としては最後に[ =”” ]を入れる方法を推奨します。
これで画像の枚数制限はクリアされました。
そして、次がiframeタグです。
これはどのお店さんも実装したいところですよね。
楽天のポイント企画やクーポン情報。開催しているセールのご案内など…
いちいちスマホ用の商品説明文を編集・更新するのは大変ですよね。
そんなことをしていたら、1日終わってしまいます(笑)
ってことで、スマートフォン用商品説明文には、下記のコードを記述してみて下さい。
<iframe ="" src="ファイル名" scrolling="no" frameborder="0" width="数値" height="数値">こちらも、画像の時の注意点と同じでスペースなどは消さずに設置して下さい。
また、iframeで読み込ませるファイル情報もスマホで最適化されるようにして下さいね。
最後のまとめ
今回の記事はここまです。
今回ご紹介した裏技の中で、特にスマートフォン用商品説明文の画像枚数の制限クリアとiframeの実装は是非行って頂きたいと思います。画像枚数をアップっさせることは、売上に結び付きやすいことでもありますので、是非ご検討下さい。
もし実装方法が分からなったり、作ってみたけど上手く適用されないなど、困った場合はお気軽にご連絡下さい。なるべく早めにご返信させて頂きたいと思います。
