WordPressにリンクボタンを作る方法｜URLの入れ方と押せないときの確認

「問い合わせる」「PDFを開く」などのボタンを作り、行き先のURLを設定する手順。ボタンの選択位置、リンクアイコン、別タブ設定、公開ページでの動作確認を公式画面で説明します。

WordPressでは「ボタン」ブロックを置き、文字とリンク先URLを設定すると、案内用のボタンを作れます。 色付きの形を作っただけでは、リンク先へ移動できません。この記事では「体験について問い合わせる」というボタンを一つ作り、公開ページから問い合わせ先が開くところまで確認します。

パソコンのブロックエディターが対象です。画像はWordPress.org公式の英語画面を引用し、押す場所と日本語名を対応させています。

1．先に行き先のページを開き、URLを控える

別タブでリンク先を開きます。問い合わせページ、予約ページ、PDFなど、訪問者に見せたい内容が表示されることを確かめ、ブラウザー上部のアドレス欄からURLをコピーします。

自分のサイトの編集画面URLや、ログインが必要な管理ページを入れないようにします。外部サービスへのリンクなら、通常は https:// から始まるURL全体を使います。

この記事中のWordPress公式「ボタン」ガイドは操作確認用です。このURLを問い合わせ先として自分のボタンに貼る必要はありません。

管理画面の「固定ページ」または「投稿」→対象ページのタイトル→ボタンを入れたい場所、の順に進みます。入口がわからなければ管理画面へのログインから確認できます。

本文の空の行で「＋」を押し、検索欄に「ボタン」と入力して選びます。スラッシュ検索を使う場合は、空の段落に /buttons と入力して候補から選びます。

本文にボタンの形と文字の入力場所が出れば追加できています。そこに「体験について問い合わせる」と入力します。「ここをクリック」だけより、押した先の目的を表す文字にすると、読み手が迷いにくくなります。

ボタンをクリックすると、上に小さなツールバーが出ます。複数のボタンが並んでいる場合は、リンクを付けたい一つを選びます。外側のボタングループを選んだままだと、全体の並び方など、別の設定が表示されることがあります。

画像の赤枠がリンクのアイコンです。これを押して入力欄を開き、コピーしたURLを貼り付けます。自分のサイト内のページは、タイトルを入力して候補から探せる場合もあります。

URLを入れたら、画面に出る適用・保存・送信のボタン、またはEnterでリンク設定を確定します。入力欄に貼り付けただけで終わらず、もう一度リンクのアイコンを押して、設定した行き先が表示されるか確かめます。

公式の参考画像は文字リンクですが、リンク先を開く・編集する・解除するコントロールの見方を確認できます。ボタンでは配置が異なる場合があります。編集のアイコンからURLを直せます。

詳細設定の「Open in new tab」は「新しいタブで開く」です。サイト内の案内を順番に読んでもらう場面では同じタブ、元の説明を残したまま別資料を見てもらう場面では別タブ、というように利用場面で決めます。

別タブにする場合は、ボタン付近に「別タブで開きます」と添えると動きが伝わります。ほかの詳細項目は、用途がわからないまま一律に変更しなくてかまいません。公式のリンク編集の説明で項目を確認できます。

画像の「Layout」はレイアウト、「Justification」は横位置、「Orientation」は並ぶ方向です。この設定は外側のボタングループを選んだときに使います。ボタン一つのリンク設定と、グループ全体の配置設定を分けて考えます。

初めてなら、まず一つのボタンでリンクが動くことを確認してから、色や並びを整えると作業を戻しやすくなります。スマホでは長い文字が折り返すことがあるため、文言を短くして、文字と背景の色が見分けられるか確認します。

WordPressがURLの形式を受け付けても、リンク先のページが存在することまでは保証されません。実際に開いて確認することが必要です。

同じページ内の見出しへ移動する場合は、アンカーリンクの設定を使います。PDFへ案内するなら、先にPDFのアップロードと表示確認を済ませると、リンク先の取り違えを減らせます。

公式資料確認日：2026年10月14日。ボタン文言と確認の順序は編集部の提案です。画像は公式参考画面で、利用中のテーマでは見た目が異なる場合があります。