How to embed a Google Map into a Joomla Page PDF Print E-mail
Written by Administrator   
Friday, 02 April 2010 12:53
Map is a great way to visually show your visitors the location of something--be it a business address, the location of a great restaurant, where you went on your ski trip, etc. Having a visual clue of where something is reinforces the location you're trying to provide in a way that a simple address doesn't. When it comes to businesses, the more likely someone is to remember where your business is located, the more likely they are to visit.

 Maybe, You should read :

1.How to Add a List of Related Articles to Your Joomla Site

2.How to Adding a Flash Banner to Your Joomla site

Using Google Maps

Google Maps actually has a pretty slick way to get a map into a page quickly. There are two manual methods of getting the map you want:

First Method

1.Go to the Google Maps website: maps.google.com.

2.Search for an address or business.

3.When you click the 'Link' link in the top-right toolbar, you'll be presented with two options: "Paste link in email or IM", and "Paste HTML to embed in website". Copy everything in the second option's text field to copy the HTML code needed to paste into an article.

Second Method

1.Go to the Google Maps website: maps.google.com and find the location that you'd like to use.

2.Click the 'Link' link in the top-right toolbar again, but this time, notice the "Customize and preview embedded map" link below the second field. Click it.

3.A new page will open that will let you customize the size and exact location in the map. Drag the map around to show and highlight exactly what you are pointing to.

4.Once you have your map size/location how you want it, copy the HTML code at the bottom of the page.

Embedding the Map

Once you've copied your HTML code, we need to paste it somewhere useful. One option would be to drop it directly into a page such as the 'Contact' page. Before we get to editing any articles, make sure you Disable your WYSIWYG editor. Here are some instructions on doing that. Once your WYSIWYG editor has been disabled, find and click on the article you'd like to add the map to via the Article Manager. Without your WYSIWYG editor enabled, you'll likely just see a bunch of HTML code. Paste the code you copied from Google Maps into your content (you may need to use trial and error to place it in a specific spot on your page) and save your article. That's all there is to it!

Other Solutions

Being the industrious community that it is, Joomla! developers have come up with a number of different ways to get a map into a Joomla! page. Here are some different solutions:

Webmap+ - A commercial plugin that makes embedding maps easy while having many handy features.

Googlemaps Plugin - allows an easy way to embed a map into your articles easily. Tons of configuration options. Be sure to check out the 'Demo' page.

GoogleMap Component - This recently-updated component offers loads of customization options. It also has a very active community of users and developers.

Those are just a few of the solutions out there for Joomla! users to take advantage of. 

Questions/Comments

If you've got a question about embedding a map in a Joomla! site, or have suggestions for other cool ways to get a map into a Joomla! site, feel free to post a comment.

Author :James Hafner is an Austin, TX-based developer who brings years of web experience to the HTJ team. Read his post here


Administrator
Written on Friday, 02 April 2010 12:53 by Administrator

Viewed 1723 times so far.
Like this? Tweet it to your followers!

Comments (1)Add Comment
0
...
written by paul, June 15, 2010
am sorry this thing do not totally work.it simply displays the HTML code and if you disable the WYSIWYG editor you cannot even edit the article

Write comment

security code
Write the displayed characters


busy
Last Updated on Friday, 02 April 2010 15:09
 

Extensions

Tools
+Backup
+Mini tools

+
Advertise
+
SEO &SEF

Media
+
Gallery
+
Video
Styles
+Tab & Slide
+Sharing
+
Tags Cloud
+Visitors
Shop
+
Update
+Update

Articles
+Blogger
+News
+Comments
+Auto post
Social
+
Forums
+ShoutBox

Special
+
Holidays
+Editors

+Files

Manage
+
Download
+Update

+Update
 

Most downloads in 10 days

calendar.gifAug.01

Today Joomlapanel are pleased to announce the release of  Free JP Dreamland Template, the 5th Te...

calendar.gifMay.20

a free Joomla template for travel

calendar.gifMar.16

MyPortfolio Joomla 1.5 template is very first template I ever made for Joomla Community when Port...

calendar.gifJul.31

i-Business is a Joomla 1.5 native template. This is a clean and lightweight template.i-Business a...

calendar.gifMay.20

A nice templates for Joomla 1.5

Extensions stats

The download archive contains currently 143 downloads in 24 categories. To date, these have been downloaded 84698 times.

Blog Tips

Blog News
SEO Tips

Online

We have 84 guests online

Newest Files

calendar.gifMay.23

This Amazing Template design is delivered with the Following. 18 Module Positions CS...

calendar.gifMay.23

DS BUSUIT ARRIVED.The waits are finally over. With the long wait for the DS Busuit, now the beta...

calendar.gifMar.01

Latest Free Template From Joomvision

calendar.gifMar.01

Today Joomvision are pleased to announce the release of Free JV 9BodyTemplate

calendar.gifSep.11

The Fastest Joomla! Admin Template AdminPraise Lite is a super lightweight Joomla! administrator ...

Latest Comments

English Bulgarian Chinese (Traditional) Dutch French German Greek Hungarian Indonesian Italian Malay Portuguese Russian Spanish Turkish