ワードプレスの始め方
~稼ぐためのしくみづくりまでを
徹底解説!!

好評セミナー”ワードプレス100分でブログサイトを制作”を書籍化しました

amazonでたった1コインで手に入れる

ワードプレスの始め方
~稼げるしくみづくりまで
書籍で徹底解説!

詳細はこちら

amazonでたった1コインで手に入れる
  • ブログ型サイト
  • 企業ブランディング・集客ページ
  • 飲食店や医院用サイト
  • 各種LP制作

・・・などなど
ワードプレスを使ったサイト制作や
コーディングのみも承ります。

お気軽にお問い合わせください。

※本サイトで紹介する商品は提携先アフィリエイトリンク付き(PR)の場合がございます。

3分でできる!ワードプレスGutenbergでページ内リンクを貼る方法

ページ内リンクとは、ページ内の特定場所に飛ばすことができるアンカーリンクのことです。

本記事では、Gutenberg(ブロックエディター)でページ内リンクを貼る方法を3分で解説します。

ページ内リンクを貼る方法の概要

  1. 飛ばしたいブロックにid名をつける
  2. 付けたidへのリンクを貼る

これだけです。

それでは、具体的にやってみましょう。
例として、本章の見出し”ページ内リンクを貼る方法概要”へ飛ばすリンクを貼る作業をしていきます。

ページ内リンクを貼る具体的手順

(手順1)飛ばしたいブロックにid名をつける

1.飛ばしたいブロックを選択

見出し”ページ内リンクを貼る方法概要”にカーソルを置いて選択状態とします。

2.画面右パネルの”高度な設定”を開けてHTMLアンカーに任意のid名を入力

今回は、”title-gaiyou”というid名にしました。
※id名は半角英数および記号(-や_)。頭は英字から始めてください。

ブロックにid名を指定

(手順2)リンクを貼る

段落ブロックでリンク用テキストを入力して、リンクを貼ります。リンク先は#+id名です。

以下の例は”方法の概要はこちら”というテキストにリンクを貼る手順です。

①テキストを入力
②入力したテキストをドラッグして選択
③ツールバーのリンクボタンをクリック
④#+id名を入力
⑤リターンマークをクリックして確定

ページ内リンクを貼る

実際に次のテキストにリンクを貼ってみましたのでクリックして確認ください。

方法の概要はこちら

ページ内リンクを貼る方法は以上です。3分でわかりましたでしょうか?(汗)

別ページからリンク先ページの特定場所に飛ぶことも可能

今回はあくまでページ内の特定場所へリンクを飛ばす方法でしたが、別ページからでも特定の場所を指定することが可能です。

リンク先をURL+#+id名とするだけです。

簡単ですよね。

まとめ

まとめると次のようになります。

  1. 飛ばしたいブロックにid名をつける
    高度な設定>HTMLアンカーid名を入力
  2. 付けたidへのリンクを貼る
    ページ内リンクならば#+id名
    ページ外からのリンクならばURL+#+id名

ワードプレスの始め方
~稼ぐためのしくみづくりまでを
徹底解説!!

好評セミナー”ワードプレス100分でブログサイトを制作”を書籍化しました

amazonでたった1コインで手に入れる