この記事で解決できるお悩み
- AFFINGER6でページ内リンクを作りたい！
- 記事内をスキップさせる方法が知りたい
- 記事内のテキストをクリックして、目的の見出しへジャンプさせるには？
記事を書きました。
この記事を読めば、記事内リンクを
使いこなせるようになりますよ！
手っ取り早く、「記事内リンクの作り方」だけ
知りたい方はこちら
本記事の内容
記事内リンクとは
記事内リンクの作り方
おまけ：記事内リンクの応用
記事内リンクとは
記事内リンクとは、ページ内の特定箇所に
リンクできる機能のこと。
記事内リンクを使いこなすことで、
目的の情報にすぐアクセスできるようになり、
ユーザーの離脱率が下がります。
例えばこの記事を読んでいる人は、
「記事内リンクの作り方」という情報が
知りたいはずです。
前半部分にいらない情報がダラダラと
書いてあるとウザいですよね。
スキップしたくなるはず。
記事内リンクの作り方
・プラグインありで作る方法
・プラグインなしで作る方法
を紹介します。
プラグインありで作る方法
①ジャンプさせたいテキストを選択して、
リンク挿入を押す。
②#abcと入力➡︎適用。
いったん更新で保存しておく。
ポイント
abcの部分はローマ字ならなんでもいいです。
1や2などの数字はNGです。
プラグイン➡︎新規追加より、
Advanced Editor Tools（旧TinyMCE Advanced）を
インストール。
有効化➡︎設定をクリック。
下へスクロールし、
アンカーをドラッグ＆ドロップ➡︎変更を保存。
①記事に戻り、ジャンプで飛んでくる場所を選択。
②挿入➡︎アンカーをクリック。
abcと入力➡︎OK。
プレビューで動作確認をします。
プラグインなしで作る方法
①ジャンプさせたいテキストを選択して、
リンク挿入を押す。
②#abcと入力。
ポイント
abcの部分はローマ字ならなんでもいいです。
1や2などの数字はNGです。
③テキストエディタに切り替えます。
④ジャンプで飛んでくる場所に
下記のHTMLを入力。
<a id=”abc”></a>
注意ポイント
<a id=”#abc”></a>としないように
プレビューで動作確認をします。
おまけ：記事内リンクの応用
・他ページの特定部分へジャンプさせる方法
について紹介します。
興味のある方は、読んでみてくださいね。
他ページの特定部分へジャンプさせる方法
#demoの前に、他ページのURLを入れるだけ。
まとめ
記事内リンクの作り方について解説しました。
記事内リンクを活用して、
読みやすい記事を量産しちゃってください！