閉じる
閉じる

あまめも

[甘]コンタクトフォームを「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. [甘]気になってしょうがないのでさっそく画像表示を直してみた。

  2. WordPressでMarkdownを使用し始めたのですが、マー…

  3. テーブルの背景を簡単に奇数or偶数行で色を変えて見易くしたい!

  4. take088-thumbnail

    【WaznFilm更新】フリーアイコンはここで決まり!クオリティ…

  5. 【HTML】サイトで漢字にルビ(読み仮名)ふりたいんだけどなんて…

  6. HPでライン風の対話型吹き出しの表示に枠を付けたい!!ってなった…

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

  1. スシロー 店舗外観
  2. take057-thumbnail

Twitter

ページ上部へ戻る