ウェブデザイナーの毎日のお仕事のメモ - mainichi web まいにちウェブ

作成日:2020.08.18  最終更新日:2021.07.20

WordPress

【contact form 7 の使い方】WordPressで簡単にフォームを設置するためのプラグイン。

WordPressでサイトを制作するさい、フォームを設置する必要があることは多々あるかと思います。その際によく使っているContact Form 7というプラグインの使い方のメモです。

プラグインをダウンロード

まずは、プラグインをダウンロードします。

WordPressの管理画面
『プラグイン』>『新規追加』ボタンを押す。

テキストエリアに『Contact Form 7』と入力。表示された『Contact Form 7』のプラグインの『今すぐインストール』ボタンを押す。その次に同じ場所に表示される『有効化』ボタンを押す。

※下記URLよりダウンロードしてきて、サーバーに直接アップするやり方もあります。
https://ja.wordpress.org/plugins/contact-form-7/

これで、準備はOKです。

ナビゲーションに、『お問い合わせ』というラベルが追加されます。

フォームを表示したいページを準備する。

※この項目に関しては、既にページを準備されている方は飛ばしてください。
 このパートに関しては、ご自身の必要に応じてご準備ください。

今回は、フォームを表示するページを『お問い合わせ』という名前で、
xxxxxxxxx.com/contact/ のようなURLで表示されることを想定して作成していきます。

お問合せフォームをつくる

※『Contact Form 7』をダウンロードをしてきて、デフォルトで作成されているフォームの内容を利用して作成していきます。

『お問い合わせ』を開く

ナビゲーションの『お問い合わせ』を押す。

デフォルトで作成されている『コンタクトフォーム1』を押す。

フォーム、のタブに、
・お名前
・メールアドレス
・題名
・メッセージ本文
・送信
がデフォルトで設定してあります。

ショートコードをコピーする。

赤枠で囲っている、青背景で表示されているショートコードをコピーします。

※今回はこの id=925 になっていますが、このidはサイトによって異なりますので、ご注意ください。

表示したいページを開く

今回は、フォームを表示する固定ページを『お問い合わせ』を開きます。

本文部分にコピーしてきた先ほどのショートコードをペースト。

これだけで準備は完了です。

準備したページを表示してみる

・お名前
・メールアドレス
・題名
・メッセージ本文
・送信
の非常にシンプルなフォームが表示されるかと思います。

最新記事