長いページでも目的の情報へ直接案内できます。
作業を始める前に
- 変更前の画面と設定値を記録し、戻せる状態で作業します。
- 管理画面の名称や使える機能は、WordPressのバージョン・権限・テーマで異なります。
- 01移動先の見出しを決める
- 02HTMLアンカーに名前を入れる
- 03目次やボタンからリンクする
- 04ページの途中へ正しく到着するか試す
下の各項目で、判断のポイントと確認方法を説明します。
進め方・判断のポイント 04 STEPS
移動先の見出しを決める
料金・利用の流れ・よくある質問など、読者が直接見たい場所を選びます。細かい段落すべてにリンクを付けるより、内容のまとまりを案内します。移動先の見出しそのものが意味を持つようにし、番号だけで案内しないようにします。後で文章を変えても維持できる短い識別名を考えます。
案内する見出しと識別名を決めました。
HTMLアンカーに名前を入れる
対象の見出しブロックを選び、設定の高度な設定にあるHTMLアンカーへ、例えば fees のような名前を入力します。ここでは先頭に # を付けません。同じページ内で同じ名前を重複させず、空白を使わないようにします。大文字と小文字も区別されるため、半角英小文字とハイフンで揃えると管理しやすくなります。
| 項目 | 入力する内容・例 |
|---|---|
| HTMLアンカー | feesこの欄には # を付けない。 |
| リンク先 | #fees別ページからならページURLも付ける。 |
ページ内で重複しないアンカーを設定しました。
目次やボタンからリンクする
同じページ内ならリンク先を #fees のように指定します。別ページから案内する場合は、そのページのURLに #fees を付けます。例えば料金が別ページにあるなら、現在のページへ #fees だけを付けても移動できません。文字の表示名は「料金について」など、移動先が分かる名前にします。
リンク先に必要なURLとアンカーを指定しました。
ページの途中へ正しく到着するか試す
公開プレビューでリンクを押し、目的の見出しへ移ることを確認します。固定ヘッダーが重なって見出しが隠れる場合は、テーマの余白設定や対応するCSSを調べます。スマホのメニュー内から使う場合は、移動後にメニューが閉じるかも確認します。アンカー名を変更すると既存リンクが切れるため、変更先を一覧で管理します。
PCとスマホで目的の見出しまで移動できました。
終わったら確認すること
- 長いページでも目的の情報へ直接案内できます。
- 変更したページと、そこへつながる一覧・メニューをログアウトした状態で確認します。
途中で困ったときは
クリックしても何も起きません。
アンカー名とリンク先の綴り、# の有無、同じ名前の重複を確認します。編集画面内ではなく公開プレビューでも試してください。
別のページへ飛ばしたいときは？
移動先ページのURLとアンカーを組み合わせます。ページのスラッグを変えた場合は、そのリンクも更新します。
参照した公式資料
画面や条件が異なる場合は、ご利用環境と公式の最新案内を確認してください。
手順確認日 2026.10.30 ／ 読む時間は目安です。操作に必要な時間は環境によって異なります。
管理画面の項目を調べる
入力欄の意味・操作・確認方法を、項目ごとに確認できます。
投稿／固定ページ → 編集 → ブロック →