ワードプレスをやろう!と決めてから何日も過ぎている・・・

ようやく初めてログインできても全く進まない・・・

なんとかブログの投稿を始めたが全然稼げない・・・

これ以上時間を無駄にしたくない・・・

そんなあなたには下記の書籍がおすすめです!

書籍『アラフォー世代~60代までの男女44人が100分でブログを立ち上げたワードプレス習得法!!副業にも応用可能!』

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

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

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

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

詳細はこちら

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

ブログ型サイトでも
本格的ホームページ型でも
起業に副業に・・・

あなたに専門知識がなくても
目的のWebサイトを制作できるよう
ウェブチルがお手伝いします

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名
書籍『アラフォー世代~60代までの男女44人が100分でブログを立ち上げたワードプレス習得法!!副業にも応用可能!』

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

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

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