{"id":6480,"date":"2017-12-18T11:55:37","date_gmt":"2017-12-18T11:55:37","guid":{"rendered":"http:\/\/qantumthemes.xyz\/manuals\/fluid\/?post_type=ht_kb&p=6480"},"modified":"2019-05-22T08:48:25","modified_gmt":"2019-05-22T08:48:25","slug":"contact-form-7","status":"publish","type":"ht_kb","link":"https:\/\/manuals.qantumthemes.xyz\/firwl\/knowledge-base\/contact-form-7\/","title":{"rendered":"10.1 Contact Form 7"},"content":{"rendered":"

Bundled with the theme comes\u00a0Contact Form 7: it 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.<\/p>\n

Official documentation:<\/strong> https:\/\/wordpress.org\/plugins\/contact-form-7\/<\/a><\/p>\n

Html formatting<\/h3>\n

In order to achieve a nice design result, there are 4 important things to do:<\/p>\n

    \n
  1. Follow the HTML structure provided below<\/li>\n
  2. For multi-column rows, follow the containers structure as in the example<\/li>\n
  3. Be sure to delete the default “for” attribute of the label fields (as invalidates the HTML w3c standards)<\/li>\n
  4. Add the button classes to the submit (attention, the order where you put them is important!)\n
    Example:\u00a0[submit class:firwl-btn__full<\/strong> \"Send message\"]<\/pre>\n<\/li>\n<\/ol>\n
    <label>Your Message<\/label>[textarea msg] \r\n    <div class=\"firwl-row\">\r\n        <div class=\"firwl-col firwl-m6\">\r\n            <label> Your Name (required)<\/label>\r\n            [text* your-nm] \r\n        <\/div>\r\n        <div class=\"firwl-col firwl-m6\">\r\n            <label> Your Email (required)<\/label>\r\n            [email* your-ml] \r\n        <\/div>\r\n    <\/div>\r\n    <div class=\"firwl-row\">\r\n        <div class=\"firwl-col firwl-m6\">\r\n            <label> Phone Number (required)<\/label>\r\n            [email* your-pn] \r\n        <\/div>\r\n        <div class=\"firwl-col firwl-m6\">\r\n        <label>&nbsp;<\/label>\r\n        [submit class:firwl-btn__full \"Send message\"]\r\n        <\/div>\r\n    <\/div><\/pre>\n
    How to add a contact form to your page using Page Builder<\/h3>\n
    You can add a contact form to\u00a0your page using WP Bakery Page Builder<\/strong>.
    \nWhen editing a page, make sure you are using the\u00a0Backend Editor<\/strong> (if not active yet).<\/p>\n
    \"\"<\/p>\n
    Then add to your page the Contact Form 7<\/strong> shortcode.<\/p>\n
    \"\"<\/a><\/p>\n
    After this, you can edit the\u00a0shortcode and choose a previously created contact form.<\/p>\n
    \"\"<\/a><\/p>\n
    How to add a contact form with raw shortcode<\/h3>\n
    You can also add a Contact Form 7 without its shortcode.
    \nGo to Contact<\/strong> -> Contact Forms.<\/strong><\/p>\n
    \"\"<\/a><\/p>\n
    Each Contact Form has its own shortcode.<\/p>\n
    \"\"<\/a><\/p>\n
    You can copy and paste it wherever you want whether is a post, page or sidebar.<\/p>\n","protected":false},"author":1,"comment_status":"closed","ping_status":"closed","template":"","format":"standard","meta":{"footnotes":""},"ht_kb_category":[707],"ht_kb_tag":[685,679,94],"class_list":["post-6480","ht_kb","type-ht_kb","status-publish","format-standard","hentry","ht_kb_category-forms-and-newsletter","ht_kb_tag-cf7","ht_kb_tag-contact-form","ht_kb_tag-plugins"],"_links":{"self":[{"href":"https:\/\/manuals.qantumthemes.xyz\/firwl\/wp-json\/wp\/v2\/ht_kb\/6480"}],"collection":[{"href":"https:\/\/manuals.qantumthemes.xyz\/firwl\/wp-json\/wp\/v2\/ht_kb"}],"about":[{"href":"https:\/\/manuals.qantumthemes.xyz\/firwl\/wp-json\/wp\/v2\/types\/ht_kb"}],"author":[{"embeddable":true,"href":"https:\/\/manuals.qantumthemes.xyz\/firwl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/manuals.qantumthemes.xyz\/firwl\/wp-json\/wp\/v2\/comments?post=6480"}],"version-history":[{"count":6,"href":"https:\/\/manuals.qantumthemes.xyz\/firwl\/wp-json\/wp\/v2\/ht_kb\/6480\/revisions"}],"predecessor-version":[{"id":8236,"href":"https:\/\/manuals.qantumthemes.xyz\/firwl\/wp-json\/wp\/v2\/ht_kb\/6480\/revisions\/8236"}],"wp:attachment":[{"href":"https:\/\/manuals.qantumthemes.xyz\/firwl\/wp-json\/wp\/v2\/media?parent=6480"}],"wp:term":[{"taxonomy":"ht_kb_category","embeddable":true,"href":"https:\/\/manuals.qantumthemes.xyz\/firwl\/wp-json\/wp\/v2\/ht_kb_category?post=6480"},{"taxonomy":"ht_kb_tag","embeddable":true,"href":"https:\/\/manuals.qantumthemes.xyz\/firwl\/wp-json\/wp\/v2\/ht_kb_tag?post=6480"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}