SEOランディングページにフォームを設置する手順

  • このエントリーをはてなブックマークに追加
  • Pocket
  • LINEで送る

本日はプラグイン版SEOランディングページにお問い合わせフォームを設置する手順をご紹介いたします。

SEOランディングページにフォームを設置する手順

フォームの設定はカンタンです。3つのステップで完了いたします。

1. Contact Form 7をインストールする
2. フォームを作成する
3. ショートコードを差し込む

以前に上記3手順を別でまとめています。以下に記事を貼っておきますね。自動返信メールの送信も設定していますのでぜひご確認くださいませ。大体15分くらいもあれば差し込みまで行えます。ちなみに「記事内ではパーマリンクをcontactに設定する流れがありますがLP内への設置なのでスルーしてもらえばOK」です。

ワードプレスで管理者と申込者へ自動返信メールを送信できるお問い合わせフォームを設置する方法

全準備が整ったらショートコードをコピペしておきましょう。

もし、フォームをテーブルでレイアウトしたい場合は以下をご利用くださいませ。

<div class="form">
<table cellspacing="1">
<tbody>
<tr>
<th>お名前 <span style="color:red;">*</span></th>
<td>[text* your-name placeholder "例)山田 太郎"]</td>
</tr>
<tr>
<th>メールアドレス <span style="color:red;">*</span></th>
<td>[email* your-email placeholder "例)taro@example.com"]</td>
</tr>
<tr>
<th>題名</th>
<td>[text your-subject placeholder "例)プラグインについて"]</td>
</tr>
<tr>
<th>メッセージ本文</th>
<td>[textarea your-message placeholder "はじめまして、山田と申します。"]</td>
</tr>
</tbody>
</table>
<p>[response]</p>
<p class="btn-color-01">[submit "この内容で送信する"]</p>
</div>

そのまま貼り付けるだけでOKです。

貼ったら「保存」を押しましょう。

ページ側に表示した例です。スマホ端末にもパソコンでも最適化されていますね。

以上で設置完了です。ちなみにテーブルでレイアウトを組まなくても崩れません。

両方ともスマホ対応済みなのでお好きな見た目でご使用くださいませ。

【今すぐ無料プラグインを手に入れる】
無料ダウンロードはこちら

ワードプレス専門家に丸投げする

WPホームページ研究所はワードプレスを中心としたブログ作成・ホームページ制作・オウンドメディア構築・プラグイン設定・調整など幅広いカスタマイズに対応しております。 記事の掲載情報はもちろんお好みの機能をいただければ専属スタッフが心を込めて対応させていただきます。まずはお気軽にお問い合わせくださいませ。

お問い合わせの種類をお選びください(もっとも近い項目)

法人の場合は法人名とご担当者のお名前をご入力ください

返信時のご連絡に利用するメールアドレスをご入力ください

運営中のウェブサイトURLがあればご入力ください

お困りの内容があれば詳しい内容をお聞かせください