閉じる
閉じる

あまめも

[甘]コンタクトフォームを「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. 線(line)

    【HTML】<hr>タグ(区切り線)を簡単にカスタム…

  2. 【HTML】サイトにテキストボックスを付けたいって時の設定方法

  3. take092-thumbnail

    【WaznFilm更新】MarkdownをWordPressのG…

  4. ブログデータをローカルに移す方法を良く忘れるのでメモしとこ〜っ

  5. 【HTML】ホームページから任意のファイルをダウンロードさせる方…

  6. WordPressのバージョンをアップしたら画像読み込みがおかし…

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

Twitter

ページ上部へ戻る