WordPressのブロックエディターGutenberg(グーテンベルク)でアンカーリンクを作成する

ワードプレスでアンカーリンク

ページ内で、リンクを貼って、文字(画像)から文字(画像)へクリックで飛ばしたい場合

つまり「アンカーリンク」を設定したい場合

どうやったらいいのか?グーテンベルクでのシンプルなやり方をご紹介します。

WordPressのブロックエディターGutenberg(グーテンベルク)でアンカーリンクを作成

アンカーリンク、いまいちわからない方のために

実際にこのページ内にアンカーリンクを作ってみます。

クリックしてみてください↓

ここがリンク元(このページの一番下までジャンプします。)

今回は、実際にあるこのページ↓で作ったアンカーリンクを使って説明します。

株アプリ

【株初心者】どの証券会社のアプリがいい?

2022.07.12

リンク先の設定

ページ内でクリックして、飛ばしたい先、リンクさせたい先のテキスト(画像)を選択します。

リンク先の文字(※下記図の文章中の「松井証券」という文字)を選択→選択したら、右のバーから「ブロック」タブを選択。

ブロックを選択→一番下の「高度な設定」を展開

アンカーリンク先設定

「高度な設定」内のHTMLアンカーに、任意の名前を入力。

wordpressでアンカーリンクの設定
worxpressグーテンベルクでアンカー設定

シャープ(#)文字を使いません。アルファベット文字だけで良いです。

これでリンク先の設定は終わりです。

次は、リンク元の設定です。

リンク元でリンク設定をする

リンクは、「松井証券」という文字です。
この文字をクリックすると、同じページ内の任意の場所へジャンプします。

下記図の中の、「松井証券」という文字を選択して
リンクのアイコンをクリックします。

リンク設定に、先程設定した、アンカーリンクの名前を入力します。

wordpressアンカーリンクの設定

先程つけたアンカーリンクの名前の前に # の文字を忘れずに!

これで終わりです。

テストリンク先

ここがリンク先

はい。このページの上部からジャンプしてきましたね。

では

ここをクリックして元に戻ってください。

\ この記事をシェアする /
ワードプレスでアンカーリンク