【AFFINGER5】アフィンガー5のページ内リンクの作り方【超簡単】

サラリーマン

・アフィンガー5でページ内リンクの作り方が分からない
・ページ内リンクの使いどころが分からない

このような疑問にお応えします。

ページ内リンクを利用すれば、読者が知りたい該当箇所にすぐ飛ぶことができ、ユーザビリティの向上に繋がります。

あなたがブログを読む場合、早く結論が知りたいと思っているはず。

ねこたろす

結論と関係ない説明が続くと、その記事は読む気がなくなりますよね笑

記事からの離脱を防ぐために、ページ内リンクは有効です。

本記事では、ページ内リンクの作り方や使いどころを詳しく解説していきますので、是非最後までご覧ください。

本記事の内容

本記事を書いた人

ねこたろす

アフィンガー5を利用して約4ヶ月。ページ内リンクは頻繁に使うのでやり方を丁寧にお伝えします！

ページ内リンクの作り方をすぐ知りたい人はこちらから（該当箇所にジャンプします）

ちなみにアフィンガー5では、ページ内リンクに加えて内部リンク・外部リンクを設置できます。

ねこたろす

標準機能としてブログカードで内部/外部リンクを設定可能！

こちらの記事で解説していますので参考にご覧ください。

アフィンガー5 ページ内リンクとは

ページ内リンクとは、記事内の特定箇所にリンクできる機能のこと。

ねこたろす

ページ内リンクはよく使うから、使い方を覚えておこう！

まずは、ページ内リンクを使うことでどのようなメリットがあるのかを解説していきます。

アフィンガー5 ページ内リンクのメリット

ページ内リンクには、「離脱率が下がる」というメリットがあります。

Googleなどで検索をする人には、必ず「知りたい情報」があるはず。

例えば、以下のような情報です。

例えば本記事では、「ページ内リンクの作り方」という情報を知りたい人が多いはずです。

基本的に、知りたい情報以外は必要ないので、

このような状態になると、記事から読者は離れていってしまいますよね（離脱率が高まる）

ページ内リンクをうまく使えば、読者が知りたい情報を提示できて、離脱率が改善する効果が期待できます。

アフィンガー5 ページ内リンクの作り方

ページ内リンクの作り方は以下の2つです。

ねこたろす

1つずつ解説していきますね！

ページ内リンクの作り方
①プラグイン（TinyMCE Advanced）を使う

TinyMCE Advancedを使えば、簡単にページ内リンクを設定できます。

やり方は以下の通り。

まず、事前準備としてエディターのメニューを設定します。

プラグイン→TinyMCE Advanced→設定

ねこたろす

本記事では、テキストエディターを選択します。

次にリンクを設定していきます。

〇はabcなどの英字で適当に設定してOKです。

最後にアンカー設定をします。

リンク先を選択→アンカーを押下

IDを入力
（先ほど設定した#〇の〇の部分）

これで完了です。

ページ内リンクの作り方
②テキストで設定する

次に、TinyMCE Advancedを使わずテキストで設定するやり方を解説していきます。

ページ内リンクの作り方は以下の通り。

リンク設定までは、上記のやり方と同様です。

リンク設定の次は、テキストを設定していきます。

HTMLは以下のように記入します。

リンクさせたい箇所の前に、<a id="〇"></a>を記入すれば完了です。

最後にプレビュー画面で正しくリンクできているか、確認しましょう！

よくある間違いとしては、

大体上記の2パターンが多いです。

ねこたろす

上手くいかないときは、「#」をチェックしてみよう！

まとめ：ページ内リンクで離脱率改善！

本記事の内容をまとめます。

ページ内リンクのメリット

ページ内リンクの作り方

ページ内リンクを使うことで、読者が知りたい情報に早く到達できます。

その結果、離脱率が改善し読者の満足度も高くなりますよね。

本記事を参考に、ページ内リンクを使ってみて下さいね！

それでは！

関連記事

アフィンガー5の内部リンク・外部リンクをブログカードで設置する方法