Porto offers a page template for creating Contact pages. It also now offers the option to paste a custom contact form shortcode in place of the normal form.
Add Contact Page
Step 1 – Create Page
Go to pages, and add new. On the right hand side, in page templates, select “Contact Page”
Once this page template is selected, the following options are available, either below, or on the left hand side:
Step 2 – Add Content
All the fields, but the the ‘Email’ field are options. The email field is required because it is used by the contact form to send the email to that address.
NOTE! Also note that we have now added the section for a custom contact form shortcode. With this you can create a custom contact form, and simply paste the code here. This will allow you to build contact forms with more fields built to your specification.
Step 3 – Test Form
Test the form and make sure you’re receiving your mails. If not, go to Flothemes – General Settings – Misc, and then the option “Contact Page: Email ‘From’ Field” turn this off. Why? On many occasions this will see the emails blocked at a server level as it see’s the contact form email being sent from an email thats not got your domain in it.
If the form isn’t working. Please review our contact form email issues article in the left navigation bar.
Ninja Form Custom Classes
For the users who need a custom form with different fields we recommend a great plugin: ‘Ninja Forms’ .
The plugin works out of the box, but we also offer support for some custom classes that you can use to create 2 columns inputs.
The Following classes are supported by default:
flo-small – if this class is added to a field, then that field will have the width 50% of the parent container. Usually this is used when you want to have 2 fields in the same row.
right – right align the element
left – left align the element
center – center align the element
The custom css classes can be added from advanced settings: