同一ページにリンクを張り、アンカーを記入した箇所にジャンプして、すぐに行けるようにした時のメモ(基本的なことなのですが、すぐ忘れてしまうので)
この目次がまさにページ内ジャンプになっています。同じページ内のジャンプではなく、絶対パスで指定すると、他ページの特定の場所へ飛ばすこともできます。
1同一ページ内ジャンプのやり方
ページ内ジャンプのやり方は、飛ばす先の目印となるアンカーを記入し、リンクにそのアンカー名を追加するだけです。
2アンカーを記入する
<h4><a name=”a01″>同一ページ内にジャンプのやり方</a></h4>
<h4 id=”a01″>同一ページ内にジャンプのやり方</h3>
<h4><a name=”a02″>アンカーを記入する</a></h4>
<h4 id=”a02″>アンカーを記入する</h4>
今回はidを指定する方法を使いました。
アンカー名は「a01」や「a02」といったように半角英数字を使っている人が多いようですが、ページ内に同じアンカー名が無ければ何でもOKです。
3貼ったアンカーへリンクを張る
ジャンプ先のアンカーができたら、次にそのアンカーへ飛ばすリンクを張ります。
<a href=”#アンカー名”>文字</a>
<a href=”#アンカー名”>画像</a>
リンク先として「#アンカー名」を指定します。イメージリンクのaタグにアンカーを指定して画像にリンクを張ったりします。
<a href=”#a01″>同一ページにリンクを張る</a>
<a href=”#a02″>アンカーを記入する</a>
<a href=”https://homemate21.net/create-hp/pagelink/#a03″>張ったアンカーにリンクを貼る</a>
リンクの貼り方は、絶対パスでも構いません。違うページの指定箇所にジャンプすることも可能です。
1ページが長く、目的の箇所にすぐジャンプさせる事が出来るので便利です。
使っているテーマ等でメニューでリンク先が隠れていますが、適宜アンカーを記入する位置を調整してください。