みなさんこんにちは!おさかなです!
今回は「【WordPress】ContactForm7、のテキストエリアに【文字】を入れておく方法」について、書いていこうと思います!
それでは、レッツゴー!!!!!
・フォームにデフォルトで文章を入れておきたい方
・WordPressを利用している方
・ContactForm7を利用している方
テキストエリアに「文字」を入れておきたい!


今回はこんな感じで、フォームに文字を入れておく方法をご紹介するよ!

おおお!

文章が書いてあると、お問い合わせしてもらいやすくなるかも!?

「placeholder」を設定しよう!
placeholderとは、実際の内容を後から挿入するために、とりあえず確保した場所のことで、主にフォームのテキストエリアなどで使われます。(ふむふむ…。)
今回はこのplaceholderを使って設定していきましょう!
※今回の方法は、WordPressに「ContactForm7」というプラグインが入っていることが前提なので、まだの方は準備しておいてください。
まずWordPressの「ダッシュボード」>「お問い合わせ」>「新規追加」を押します。

するとお問い合わせフォームの編集ページが表示されます。

今回はこちらのテキストエリアの部分を編集していきます!

your-messageの後ろに…半角スペースを1つ空けて
placeholder"ここにテキストを入力"
と入力します!

ここにテキストを入力の部分は、それぞれの状況に合わせて任意のテキストを入力してください!
(※必ず”ダブルクオート”の中に書いてあることを確認してください。)

テキストの編集が終わったら、最後に「保存」ボタンを押すのを忘れずに!(ポチっと!)

(あともう少し…!🍩)

フォームを設置しよう!
placeholderの設定ができたので、今度はフォームを設置していきましょう!
無事に保存ができると、ページ上部に青色の「ショートコード」が表示されると思うので「コピー」しておきます!

フォームを設置したい場所の「編集画面」へ移動します!
(投稿でも、固定ページでもOK!)

そこに先ほどコピーした「ショートコード」を貼り付けます。
こんな感じで、作成したフォームが選択されていればOKです!

編集画面では、フォームの形が表示されていませんが、保存して公開すると…?無事に、作成したお問い合わせフォームが表示されます!(わーい!)

↓実際に設置したフォームはこちら
※こちらのフォームは動作確認用なので、お問い合わせに使用しないでください

設定した文字も反映されていていい感じだね~!
これで全ての操作は完了です。(やった~!)
お疲れ様でした☕

ここまで読んでくださり、ありがとうございました!