スマートフォンやhtml5+CSS3など新技術に四苦八苦。jQuery、AjaxなどJavaScriptも難しいですね。そんなWebに悩む人のネタ帳です。

楽天RMSでページ内リンクを貼る

update : 2014/07/30

楽天RMSでページを構築する際に、ページ内リンク(アンカータグ)を貼る方法です。

Webサイトでのページ内リンク

通常、Webサイトを構築する中で、ページ内リンクを貼る場合は、以下のようにします。

<a href="#section1">ページ内リンクです</a>

このリンクをクリックすると、ページ内の以下の場所までジャンプしますね。

<div id="section1">
こんてんつ
</div>

ここで、楽天RMSで上のような実装をすると、リンクをクリックした時にエラーページへと遷移してしまいます。
これは、楽天RMSが外部へのリンクを全面禁止しており、「#section1」を外部リンクとして扱っしまっているのが原因のようです。
つまりリンクをクリックした時に、「#section1」は外部サイトなのでエラーです、といった趣旨のエラーページが表示されてしまうわけです。

楽天RMSでのページ内リンク

例えば、以下のような商品ページ上でアンカータグを貼るとします。

http://www.rakuten.ne.jp/xxxxx/product1/

「#section1」へジャンプさせたい場合のURLは以下のようになります。

<a href="http://www.rakuten.ne.jp/xxxxx/product1/#section1">ページ内リンクです</a>

ちなみに、RMSでは任意に属性「id=”pagetop”」などを埋め込むこともできないので、ページトップなどのリンクは以下のように「#」のみでよいでしょう。

<a href="http://www.rakuten.ne.jp/xxxxx/product1/#">ページ内リンクです</a>

苦労が絶えないですね。

B!

Comment

Comment Form

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

Monthly Archives