OpenCart 1.5.x. How to edit Contact us page.

The tutorial shows how to edit Contact us page in OpenCart template

We will edit Info and Map sections

Access OpenCart administration panel. In the browser address bar type your_domain_name/admin

Login using your username and password

From the top menu select System > Settings and click Edit button

Edit info section of Contact us page and save the changes

To edit the map location we should edit contact us page file.

Please connect to your domain via FTP using any FTP manager or FileManager within your hosting control panel and navigate to /catalog/view/theme/themeXXX/template/information folder

Edit contact.tpl file using any PHP or HTML editor

Search for the line wich looks similar to the following one:

<iframe width="385" height="243" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps... >

The code we are interested in ends with </iframe>

Go at http://maps.google.com to generate new map

Locate the place you would like to display on the map and click Link button

Click ‘Customize and preview embedded map’ to fine tune your map

Check map size in contact.tpl file (check <iframe width=”385″ height=”243″. Width and height is the one we need) and set exactly the same size for your new map

Copy the code from ‘Copy and paste this HTML to embed in your website’ box. But only part of it. Starting with <iframe … and ending with </iframe>

Now you should remove the old code and insert your new one in contact.tpl. Save the changes and upload file back to /catalog/view/theme/themeXXX/template/information folder.

Feel free to check the detailed video tutorial below:

OpenCart. How to edit Contact us page.