contact form 7 – XTRA Tutorials https://xtratheme.com/docs Documentation of XTRA WordPress Theme Sun, 23 Feb 2025 07:04:11 +0000 en-US hourly 1 https://wordpress.org/?v=6.8.2 How to Create a Custom Contact Page with CF7: A Step-by-Step Guide? https://xtratheme.com/docs/how-to/how-to-create-a-custom-contact-page-with-cf7-a-step-by-step-guide/ https://xtratheme.com/docs/how-to/how-to-create-a-custom-contact-page-with-cf7-a-step-by-step-guide/#respond Tue, 20 Aug 2024 10:59:12 +0000 https://xtratheme.com/docs/?p=3589

Watch the video to learn how to create CF7 page

Step 1
Steps

Add CF7 in a page with Xtra Theme

  1. Add a new page or post
  2. Edit it with Elementor
  3. Search Contact Form 7 in elements list
  4. Add element of Contact From
  5. Customize the form
  6. Save the page or post
]]>
https://xtratheme.com/docs/how-to/how-to-create-a-custom-contact-page-with-cf7-a-step-by-step-guide/feed/ 0
Element: Contact form 7 Pro https://xtratheme.com/docs/page-builder/element-contact-form-7-pro/ https://xtratheme.com/docs/page-builder/element-contact-form-7-pro/#respond Sun, 16 Jun 2024 19:14:32 +0000 https://xtratheme.com/docs/?p=1424

Video Tutorial

Description and Screenshot

Step 1

Contact form 7 with custom StyleKits and more ability to design inputs, buttons, etc. Contact Form 7 can manage multiple contact forms, plus you can customize the form and the mail contents flexibly with simple markup. The form supports Ajax-powered submitting, CAPTCHA, Akismet spam filtering and so on.

Cf7 2
  • Contact Form – Select contact form, If you haven’t, Go to Dashboard > Contact add new
  • Container Styling – Overall contact form styling like background, border, padding, etc.
  • Labels Styling – Labels above inputs styling typography, color, size, etc.
  • Inputs Styling – Inputs and textarea styling background, color, size, etc.
  • Button Styling – Buttons styling background, color, size, etc.
  • Select option Styling – Select fields styling background, color, size, etc.
  • Select dropdown Styling – Dropdown styling background, color, size, etc.
  • All Rows Styling – You can add style for each contact form fields rows
  • Each Fields Styling – Customize each rows, e.g. you can set width 48% to field 1 and 2
  • Advanced tab – Responsive, Animation, Parallax, etc.
]]>
https://xtratheme.com/docs/page-builder/element-contact-form-7-pro/feed/ 0