アンカーリンクとは
アンカーリンク（Anchor Link）は、ウェブページ内で他の場所へのリンクを作成するために使用されるHTML要素です。
通常、アンカーリンクはテキストや画像などの要素に設定され、ユーザーがクリックすることで特定の場所にスクロールしたり、他のページに移動したりすることができます。
ユーザ的にはありがたいリンクなので、UX上は有効ですね。
アンカーリンクは通常、次のような形式で作成されます：
<a href="#target">クリックしたら遷移するよ</a>
ここで、「#target」はリンク先の場所を示すアンカーの名前です。
アンカーリンクをクリックすると、ブラウザーはそのアンカー名のidを持つ要素に自動的にスクロールします。
また、アンカーは他のページにも設定できます。
その場合、URLに以下のように「#target」のようなアンカー名を含めることで、目的のページの特定の場所に直接ジャンプすることができます。
https://遷移先URL/#target
WordPressでアンカーリンクの設定方法
WordPressでアンカーリンクを設定する方法は簡単です。
以下に手順を示します。
1. リンク先(遷移先)の場所にアンカー名(id名)を設定する
ページや投稿の編集画面で、リンク先の場所にアンカー名を設定します。
ブロックエディタとクラシックエディタで設定方法は異なります。
ブロックエディタ
遷移先となるブロックを選択し、右側の設定パネルで「高度な設定」を選択して「HTMLアンカー」というフィールドにアンカー名を入力します（例: target）。
クラシックエディタ
HTMLを編集可能な状態にし、リンク先(遷移先)の要素に以下のようにidを付与します。
<h2 id="target">遷移先だよ</a>
※遷移先のidには先頭の#は不要なので注意してください。
2. リンク元(遷移元)の作成
アンカーリンクを設定するためのテキストやボタンを作成します。
- テキストブロックを使用して、テキストを挿入します。
例えば、「先頭に戻る」といったテキストです。
- あるいは、ボタンブロックを使用して、ボタンを挿入します。
3. アンカーリンクの設定
2で作成したリンク元のテキストやボタンに対し、リンクを挿入または編集します。
- リンクのURLに、先程設定したアンカー名を含めます。
例えば、#targetといった具合です。
4. 変更を保存する
ページや投稿の編集を完了したら、変更を保存して、プレビューまたは公開します。
これで、WordPressサイトでアンカーリンクを作成できました。
まとめ
色々説明しましたが、結局以下のような設定が両者にできていれば、アンカーリンクは動作します。
※同一ページ内に同名のid名は2つ以上使用できないので、そこだけ注意してください。
遷移先
<h2 id="id名">遷移先だよ</a>
遷移元
<a href="#上記の遷移先のid名">遷移元リンク</a>
