質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

2回答

3527閲覧

wordpressプラグインContact Form 7カスタマイズ時のCSSペースト場所について

ussy

総合スコア10

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2018/10/17 10:56

編集2022/01/12 10:55

ホームページ制作(有料テーマ使用時のContact Form7のカスタマイズ)

ホームページ制作初心者です。
wordpressの有料テーマ「Luminous」をdigipressで購入しテーマとして使用しております。
お問い合わせフォームのプラグインContact Form7をカスタマイズしたく
見た目の良いデザインのCSSをwebで探し
CSSをコピーしました。

拾ったCSS

.form-style-7 { background-image: url('https://wpbeaveraddons.com/wp-content/uploads/2016/07/explore-unsplash.jpg'); background-repeat: no-repeat; background-size: cover; padding: 50px; position: relative; } .form-style-7:before { content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.8); } .form-style-7 .fl-input-group { margin-bottom: 30px; width: 33.33%; float: left; padding-right: 20px; } .form-style-7 .fl-phone { padding-right: 0px; } .form-style-7 .fl-input-group.fl-message { width: 100%; float: none; padding-right: 0; clear: both; } .form-style-7 .fl-input-group input, .form-style-7 .fl-input-group textarea { border-radius: 0; padding: 12px 15px; height: auto; background: transparent; color: #222; border: 2px solid #fff; font-weight: 300; font-size: 15px; text-transform: uppercase; } .form-style-7 .fl-input-group input::-webkit-input-placeholder { color: #fff; } .form-style-7 .fl-input-group textarea::-webkit-input-placeholder { color: #fff; } .form-style-7 .fl-input-group input:focus, .form-style-7 .fl-input-group textarea:focus { border: 2px solid #e66322; background: transparent; } .form-style-7 .fl-button-wrap { position: relative; } .form-style-7 label { display: none; } @media only screen and (max-width: 768px) { .form-style-7 .fl-input-group { width: 100%; float: none; clear: both; padding-right: 0; } }

拾ったサイト

https://wpbeaveraddons.com/free-contact-form-module-presets-beaver-builder/

wordpressのどこにペーストしたらいいかわからない

検索しましたがよくわからず、上記のCSSをどこにペーストしたらよろしいでしょうか?

試してダメだったこと

1. コンタクトフォーム→その他の設定内に記入→反映されない 2. 固定ページ記入→反映されない

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

DigiPressの場合は、テーマ側の設定画面にて独自のCSSを追加するメニューがあります。

管理画面から「DigiPress」→「ビジュアル設定」→「オリジナルスタイルシート設定」に追加して保存してください。

投稿2018/12/15 06:25

msa

総合スコア27

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

ワードプレスのメニューの「外観」→「カスタマイズ」→「追加CSS」に記述してみてください。

投稿2018/10/18 00:03

dit.

総合スコア3235

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問