WordPress

ページ内リンクの作り方と活用方法、デメリットを解説!【WordPress】

2021年12月11日

 

悩む人
ページ内リンクの作り方が分かりません。さくっと教えて!

 

ページ内リンクとは、クリックしたら同じ記事内の特定の位置にジャンプするための機能のことです。

こんなやつ→いってらっしゃい!のことですね。

 

このページ内リンクを活用することで

  • 早く結論が知りたい読者の離脱を防ぐ
  • 見てもらいたい位置へ読者を誘導する

 

あなたの記事にこのような効果が期待できます。

今回は、ページ内リンクの作成方法と活用の仕方について解説していきます!

 

本記事ではクラシックエディタを例にしています
ゆいて

 

本記事の内容

  • ページ内リンクの作り方
  • ページ内リンクのメリットと注意点

元に戻る

ページ内リンクの作り方

 

ページ内リンクの作り方は大きく分けて2つあります。

 

  • プラグイン:Advanced Editor Tools (旧 TinyMCE)を使う
  • テキストエディタ(HTML編集)で作成する

 

WordPressであればプラグインを使うことで圧倒的に時短になるのでおすすめです。

WordPress以外であればテキストエディタでの作成になります。

 

①プラグインを使ったページ内リンクの作り方

 

step
1
Advanced Editor Toolsの準備

 

まずはプラグインを使った方法です。

最初にプラグインAdvanced Editor Tools (旧 TinyMCE)をインストール後、メニューの設定を行います。

 

WordPressの管理画面の「設定」 > Advanced Editor Tools (TinyMCE Advanced) > 旧エディター(TinyMCE) の「アンカー」をドラッグアンドドロップでメニューバーに追加します。

 

ポイント

アンカーはページ内リンクのジャンプ先を指定するのに必要になります。

 

 

メニューバーに追加しておけば、ワンクリックでアンカーの設定ができるので便利です!
ゆいて

 

step
2
ページ内リンク元の作成

 

他の記事やサイトへのテキストリンクを貼る要領でリンクを作成します。

ボックス内には「#〇〇〇」(ID)を入力します(例ではtestの部分)

 

 

ポイント

  • 先頭に「#」を忘れず付けてください。
  • IDはなんでもOKですが数字は使えません(#a→〇、#a1→〇、#1→×)

 

step
3
アンカーの作成

 

リンク先にしたいテキストや見出し、画像などをクリック(カーソルを合わせる)後「アンカー」をクリックします。

 

 

アンカーIDを入力する画面になるので、先に設定したリンク元のIDを入力します。

 

ポイント

アンカーIDでは「#」は不要です。

 

 

アンカーを設定すると、次の画像のようにアンカー(碇)マークが表示されます。

 

 

以上でプラグインを使ったページ内リンクの作成は完了です!

 

②テキストエディタ(HTML編集)を使ったページ内リンクの作り方

 

HTMLを使う場合、リンク元の作成はプラグインを使った場合と同様です。

 

リンク先の作成は、テキストエディタでリンク先にしたいテキストやタイトルの前に次のHTMLを記述します。

<a id="〇〇〇"></a>

〇〇〇はリンク元で設定した#以降のIDです
ゆいて

 

毎回HTMLを記述するのは面倒なので、WordPressをお使いであればプラグインを使うことを推奨します!

WordPressではページ内リンク以外でもたくさんのことが時短できます

 

WordPressブログのはじめ方はこちら!

WordPressブログの始め方。初心者でも10分で完了!おすすめのサーバー、インストール方法を解説。

続きを見る

 

ページ内リンクの活用方法とデメリット

 

最後にページ内リンクの活用方法とデメリットをまとめました。

 

ページ内リンクのメリットと活用方法

 

ページ内リンクを活用することであなたのサイトにこんなメリットがあります。

 

  • 離脱率の改善
  • 読者のユーザビリティ向上
  • 再度確認してほしいことをシンプルに示すことができる

 

では、どんな場面で使えるか?

 

活用例

  • 例:すぐに〇〇が知りたい方はこちら
  • 例:この〇〇については先に説明したとおりです
  • 例:この〇〇は後半で紹介します

 

このような使い方をすることで、読者に離脱されることなく見てほしいところを見てもらえる記事になります!

 

ページ内リンクの注意点

 

便利で使う場面も多いページ内リンクですが、次のことには注意してください。

 

ココに注意

  • 使いすぎると逆に読者が迷って離脱してしまう
  • 基本的には一方通行なので読みにくい記事になる可能性がある

 

あちこちにページ内リンクを付けると内容がとびとびになってしまいます。

また、ページ内リンクで飛んだ先から元の位置に戻る手段がないことがほとんどです。

 

その結果読者が記事についていけなくなり、読みにくい、理解できない・・・と離脱してしまう原因にもなります。

 

何にでも言えることですが、使いすぎには注意ですね!
ゆいて

 

まとめ:ブログのページ内リンクは必要最低限で!

 

今回は、ページ内リンクの作り方について解説しました。

一度覚えてしまえば簡単ですが、使いすぎには注意してくださいね!

 

すぐに結論が知りたい読者のため、読者がより理解を深められるようにするため。

読者ファーストの視点で、必要に応じて使うようにしてください。

 

少しでも参考になれば幸いです。

ありがとうございました。

ブログランキング・にほんブログ村へ


-WordPress