コラム 実用WEBデザイン

2,348views!

投稿日 : 2017年10月19日

タグ :

楽天市場商品ページに iframe を埋め込む小技

楽天 iframe 設定

こんにちは!株式会社イメージデザイン 楽々通販2サポート 中山です。
いきなり12月並みの気温という事で、体が気温に付いて行ってません。
また夏の気温に戻るという事ですが、いつになれば季節は安定するのでしょうか。

今回は、楽天市場でちょっと使えるテクニックをご紹介します。

スマホページにiframeで表示したい!

店舗運営で便利な iframe ランキングや特集ページへのリンク。商品紹介などをパソコン版の商品ページやTOPページでお使いの方も多いのではないでしょうか。

実は楽天市場さんではスマートフォンページでiframeを使った商品ページの作成を「原則禁止」とされています。
なので、パソコンページと同じように<iframe src="~"><iframe>とやっても、警告が現れて表示することができません。
※ゴールドサーバでは特に制限なくご利用いただけます。

そこで、スマートフォンでiframeを使うテクニックをご紹介します。

2017年10月確認スマートフォン商品ページへのiframe呼びだし

<iframe src="ショップ・ショップアイテムのURL" id="任意のID" scrolling="no" frameborder="0" =""=""></iframe ="">

ポイントは>の直前に■=""■=""> と、したところです。
これにより、楽天市場さんで見られているiframe のチェックを回避したわけですね。
※■は半角スペースと考えてください。

なぜスマートフォンにiframeを入れるのか

先日、スマートフォンの離脱を防止する策として商品ランキング等を表示して回遊性を上げましょう!と、いう事をお伝えしたかと思います。
たとえば商品が1つしかない、5個しかないといった程度であればRMSで直接書き換えるのも手だと思います。
しかし、20アイテムあれば同じ作業を20回しなくてはいけません。

これって非効率的ですよね。

そこで、iframeを使う事で常に1つのファイルを変更したらすべてのページに反映される。こんな状況が出来れどうでしょう。

またそれぞれの使い方によってきますが、例えばイメージデザインが開発・運営する楽々通販2では、システムから吐き出されるURLがすでにiframeになっています。
スマートフォンサイトにそのまま掲載しようとするならどうしても回避技が必要になってくるのです。

※このテクニックはあくまで2017年10月現在確認できた挿入方法です。
今後、楽天市場さんの対応で使えなくなる可能性がありますのでその点ご了承ください。

楽々通販2

関連記事