ナビゲーションメニューにお問い合わせフォームへのリンクを設置する方法

ナビゲーションメニューにお問い合わせフォームへのリンクを設置する方法についての覚書です。
contactform23

説明に入る前にナビゲーションメニューの初期状態を示しておきます。これから、「About」の右側に「Contact」というメニューをつけて、そこからお問い合わせフォームへアクセスできるようにする手順についてメモしていきます。

contactform04

「固定ページ」→「新規追加」をクリック。

contactform05

ページのタイトルを入力。

contactform06

「カスタムフォームを追加」ボタンをクリック。

contactform07

「Add this form to my post」をクリック。

contactform08

以上の操作で以下のようになります。

contactform09

お問い合わせフォームには通常コメント欄等は必要ないので、各チェックを外します。

contactform10

「公開」ボタンをクリック。

contactform11

以上で、お問い合わせフォームのページが作成されます。

次にナビゲーションメニューからお問い合わせフォームのページへアクセスするための設定を行います。

「外観」→「メニュー」をクリック。

contactform12

「メニューの名前」に適当な名前を入力し、「メニューを作成」をクリック。

contactform13

すると、以下のような表示になります。

contactform14

「テーマの場所」の「メインメニュー」のところで、先ほど設定したメニュー(ここでは「menu」)を選択します。

contactform15

「保存」ボタンをクリックし、設定を確定させます。

contactform16

「ページ」の「すべて表示」をクリック。

contactform17

「すべて選択」をクリック。

contactform18

「メニューに追加」をクリック。

contactform19

「メニューを保存」をクリック。

contactform20

ブログでの表示画面に戻ります。

contactform21

以上の手順で、ナビゲーションメニューに「Contact」というメニューが追加されます。

contactform22

「Contact」をクリックし、ブログ上でのお問い合わせフォームの表示状態を確認してみます。

contactform23

ちゃんと表示されましたが、各項目のタイトルが英語なので日本語に直すことにします。

contactform24

「Edit」をクリック。

contactform25

一度、編集内容を全部削除します。

contactform26

arrow02

contactform27

「カスタムフォームを追加」ボタンをクリック。

contactform28

「edit」をクリック。

contactform29

「Label」の欄内を適当な言葉に修正します。

contactform30

すべての項目名について修正した後、「Add this form to my post」をクリック。

contactform31

すると、編集欄が以下のようになります。

contactform32

「更新」をクリック。

contactform33

「固定ページを表示する」をクリック。

contactform34

各入力欄のタイトルが日本語になりました。

contactform35

以上で、ナビゲーションメニューにお問い合わせフォームへのリンクを設置する方法についての説明を終わります。

 

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト / 変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト / 変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト / 変更 )

%s と連携中