Create and Display Maps in Joomla

Google Maps allows you to display locations, search for places or get directions. If you run a Joomla site to promote your business or event, you will need to show your visitors where your business is located or the where the event is taking place. In this article I will give you a step by step guide on how to create and display maps in Joomla.

  1. Download the following Joomla extension: Zh GoogleMap.
  2. Also download the following Joomla Plugin: Zh GoogleMap for Articles.
  3. Log into Joomla as an Administrator: joomla login
  4. Go to menu “Extensions -> Extension Manager” and first install Zh GoogleMap and the Zh GoogleMap for Articles: menugoogle maps extension
  5. Go to menu “Extensions -> Plugin Manager” and enable Zh GoogleMap Plugin: enable gmaps plugin
  6. To create a map to insert in an article, first you need to create a map. Go to menu “Components -> Zh GoogleMap -> Maps”: create map
  7. Click on “New” to create a map. Then enter the title, description and move the red marker to set a location and save your map: create new mapset map location
  8. Now, to insert your map on an article, create a new article. Use the following code:
    • {zhgooglemap:INSERTMAPIDHERE}
    • Where you have to replace INSERTMAPIDHERE with the ID of the Map that you created article moving to new york
  9. And that’s it! You added a new map! map added

This concludes Create and Display Maps in Joomla.

Looking for quality Joomla Web Hosting? Look no further than Arvixe Web Hosting!

Tags: , , , , , , , , , , , , , , , , | Posted under Joomla | RSS 2.0

Author Spotlight

Milton Parada

Milton Parada

I am a computer engineer, I specialize in Joomla, i am the core engineer of sw social web, I love photography.

Leave a Reply

Your email address will not be published. Required fields are marked *


3 × 9 =

You may use these HTML tags and attributes: <a href="" title="" rel=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>