blog

WordPressでアンカーリンクを設定する方法(同じページ内で特定の文字まで遷移させる方法)

くまさん
もくじとは違って、単純にテキストにリンクを貼って同じページ内のとある場所にスクロールさせたいな。。。そうしたらもっと記事がわかりやすくなるのに。。。

こんなお悩み抱えていないですか?そんな時には、アンカーとリンクという機能を使って解決しましょう!

アンカーリンクの設定方法

やることはたったの2つだけです。

下記の記事で一つアンカーリンクを設定しているので、その際に行ったことを画像を入れながら説明をしていきます。

初心者におすすめなASP4選!アフィリエイトで収入を得るために必須なとこだけ!

くまさん記事も結構書いてきたしそろそろマネタイズをしたいけど、どこのASPに登録をしたいのかわからない。おすすめなASPをしりたい。 こんな悩みを持っている方のために記事を作成しました。 こんな方にお ...

続きを見る

 

テキストにリンクを張り付ける方法

まずは、リンク元(リンクさせたいテキスト)の設定方法です。

リンクをつけるテキストを指定して、リンク挿入のボタンをクリックします。※僕が指定したのは「おススメのASP4選」の部分になります。

リンクのボタンを押すと下記のような入力欄がでてきますので、お好きな半角英数字を入力します。※「#」は必須ですのでお忘れなく!

注意ポイント

入力する半角英数字は、「#」が付いていればなんでもいいですが、複数アンカーリンクを設定する場合は、すべて違う半角英数字でなければなりませんのでご注意を!

リンク先にアンカーを設定する方法

次に設定するのが、上記で設定したテキストのリンクの飛び先になります。ここで一つプラグインを導入してほしいです。特に重いものではないのです。


<p class="point"><i class="fa fa-check fa-2x" aria-hidden="true"></i> 導入するプラグイン「TinyMCE Advanced」</p>

プラグインを導入したら本当に簡単です。挿入というボタンをクリックしてください。

すると、開いたところに「アンカー」というのがありますのでそこをクリックしてください。

下記の画像のような入力欄が出てきますので、そちらに先ほど入れた半角英数字を入力します。※こちらには「#」をつけません!

最後にリンクされているかを確認!

最後にリンクをつけたテキストをクリックしてみてください。アンカーを付けた部分まで移動すれば問題ありません!お疲れさまでした!

\ 当ブログのテーマ AFFINGER5

WING AFFINGER5 バナー01

SEO対策バッチリで記事を書くことに集中できる

面倒なカスタマイズもクリック1つ

今なら、タグ管理プラグイン(4,980円)の無料配布キャンペーン中!!!

-blog

© 2020 ゲコログ