こんにちは、宮本けんとです。
今回はWord Pressで、テキストにリンクを貼ってページ内の特定の場所に移動させる方法について紹介します。
この記事の目次
ページ内リンク作成の方法
ページ内リンク作成は２つのステップでできます。
- テキストにリンクを設定する
- リンク先にアンカーを設定する
それぞれ説明していきます。
※文字装飾プラグインの「TinyMCE Advanced」を導入しているる前提で説明しています。導入がまだの方はこちらの記事を参考に導入してみて下さい。
①テキストにリンクを設定する
まずはリンクを設定してジャンプさせたいテキスト部分を選択して、リンクの挿入ボタンもしくは（command＋K）をクリックします。
ここに＃から始まる任意の英字＋数字を設定します。
例
「#a1」「#a2」「#a3」
この時#も「半角」で入力して下さい。
またページ内に複数のページ内リンクを設定する場合、すべて異なるものに設定する必要があります。
例
「#a1」「#a2」「#a3」
②リンク先にアンカーを設定する
続いてはページ内のリンク先にアンカー設定をします。
[jin-iconbox08]アンカーとはリンクをクリックしたら指定の箇所に飛ぶ設定のこと。[/jin-iconbox08]
飛ぶ先のテキストを選択してアンカーボタンを選択
先程設定した英数字と同じものを入力します。
この時#はいれずに入力します。
アンカーマークがない場合
もしアンカーマークが無い方は、プラグインの「TinyMCE Advanced」の設定から「アンカー」という箇所があるので、上のマニューバーに挿入することで使えるようになります。
完成したページ内ジャンプのデモ
最後にどんな感じになるかデモを見せておきます。
クリックでジャンプします
⇓ ⇓ ⇓ ⇓
⇓ ⇓ ⇓ ⇓
デモは確認できたでしょうか？
けんと実際の箇所より少し下の方に移動する感じですね。
まとめ
ページ内ジャンプの設定はユーザーにとって合ったほうが便利な場面では積極的に使っていくといいですね。
慣れれば簡単に設定できるので、覚えておくと便利ですよ！
ページ内ジャンプの方法まとめ
- テキストにリンクを設定する
- リンク先にアンカーを設定する
あわせて読みたい
WordPressおすすめプラグイン9選！必須から便利なものまで紹介！こんにちは、宮本けんとです。この記事では、これからWordPressで情報発信ブログを運営していく上で必要なプラグインを紹介します。WordPressのプラグインは便利な反面...
コメント