문의 양식 7 Elementor 위젯: CSS가 없는 스타일 CF7
무료 마스터 애드온 플러그인의 문의 양식 7 위젯은 당신이 내장 된 모든 양식을 배치합니다 문의 양식 7 elementor 페이지에 올려 패널에서 스타일을 지정할 수 있습니다. 양식을 선택하고 디자인 변형을 선택한 다음 컨테이너,제목, 필드,라벨을 설정하고 제출 버튼 및 오류 메시지를 설정합니다. 문의 양식 7 은 여전히 필드를 처리하고 이메일을 보냅니다. 4 가지 디자인 변형은 무료이며 7 가지 더 Master Addons Pro 가 함께 제공됩니다. 무료 문의 양식 7 플러그인이 설치되어 있고 적어도 하나의 양식이 생성되어야합니다.
Elementor에 문의 양식 7을 추가하는 방법
무료인 Elementor가 필요합니다 문의 양식 7 플러그인 및 무료 마스터 애드온 플러그인.
- 문의 양식 7을 설치하고 아래에서 양식을 만드세요 연락처, 새로 추가필요한 필드 및 이메일 설정이 있습니다.
- 설치 및 활성화 WordPress.org 의 마스터 애드온.
- Elementor로 페이지를 편집하고 위젯 패널을 검색하세요 문의 양식 7. 마스터 애드온 배지가 있는 것을 선택하세요.
- 에서 문의 양식을 선택하세요, 양식을 선택하세요.
- 스타일에서는 디자인 변형을 선택합니다(1~4단계는 무료입니다).
- 컨테이너, 필드, 라벨, 버튼 및 오류를 조정한 다음 라이브 페이지에 테스트 메시지를 제출합니다.
모든 설정은 에서 다룹니다 문의 양식 7 위젯 설정 가이드.
디자인 변형: 무료 4개, 프로 7개
스타일에서는, 디자인 레이아웃, 다음을 선택하세요 디자인 변형. 스타일 하나에서 스타일 넷은 무료 플러그인에 있습니다. 스타일 다섯에서 스타일 일레븐 필요 마스터 애드온 프로. 각 변형은 필드와 버튼을 함께 스타일링하며,다음 섹션에서 이후에 어떤 부분도 변경할 수 있습니다.
- 페이지의 모든 위젯은 자체 변형을 사용할 수 있으므로 바닥글 양식과 연락처 페이지 양식이 다르게 보일 수 있습니다.
- 아래 콘텐츠 탭에서 양식을 선택하세요 문의 양식을 선택하세요. 목록은 연락처 양식 7 에서 만든 양식을 보여줍니다.
- 문의 양식 7이 활성화되지 않은 경우 위젯에 양식 대신 알림이 표시됩니다.
스타일링 문의 양식 7: 위젯 대 CSS 대 Elementor Pro 양식
Elementor 사이트에서 잘 생긴 양식을 얻는 세 가지 일반적인 방법이 있습니다. 비교 방법은 다음과 같습니다.
| 마스터 애드온 CF7 위젯 | CF7 에 사용자 정의 CSS | Elementor Pro Form 위젯 | |
|---|---|---|---|
| 양식 작성기 | 문의 양식 7 | 문의 양식 7 | Elementor Pro 에 내장되어 |
| 스타일링 | 패널 컨트롤 및 11 가지 변형 (4 가지 무료) | CSS 를 작성하고 유지한다 | 패널 컨트롤 |
| 비용 | 무료(7가지 변형에는 Pro가 필요함) | 무료 | Elementor Pro가 필요합니다 |
| 위한 최고의 | 이미 CF7을 사용하고 있는 사이트 | 완전한 제어를 원하는 개발자 | 한 곳에서 양식과 작업을 원하는 Elementor Pro 사이트 |
이미 Contact Form 7 양식이 있는 경우 위젯이 디자인과 일치하도록 만드는 가장 빠른 방법입니다. 다른 양식 플러그인을 사용하는 경우 다음을 참조하세요 닌자 양식 또는 중력 형태 위젯 또는 메일침팬지 가입을 위한 위젯.
양식 컨테이너 및 제목
양식 컨테이너 색상, 그라데이션 또는 이미지 배경을 설정합니다 테두리 상단 색상, 형태 폭 그리고 양식 패딩. 그만큼 제목 섹션에서는 양식 마크업에 제목이 있는 경우 양식 마크업 내부에 제목의 색상, 정렬 및 타이포그래피를 설정합니다.
- 넓은 열에서 좁은 형태의 가운데를 맞추려면 형태 폭을 100% 미만으로 설정합니다.
- 상단 테두리 색상은 양식 위에 간단한 악센트로 작동합니다.
- 패딩은 컬러 카드 안에 양식 공간을 제공합니다.
필드 및 라벨
입력 및 텍스트 영역 배경색, 텍스트 색상, 패딩을 설정합니다 필드 너비텍스트 필드, 텍스트 영역 및 선택 메뉴에 대한 경계 및 경계 반경입니다. 라벨 자체 색상과 타이포그래피가 있으므로 필드 이름은 방문자가 입력하는 것과 구별될 수 있습니다.
- 필드 너비는 백분율로 작동하므로 CF7 양식 마크업에 구축된 2열 레이아웃에 유용합니다.
- 확인란, 라디오 버튼 및 파일 입력은 테마 또는 CF7 스타일을 유지합니다.
- 접근성을 위해 필드 배경과 텍스트 간의 대비를 충분히 유지합니다.
버튼 및 오류 메시지 제출
제출 버튼 타이포그래피와 일반 및 호버 탭이 있습니다: 일반의 경우 배경,텍스트 색상 및 테두리 색상,호버의 경우 배경 및 텍스트 색상. 테두리 너비,테두리 색상,반경 및 패딩은 탭 아래에 설정됩니다. The 오류 섹션 스타일 오류 메시지 필드 아래 및 검증 오류 전체 양식에 대해 콘텐츠 탭에서 각 양식을 표시하거나 숨길 수 있습니다.
- 기본 버튼은 흰색 텍스트가 있는 보라색 (#6e00e9) 이므로 브랜드 색상을 설정합니다.
- 필드 오류를 숨기면 양식이 더 깔끔해지지만 방문자는 양식 수준 메시지에 의존합니다.
- 버튼에 대한 아이콘 컨트롤이 없습니다. 하나를 추가하려면 을 참조하세요 문의 양식 7 제출 버튼에 글꼴 멋진 아이콘을 추가하는 방법.
문의 양식 7에 대해 자주 묻는 질문
이것을 기존 Contact Form 7 양식에 어떻게 연결합니까?
콘텐츠 탭에서 엽니다 문의 양식을 선택하세요니다. 그것은 당신이 만든 모든 양식을 나열합니다 연락처 양식 7. 하나를 선택하면 위젯이 선택한 디자인으로 표시합니다.
내 양식이 여전히 이메일을 보내고 문의 양식 7에 구성된 대로 작동합니까?
예. 위젯은 양식의 모양만 변경합니다. 필드,이메일 설정,메시지 및 스팸 방지는 Contact Form 7 에 그대로 있으며 설정대로 작동합니다.
Contact Form 7 위젯은 무료인가요?
예,위젯은 무료 Master Addons 플러그인의 일부이며,스타일 1 에서 스타일 4 까지는 무료입니다. 스타일 5 에서 스타일 일레븐 필요 마스터 애드온 프로니다. 문의 양식 7 자체도 무료입니다.
Contact Form 7 플러그인이 필요합니까?
예. 이 위젯은 Contact Form 7 양식 스타일을 지정하므로 무료 Contact Form 7 플러그인을 설치하고 활성화해야 합니다. 이 플러그인이 없으면 위젯에 “Contact Form 7 is Not Activated” 알림이 표시됩니다.
Contact Form 7 플러그인에 새 필드를 추가하면 어떻게 되나요?
문의 양식 7 에서 양식을 편집하고 저장합니다. 위젯은 업데이트된 양식을 보여주며 필드와 레이블 스타일은 모든 텍스트 필드와 레이블을 대상으로 하기 때문에 새 필드에 적용됩니다. 미리보기가 업데이트되지 않으면 Elementor 편집기를 새로 고칩니다.
양식을 스타일링하려면 CSS를 알아야 합니까?
모두 패널 컨트롤인 색상, 테두리, 간격 및 타이포그래피의 경우 아니요. 두 필드를 나란히 놓는 것과 같은 양식 내부의 레이아웃은 연락처 양식 7 양식 마크업에서 가져옵니다.
트렌드 엘리먼트 위젯 및 확장
더 짧은 시간에 정교한 웹사이트를 구축하세요.
![Elementor용 마스터 애드온 게시물/페이지 복제기 확장: 랜딩 페이지를 생성하는 WordPress 페이지 목록의 MA 복제기 행 링크 - [복제된 #128] 초안](https://d1asvmc6qcowgk.cloudfront.net/wp-content/uploads/2026/09/15102930/post-page-duplicator-768x403.webp)
