こんにちは けいこぶ です。
ワードプレスで記事を書いていると同じページの特定箇所にジャンプするリンクを貼りたいときってないですか？
他のブログさんでよく見かけますよね。リンクを押すとビューーン！と飛んでいくアレです。
そんなページ内リンクの貼りかたをご紹介します。
実際にやってみましょう
では実際に解説を交えながら一緒にやっていきましょう。
―――――――――――――――――――
―――――――――――――――――――
まずは上の画像をご覧ください。
この中で「※インストール方法は知っているよ～って方はこちらを押すと飛ばせます」の「こちら」の部分にページ内リンクを貼りたいと思います。
―――――――――――――――――――
―――――――――――――――――――
まずは通常のリンクを貼るのと同じようにリンクを貼りたい文字を選択して「リンクの挿入」を選択します。
―――――――――――――――――――
―――――――――――――――――――
次に「♯」を入力した後に何でもよいので半角英字で始まる好きな文字を入力してください。
は？なにいっているか意味わからんのやけど( ＾ω＾；)
と感じられるかと思います。少なくとも私はこれを言われたときそう思いました。
この「♯」はページ内リンクを貼るときの記号みたいなものです。ルール上そうなっているだけです。
♯の後につける好きな文字はいわば管理番号みたいなものです。
たとえば「#a01」と番号をつけたとしましたら、このリンクは「a01」という管理番号の文字へ飛びますよ～ってことです。
では「a01」の管理番号の文字はどこなの？となりますが、それは後で説明する飛びたいリンク先の文字の設定で行います。
ちなみに管理番号のことを正式名称では「ID」といいます。
IDは必ず半角英数字で始めましょう。でなければ後で上の画面が出てきてワードプレスからお叱りを受けます。
―――――――――――――――――――
―――――――――――――――――――
では次に飛びたいリンク先の設定を行いましょう。
まずは飛びたいリンク先の文字を選択します。
―――――――――――――――――――
―――――――――――――――――――
次に「挿入」⇒「アンカー」を選択します。
するとアンカーのIDを入力する画面が出てきます。IDとは先ほどの管理番号のことですね。
ここで、アンカーには「♯」を抜いた文字を入力してください！
これはそういうルールだと思いましょう。
私は先ほど「♯a01」と入力しましたので「a01」と入力します。
入力できましたら「OK」を押しましょう。
―――――――――――――――――――
―――――――――――――――――――
すると飛びたいリンク先の文字の左に何かのアイコンが出てきたと思います。
このイカリみたいなマークがアンカーマークです。
適切に入力が完了していれば、これでページ内リンクが貼られています。プレビュー画面などで確認してみましょう！
アンカーという名前が混乱を生んでいる
私はページ内リンクを勉強したときに「アンカー」という文字が頭を混乱させてくれました。
知らない言葉ってパニックを起こさせるんですよね！
アンカーリンクとは同じドキュメント内で移動を可能にするハイパーリンクの一種です。長い文章や多くのセクションを含む場合、アンカーリンクを設置することで指定したセクションへ簡単に移動することが出来ます。
（出典：BENCHMARK「アンカーリンクとは何ですか？」）
意味合い的にはハイパーリンクと同じくそういった用語になります。
ハイパーリンクは略してリンクと呼ばれていますので、アンカーリンクをリンクと略すと混在してしまいます。それなのでアンカーリンクはアンカーと略されるのです。
ちなみにアンカーの語源は英語のAnchor（イカリ）からきています。
錨（イカリ）って船から垂らして海底にひっかけて船を固定するアレですね。
リンクのアンカーも意味は同じです。
アンカーを発射する船が「♯〇〇」で設定した個所です。そこからひっかけたい箇所（リンクを貼りたい箇所）に向かって錨（アンカー）を固定するのです。
私はこのイメージをつけてからはアンカーという文字に苦手意識がなくなりました。
単なるひっかけるイカリのことやんけ( ＾ω＾ )
と安心するようになりました。
まとめ
ページ内リンクは貼ることができましたか？
今回は1か所のみページ内リンクを貼りましたが、IDを複数設定することにより複数設定することも可能です。
ちなみに私は記事の目次をプラグインで自動的に生成していますが、あれも単なるページ内リンクになります。
ページ内リンクって何かと便利です。
記事を作成する際にはぜひとも活用していきましょう♬
また何かワードプレスでわからないことがありましたら解説していきたいと思います。