まとめWordPressでホームページを運営していると自ずと「問い合わせフォーム」が必要になってきます。WordPressには問い合わせフォームを簡単に作ることが出来るプラグインはあります。このプラグインは問い合わせフォームを手軽に作成することが出来るので、ぜひ使ってみてください。どのプラグインにも言える問題があります。それは、「デザイン(CSS)は自分で組まなければならない」という事です。ホームページに問い合わせフォームを設置したのにデザインがされておらず、わかりにくいフォームだとホームページの評価はガクッと下がります。Form」のデザインをご提供&解説していきます。コピペでレスポンシブ対応の問い合わせフォームを作るCSSをコピーデザインをする上で必須なのはCSSです。導入方法はいくつかありますが、WordPressなら共通で出来る方法をご紹介します。下記のCSSをメモ帳などにコピーします。/*変なところで改行される場合はここの数字を変更します。#00142c;}このCSSはレスポンシブ対応で、スマートフォンでもきれいにデザインされたフォームを表示させることが出来ます。CSSの設置コピーしたCSSを実際にWordPresに設置するのですが、テーマに直接設置してしまうと、テーマの更新時に消えてしまいます。今回は「カスタマイズ」からCSSを設置します。管理画面から「外観」>「カスタマイズ」>「追加CSS」の順にクリックします。テキストボックスが表示されるので先ほどコピーしたCSSを全て貼り付けて「公開」をクリックします。これでCSSのコピペは完了です。Formでフォームを作成するのですが、CSSで形を整えたフォームを作成するにはHTMLで作成していく必要があります。下記のHTMLをコピーします。Formのフォーム作成ページを開きます。「テキスト」に切り替えてコピーしたタグを貼り付けます。その他の基本的な設定を行えばレスポンシブ対応のフォームが出来上がります。完成例PCでの表示例:スマートフォンでの表示例:まとめ今回ご紹介したCSSを少しカスタマイズすればあなただけのオリジナルデザインの問い合わせフォームを作ることが可能です。ボタンの色を変えるだけでも全く違った雰囲気のフォームが出来るので是非試してみてください。HatenaLINELINESearchConsoleのモバイルユーザビリティでエラー?!その原因はAutoptimizeプラグインかもNextWordPressのSEO対策で検索上位を目指すたった3つの記事の書き方Prev関連記事SearchConsoleのモバイルユーザビリティでエラー?!その原因はAutoptimizeプラグインかもWordPressでホームページを高速化するためには様々な方法があります。