Articles - Joomla Web Development Articles

User Rating: / 2
PoorBest 

1. Install googlemaps plugin in your Joomla website, then follow instructions for settings to be made in the backend (Plugin manager > googlemaps > parameters)
2. Before inserting the code with the format as instructed, follow below steps
3. Using Google Earth, an installed desktop application (freely downloadable), navigate, locate and placemark (bookmark) the location
4. The placemark buttons can be found as one of the top buttons in Google Earth application - at this point this will provide you Latitude and Longitude values in the following format, ex: 14°33'41.28"N121° 1'24.63"E. But this format will not work with the googlemaps plugin.
5. On the same toolbar, click on the "View in Google Maps" button which will switch the same location to the Google Maps website, where in the URL of the page you will then find the equivalent values of the above - ex: 14.561467, 121.02351 (easily indicated by lat and lon)
6. Also, go back to your plugin (in Plugin Manager > Googlemaps plugin), and enter the latitude and longitude values as above
7. Enter proper Googlemap API key (you have to get one first)
8. Insert the code as instructed by the google maps plugin in your Joomla article, with the lat and lon values as provided by the URL in Google Maps
9. HTML tag formatting like non-breaking spaces, para, etc. also works in google maps plugin

To insert in Joomla Component, Modules and Contacts

{mosmap width='100px'|height='100px'|showMaptype='0'|Overview='0'|zoomType='None'|lightbox='1'|effect='vertical'}

Credit to Reumer Tech

Sample codes:

{mosmap width='100px'|height='100px'|showMaptype='0'|Overview='0'|zoomType='None'|lightbox='1'|effect='vertical'}

{mosmap width='500'|height='400'|lat='14.534848'|lon='121.01876'|zoom='3'|zoomType='Large'|zoomNew='0'|mapType='Hybrid'|showMaptype='1'|overview='0'|text='Text text text'|lang=''}

{mosmap width='500'|height='400'|lat='14.534848'|lon='121.01876'|zoom='5'|zoomType='Large'|zoomNew='0'|mapType='Hybrid'|showMaptype='1'|overview='0'|text='Text text text<br>text text text'|lang=''}