サイトを作っていて、

ページの途中まで、一気に飛べるようにしたい。

と思ったことがありました。

長いページの上に項目を並べて、
そこを押したら、

下にある該当部分までジャンプする。

よく見る、あれです。

でも当然、私はやり方を知りません。

そこでAI03に、

「ここを押したら、この見出しまで飛ぶようにしたい」

と聞きました。

すると、

「見出しに、HTMLアンカーを設定して」

みたいなことを言われました。

一体、何言ってる？

ここから、思った以上に苦労しました。

目次 [ close ]
  1. そもそも、ページ内リンクって何？
  2. AI03に「右にある」と言われた
  3. 私とAI03の「右」が違っていた
  4. 見つからないので、別の方法を試し始めた
  5. 結局、「高度な設定」はちゃんとあった
  6. できてしまえば、やることは意外と単純だった
  7. 初心者にとって「右」は、かなり重要
  8. AI03に聞けば一発で終わる、とは限らない
  9. まとめ

そもそも、ページ内リンクって何？

ページ内リンクは、

同じページの中にある別の場所へ移動するリンク

です。

普通のリンクなら、
別の記事や別のサイトへ移動します。

ページ内リンクの場合は、

今いるページの途中へ飛びます。

たとえば、

ページの上に、

  • 料金
  • 使い方
  • 注意点

と並んでいて、

「使い方」を押したら、
そのページの「使い方」という見出しまで一気に移動する。

そんな使い方ができます。

長いページでは、かなり便利です。

AI03に「右にある」と言われた

やり方をAI03に聞くと、
見出しを選んで、

右側にある「高度な設定」を開く

と教えられました。

右ね。

そこで私は探しました。

見出しをクリックすると、
そのすぐ上に小さなメニューが出ます。

文字を太くしたり、
配置を変えたりする、
あのツールバーです。

私は当然、

その右側

を探しました。

ない。

「高度な設定」なんて、ない。

AI03に、

「右にないよ」

と伝えます。

でもAI03は、

「右側にあるはず」

と言う。

いや、

ないって。

何度見てもない。

私とAI03の「右」が違っていた

あとから分かったのですが、

AI03が言っていた「右」は、

選択しているブロックの右

ではありませんでした。

WordPress画面全体の右側にある設定欄

のことでした。

しかも私が探していた場所とは全然違って、
画面右側の設定欄の、下の方。

つまり、

AI03「右にあります」
私「右にはない」

は、

二人とも違う場所の「右」を見ていた

わけです。

これ、分かっている人には何でもない話だと思います。

でも私は、

「右」と言われたら、今触っているものの右を見る。

画面全体の右側なんて、
思いつきませんでした。

見つからないので、別の方法を試し始めた

高度な設定がどうしても見つからない。

そこで、
AI03が提案してきたのは、

「このコードをコピペしてみて」

< >

みたいなものが入ったコードをAI03が作ったので、
それをWordPressに貼ってみます。

私はコードを読めないので、
言われたものをそのままコピペ。

すると今度はWordPressから、

「このブロックを修復しますか？」

みたいな表示が出ました。

……。

何か壊した？

ページ内リンクを作りたいだけなのに、

なぜ私は今、WordPressに修復を勧められているのか。

だんだん話が大きくなってきました。

結局、「高度な設定」はちゃんとあった

あれこれ試した末に、

ようやく見つけました。

WordPressの編集画面で、
見出しブロックを選択。

そして、

画面右側の設定欄を下の方まで見る。

そこに、

「高度な設定」

がありました。

あった。

本当にあった！

そこを開くと、

HTMLアンカー

を入力できる場所があります。

たとえば、

howto

のような名前を付けておきます。

そして、飛ばしたいリンク側には、

#howto

を指定する。

これで、

リンクを押すと、
その見出しまで移動できました。

できてしまえば、やることは意外と単純だった

終わってみると、

やったことはそんなに難しくありません。

ざっくり言えば、

  1. 飛び先になる見出しを選ぶ
  2. 「高度な設定」を開く
  3. HTMLアンカーに名前を付ける
  4. リンク側に「#＋その名前」を設定する

これだけでした。

難しかったのは、

ページ内リンクそのものではありません。

私の場合、

「高度な設定がどこにあるのか」

でした。

初心者にとって「右」は、かなり重要

今回やっていて思ったことがあります。

操作に慣れている人なら、

「右側の設定を開いて」

で通じます。

でも、何も知らない人にとっては、

どの右？

なんですよね。

今選んでいるものの右？

画面の右？

右上？

右下？

サイドバー？

私は今回、

選択しているブロックの上に出てきたメニューの右側

を一生懸命探していました。

AI03は、

画面右側の設定サイドバー

を見ていました。

そりゃ見つかりません。

AI03に聞けば一発で終わる、とは限らない

AIに聞けば、

すぐ何でも解決する。

……とは限りませんでした。

AI03はやり方を知っている。

私は画面を見ている。

でも、

同じ「右」という言葉でも、見ている場所が違う。

そうなると、

普通に話がかみ合いません。

今回は途中でコードを貼って、
WordPressに修復まで勧められました。

それでも、

「ない」

「どこ？」

「これ？」

とやり取りしながら進めて、

最終的にはちゃんとページ内リンクを作れました。

まとめ

ページ内リンクは、

同じページの中にある別の場所へ移動するリンク

です。

WordPressでは、

見出しなどにHTMLアンカーを設定して、
そこへリンクすることで作れます。

私の場合、
仕組みより何より、

「高度な設定がどこにあるのか」

でかなり苦労しました。

でも一度場所が分かれば、
次からはできます。

たぶん。

……いや、

また忘れてAI03に聞く気もします。

今回、一番よく分かったのは、

ページ内リンクより、
「右」を見つける方が難しいこともある。

ということでした。