News&Tips

2018.08.04 GraceWoman

お問い合わせページ 作成方法

ここではプラグインを使ったお問い合わせページ方法をご紹介いたします。
使用するプラグインは「Contact Form 7」です。

まず、「Contact Form 7」を追加します。
プラグインの追加方法はこちらを参考に行ってください。

「Contact Form 7」を追加し有効化すると管理画面のサイドバーに「お問い合わせ」が追加されます。

スクリーンショット-2017-03-27-16.58.54

「お問い合わせ」管理画面に移動すると以下の画面が表示されますので、「新規追加」もしくは初期設定で追加されている「コンタクトフォーム1」を編集していきます。

スクリーンショット-2017-03-27-16.59.54

編集画面に移動すると以下の画面になります。
各タグの詳細はこちらで確認いただけます。

スクリーンショット-2017-03-27-17.01.27

必要事項を記入し、保存をクリックします。

スクリーンショット-2017-03-27-17.04.02

すると以下の文章が表示されますので、作成したお問い合わせフォームを表示させたいページにこちらのショートコードをコピーし貼り付けをすれば完了です。

スクリーンショット-2017-03-27-17.04.29

このように記事内に先ほど表示されたショートコードを貼り付けます。

スクリーンショット-2017-03-27-17.06.22

サイト表示

スクリーンショット-2017-03-27-17.09.36

その他、「Contact Form 7」の詳しい使い方はこちら
また、作成したお問い合わせページのデザイン変更をしたい方はこちらにて説明しております。
お問い合わせフォームのデザイン変更方法

デモサイトのようにカスタマイズしたい

デモサイトのようにカスタイズしたい場合は以下をコピーしてコンタクトフォームに貼り付けてください。


<label><span>お名前 (必須)</span>[text* your-name] </label>

<label><span>メールアドレス (必須)</span>[email* your-email] </label>

<label><span>お問い合わせ内容</span>[textarea your-message] </label>

<div class="submitBtn">[submit "送信する"]</div>

 

Categories
Select Categories
Archives
Select Month
Latest Entries