閉じる
閉じる

あまめも

[甘]コンタクトフォームを「Contact Form 7」プラグインで簡単に追加してみた。

基本的にツイッターメインの あますた(@amaguristar)です。
なので、もし何かの拍子に連絡したくなったらツイッターで絡んでくれると嬉しいです。

でも、もしかしたら「ツイッターをやってないけど連絡がとりたい!」って人が中にはいるかもしれないので(これは違うんじゃないか?とか誤字脱字多いよ!とか)、メッセージ送信フォームをつけてみました。

 

「Contact Form 7」プラグイン導入

自分でフォームを作成しても良いとは思いますが「折角プラグインがあるんだし、使わないと時間の無駄だよね?」ってことで、今回は「Contact Form 7」プラグインを導入して作成します。

インストール

いつものように「WordPress」の管理画面からインストール。

20150331_cf7_001

「キーワード」を入力して、表示されたら早速「今すぐインストール」ボタンをポチ。

20150331_cf7_002

インストールが完了したら忘れずに有効化。

問題なく有効化が完了すると

プラグインの有効化を押して「プラグイン」タグを開くと、

20150331_cf7_003

こんな感じ、WordPressの管理画面には

20150331_cf7_004

「問い合わせ」タグが表示されます。

プラグインの簡単な設定

「問い合わせ」タグを選択すると、

20150331_cf7_005

こんな感じに「新規追加」ボタンがあるので、選択。

20150331_cf7_006

こんな感じに画面が表示されます。
上の方にある「無題」という場所をクリックすると文字が打ち込めるようになるので、そこにコンタクトフォームの名前(識別子?)を入力。
今回は仮に「Contact」と入力しました。

20150331_cf7_007

入力すると、すぐ下に「コード」が表示されるので、それをコピーしてページの表示したいところにペースとするのみ。

コピーした後でもいいので「保存」ボタンを押すのを忘れずに!

まとめ

保存したコードを今回は、プロフィールの下の方に

20150331_cf7_008

こんな感じに貼り付け。
実際の表示を見てみると

20150331_cf7_009

ちゃんと反映されてます!
デフォルトの機能で十分に使えるので、特に変更しなくてもいいのですが「ど〜しても」という方はいろいろと設定ができるので、プラグインの説明を見てみてください。
製作者が日本人ということもあり、詳細な説明が日本語で書かれているので、とてもわかりやすいです。

関連記事

  1. ず〜と気になってたHPの文字をマーカー(蛍光ペン)でなぞった感じ…

  2. [甘]気になってしょうがないのでさっそく画像表示を直してみた。

  3. Gitを使用してると「このファイルは管理しないんだけど・・・」っ…

  4. HTML

    HTMLで「引用符を自分好みに設定したい」って時は

  5. お店の「お知らせ」を開いたら記事ページに飛ぶようにした方が良いん…

  6. 09222021-info

    HTMLでふりがなを表示する方法!タグの使い方

こんなメモもありますよ♪

Twitter

ページ上部へ戻る