ページ内リンクを設定すると、画面をスクロールする必要なく指定された場所へ移動(ジャンプ)することができます。
ページ内リンクは HTML を使用して、以下の二つを設定する必要があります:
- 起点(ジャンプポイント)
- 着地点(ジャンプ先)
これらをホームページ上の異なる場所に設置しましょう。
注意事項
クリエイターの機能に関するお問い合わせはサポートにて対応いたしますが、お客様が独自で作成・使用しているコードにつきましては、ご自身で管理・運用していただきますようお願いいたします。
起点の作成
起点(ジャンプポイント)に設定する HTML は以下のようになります:
<p><a href="#アンカー名">文字</a></p>
設置方法は以下の手順をご参考ください:
- 文章コンテンツ を追加、もしくは既存の文章コンテンツを利用して起点を設定しましょう。
- コンテンツ内下部に表示される設定メニュー部分にある HTML を編集 をクリックすると、HTML 編集欄が開きます。
- 上記の 起点に設定する HTML をコピーして貼り付けてください。
- HTML 編集欄に HTML を貼り付けたら、以下を参考に編集しましょう。
- HTML の アンカー名 部分を、自分が使用するのにわかりやすい名称に変更します。(例: #textanchor1 や #a1 など)
- 文字 部分は、リンクが設定されたジャンプボタンの役割を果たします。訪問者にわかりやすい言葉を設定しましょう。
- 「Ok」 ボタンをクリックして保存します。
注意事項:複数のページ内リンクを設置する場合、アンカー名には同じ名前は使用できません。また、スペースや特殊文字 (/, (, ), _, ., ;, ,)の使用も不可となっています。
着地点(ジャンプ先)の作成
着地点(ジャンプ先)に設定する HTML は以下のようになります:
<div id="アンカー名"></div>
設置方法は以下の手順をご参考ください:
- まずは起点をクリックしてジャンプした訪問者がたどり着く着地点を決めましょう。
- その場所で、コンテンツを追加 > その他のコンテンツ & アドオン をクリックし、ウィジェット / HTML を選択してください。
- 上記の 着地点に設定する HTML をコピー。
- HTML 編集欄にコピーした HTML を貼り付けます。
- アンカー名 部分には、起点に設定したのと同じアンカー名を入力してください。
- 「保存」 をクリックしたら設定の完了です。
注意事項:レイアウトによってはページ内リンクが使用できないことがあります。