![【ワードプレス】記事の中をジャンプで飛びたい!ページ内リンク(アンカーリンク)を貼る方法](https://daizumayuge.com/wp-content/uploads/2021/10/0_aa438bb3-e6ff-4df4-b406-e95615b733b7.jpg)
ブログを作っていく中で、「この記事の中のある部分までジャンプさせたい!」…と思ったことはありませんか?
外部リンクや内部リンク(自分のブログ内)は、
![](https://daizumayuge.com/wp-content/uploads/2021/10/内部リンク.png)
こういったアイコンをクリックして、飛びたいURLを入力すれば飛べますが、この記事のページ内に飛びたい場合があります。
その方法を解説していきたいと思います。
ページ内リンクの貼り方
ページ内リンクは以下のコードを使えば簡単に設置することができます。
リンク元に、
<a href="#id名"> リンク元の言葉</a>
リンク先に
<a id="id名"></a>
を設置するだけ!
「id名」の部分を自分でわかりやすい名前をつけて、「リンク元の言葉」をコードで囲みます。
この時、コードエディターに変えて設置してください。
実際にページ内リンクを設置してみたいと思います。
ページ内リンクを貼り付けてみる
「ここ」をクリックして「まとめ」の見出しまで飛ばしたい場合。
↑↑ 実際にクリックしてみてください。「まとめ」まで飛びます。
STEP1:コードエディターに変えて「ここ」をコードで囲む
![](https://daizumayuge.com/wp-content/uploads/2021/10/ページ内リンク-1024x439.png)
![](http://daizumayuge.com/wp-content/themes/cocoon-master/images/woman.png)
ダッシュボードの右上にある「・三つ」をクリックし「コードエディター」を選びます。
コードエディターになったら、リンク元の言葉を「<a href=”#id名”></a>」で囲みます。その時、「#id名」も任意の言葉に変えます。今回は「#まとめ」にしました。
![](https://daizumayuge.com/wp-content/uploads/2021/10/ページ内リンク2-1024x385.png)
STEP2:リンク先にコードを貼り付ける
![](https://daizumayuge.com/wp-content/uploads/2021/10/ページ内リンク3-1024x438.png)
![](http://daizumayuge.com/wp-content/themes/cocoon-master/images/woman.png)
リンク先に「id名」を「まとめ」に変えて、「<a id=”id名”></a>」を貼り付けます。
見出しの「まとめ」の直前に貼り付けました。
![](http://daizumayuge.com/wp-content/themes/cocoon-master/images/woman.png)
「ビジュアルエディター」に戻します。
![](https://daizumayuge.com/wp-content/uploads/2021/10/ページ内リンク4-1-1024x206.png)
![](http://daizumayuge.com/wp-content/themes/cocoon-master/images/woman.png)
「ビジュアルエディター」に戻すと「見出しのまとめ」の前に上記の警告が出ますが、ブロックのリカバリーはしてもしなくても大丈夫です。
ブロックのリカバリーをすると、
![](https://daizumayuge.com/wp-content/uploads/2021/10/ページ内リンク5-1024x191.png)
上記のようにコードが変更されますが、普通にリンクは飛びます。
ただ、リカバリーをしないほうが、リンクが飛ぶ場所が的確な場所に飛ぶと思います。
「ブロックのリカバリー」をした時
![](https://daizumayuge.com/wp-content/uploads/2021/10/ページ内リンク7-1-1024x501.png)
「ブロックのリカバリー」をしなかった時
![](https://daizumayuge.com/wp-content/uploads/2021/10/ページ内リンク6-1024x532.png)
まとめ
簡単でしょ?コードを適切に貼り付けるだけで、ページ内リンクを貼ることができました。
今回の記事は、かなり短い記事なので、ページ内リンクにあんまり意味がありませんが、長い記事を書くときは、長すぎてある特定の場所まで飛ばしたい時に効果的です。
ぜひ、ページ内リンクを活用しましょう!
![](https://daizumayuge.com/wp-content/uploads/2021/05/3681ea90-c60b-41b2-ab30-7dab04979ff9-160x90.png)
![](https://daizumayuge.com/wp-content/uploads/2021/01/3a97e820-35d4-474a-a060-16c868c61d73-160x90.png)
![](https://daizumayuge.com/wp-content/uploads/2020/10/b4c95b76-6cd4-4012-b05c-725e1f5f507a-160x90.png)
▼クリック!応援お願いします!▼