Contact us page

This section will guide you to set up the contact page like demo site

Info Required Modules: Webform, PHP filter.

A. Add "Google maps" block

Step 1 Go to Structure > Block . Add new block with following properties:

Step 2 Enter the following text to the text area:

       <p class="google-map-help">If you need help, please use our
        web form or find our office address, phone number. There you'll 
        find answers to many common questions</p>
<iframe width="100%" height="300" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps?f=d&source=s_d&saddr=&daddr=Ohio&hl=en&geocode=CczG-J3_sIvNFQe4aAIdDfAO-ynBjk21euk2iDEW2Z-cOWTN5Q&sll=40.417287,-82.907123&sspn=4.541494,10.821533&g=ohio&mra=ls&ie=UTF8&t=m&ll=40.417287,-82.907123&spn=4.541494,10.821533&output=embed"></iframe>
<div class="contact-map-info">
<div class="contact-address"><h3 class="add-title">Office's address</h3>468 Nam ultricies dolor eu velit varius scelerisque.
 Consequat onec quis massa</div>
<div class="contact-info">
<p class="contact-tel"><span>Phone. </span>(+ 012 ) 20 7345 667</p>
<p class="contact-email"><span>Email. </span>support@themebrain.com</p>
</div>
</div>
    

B. Add "Contact us" menu

Step 1 Go to Content > Click "Add content" link > Click webform link, and Add Contact us webform with following properties:

At comment tab, set following value: At URL path settings tab, set following properties:

Step 2 Click "Save" button. New window is opened, at Form components tabs, add some fileds following properties:

At Form settings tab, set following properties:

Step 3 Click "Save" button.