ページ内リンク(アンカーリンク)の貼り方【WordPressお悩み】アイキャッチ画像

ブログ

ページ内リンク(アンカーリンク)の貼り方【WordPressお悩み】

ブログのページ内で、
リンクしたいわ。
カンタンにできるのかな?



この記事では、

ブログで、ページ内の別の場所にリンクする

ページ内リンク(アンカーリンク)

の貼り方を解説します🍀

こんなお悩みを解決します



このページでも「ページ内リンク(アンカーリンク)」してますので、クリックして試してみてください🍀

💚結論💚

ブロック→高度な設定→HTMLアンカー

でカンタンにできます!



このブログは、有料テーマ「AFFINGER6」を使用しています。


今回の設定は、WordPressブロックエディターの機能ですので、ほかのテーマでも同じです🍀※WordPressのクラシックエディターをお使いの方には画像が違います。ご了承ください。



先輩

使えるテクニックなので、ぜひ覚えて活用しましょう!

ページ内リンク貼り方【同じページ内】

先輩

同じページ内の、別の箇所へリンクできます✨



ブログでは、別の記事(ページ全体)を、内部リンクする場合もありますよね。


ここでは、同じページ内で、別の箇所へリンクする「アンカーリンク」のやり方を解説します🍀

【同じページ内】リンクされる側

✅このページにリンクされます!
注)あなたの設定するページです😅

ページ内リンクの貼り方画像1
  • 右上のブロックを選ぶ
  • リンク先をマーキングする
  • ブロック右下の高度な設定を開く
  • HTMLアンカーに、自分で設定したIDを入れる
    英文で、わかりやすいのがベストです!



【同じページ内】リンクする側

✅リンクしたい「テキスト部分」を設定します。

ページ内リンクの貼り方画像2


✅次に

ページ内リンクの貼り方画像3
ページ内リンク(アンカーリンク)の貼り方【WordPressお悩み】
  • リンクマークをクリックして
  • 「#」をつけて、先ほどご自身で設定した英文IDを入れます
  • エンターキーを押します


これで、説明したいページにリンクされました!


✅確認しましょう!


ページ内リンクの貼り方画像4


  • リンクになっているか
  • 下書き保存をする
  • プレビューで確認
    ※プレビューから、リンクに飛んでいるか確認してくださいね🍀

指定した場所に飛ばないとき

表示されないんだけど・・💦

指定した場所に飛ばない場合は、次の項目を確認してみてください🍀

  • リンクID(英文字)の前に、シャープ(#)を忘れている
  • シャープ(#)が、全角になっている
  • シャープ(#)を、逆に入れている(HTMLアンカー入力の方に(#)はいらない)
  • どちらかのID(英文字)のスペルが間違っている

おまけ:ページ内リンク貼り方【別投稿へ】

先輩

同じページでなく、
別投稿の、特定の場所へもリンクできます✨

【別投稿】の、特定の位置にリンクしたい

同じページではなく、別投稿の特定の位置にリンクする3つの例を解説します。

別の投稿で、

✅ページ自体(トップ)にリンクする場合、
そのURLを入力するのみです。


内部リンクの定番ですよね🍀


この例では、このブログの別の投稿「WordPressアフィリエイトリンク飛ばない!貼り方【超初心者】」で解説します。

ページ内リンクの貼り方画像5



✅別の投稿の、目次のひとつの項目にリンクしたい場合も同様です。


ページ内リンクの貼り方画像9

目次のアドレスは、ご自身の公開している別投稿からコピー&ペーストしてくださいね🍀

※目次もアンカーリンクと同じく「#」でつながれてますね。

別投稿の目次のひとつにリンクされます👇

「A8.netの「テキスト広告」を貼ってみよう」


✅さらに、ピンポイントな場所へリンクさせたい場合



別投稿ページを開きます

ページ内リンクの貼り方画像7
  • 別投稿ページに、リンクさせたい場所をマークします。
  • HTMLアンカーに、自分で設定した英文IDを入れます。
  • 最後に、右上の更新を押します。
    ※更新の際、ほかの部分の修正を一緒にしてもいいかもです🍀





【作成中のページにもどって、設定します】



「#」でつなぐのが、ポイントです。


ページ内リンクの貼り方画像8
  • リンクをさせたいテキストをマークします。
  • リンクマークをクリックします。
  • 別ページのアドレスと、リンクしたい英文のアンカーIDを「#」でつなぎます。



別投稿の指定した場所にリンクしています👇

A8.netのリンクの貼り方:画像で説明


ご自身のリンクが完成しているか、チェックしてくださいね✨


💚適切なリンクで、訪問者の要望にサクサク応えられるようになればと思います💚

まとめ

ページ内リンク(アンカーリンク)って便利だわ✨


筆者みどるは、ページ内でリンクできるといいな、、、と考えていました。

✅プラグインなし

✅むつかしいHTMLなどはイヤ

と思い、検索しましたが、知りたい内容がなく、、、💧

そこで、この記事を作成しました!




外部リンク、内部リンクの重要性は、たくさん指摘されています。



ページ内リンク(アンカーリンク)では、次のメリットが考えられます✨

訪問者のメリット

✅探しやすい

✅理解を深めやすい

✅時間が短縮できる

運営者のメリット

✅文字数の多い記事で、訪問者の離脱を少なくできそう

✅別投稿の内部へもリンクできることで、ピンポイントで誘導できる

✅部分的な被リンクがされるかも



プラグインなしで、カンタンにできます。


👉ブロック→高度な設定→HTMLアンカー



この機会に、覚えて利用しましょう✨


最後まで読んでくださり、ありがとうございます💚

  • この記事を書いた人
  • 最新記事

みどる

フリーランス歴10年以上、アラフィフで投資を始めました。暗号資産・投資・ブログで「知っておきたかった!」ことを発信します。20代、30代、40代、そして50代でも参考になれば嬉しいです【iDeco、米国アクティブ投資信託(NISA込)、ロボアド、個別米国&日本株、ビットコイン、イーサをガチホ中】

-ブログ