Putting Google maps on my Website

I am brand new at website design and I am trying to put a website together mostly for fun what I would like to do is put Google maps on a page. On that page I would like to mark locations (trails and camp site) with a little information and a link to a page that would have more information. I believe there is a plug-in I can buy for only $25 but I am enjoying learning and would like to learn how instead of just a plug and play. In contrast to that though I cheating and using Dreamweaver CS5. Thank you for any help and sorry in advance for my ignorance. If there is a site or explanation step by step (including code). I have visited google maps http://code.google.com/apis/maps/documentation/javascript/tutorial.html#LoadingMap .
My site is www.campingcoaches.com it is just for fun and a few friends to share where they have been camping so the coding I am working on in my spare time.
All it take for Evil to thrive is for good people to do nothing

All you need to do is to copy past the code and repeat from the "var marker" and down to the addListener for each marker with overlay you want.
Remember to give the variables unique names.
You can use this geoCode url to retrieve geocodes for the addresses you would like to have on your map:
http://maps.google.com/maps/api/geocode/json?address=berlin,germany&sensor=false&language= en
Look for the "location" section.

Similar Messages

Iweb08 Google Maps in website gives me mobleme page???

All of a sudden the Google maps in my websites gives me an apple site page?? Is any one else experiencing that?
Message was edited by: jeitzen

Welcome to the Apple Discussions. Yes. That's because the MobilMe servers have not activated all of the server side software that is needed. A temporary fix is to add the map via an HTML Snippet instead of the Google Web Widget. The HTML snippets work as seen here
OT

Inserting Google Map into a web page

Hello
I am having severe difficulty in trying to insert a Google Map into my website at http://www.peterdewitscafe.co.uk.
I have got a API key, then generated code to copy/paste as appropriate. After several attempts I can only get an error message saying:
"The Google Maps API key used on this web site was registered for a different web site. You can generate a new key for this website at http://www.google.com/apis/maps/".
When asked by Google to enter my URL I enter http://home.btconnect.com/peterdewitscafe/, as I understand that the key/code is specific to the server (my server is ftp.btconnect.com).
My site is built with freeway. I'm wondering if there is a problem arising from the fact that I built an earlier site with the same URL in iWeb. But the freeway one is uploaded now and surely overwrites the old one doesn't it?
Does anyone have any advice? - or is there no way around this problem.
Any help will be very welcome.
Regards toymaker1
iMac Mac OS X (10.4.8)

Have you actually tried this to see what it does?
In Muse when you import the oam file the entire project within the file is extracted and placed within the folder structure of the Muse project and using an iFrame the Edge Animate animation is included into the html of the Muse project.
Dreamweaver, Indesign and whatever other Adobe software that can import Edge Animate projects can't take the html and individual assetts like css and js and just use them. Instead you have to export the Edge Animate project into an oam file which is basically a zip file with folder structure and some instructions that tell where everything is and how they are linked together.
Indesign, Muse, Dreamweaver then takes this file and exports out the oam folder into the current folder structure of the current opened project and brings in the assetts. In Muse it uses an iFrame to bring in the Edge Animate files, I don't know about Dreamweaver or Indesign.
So you see, the oam is being used but when you upload the finished project it is not the oam that is uploaded but the actual html, css and js contained within. Dreamweaver just needs the context of everything and it can only get that from the OAM file, it is only a container.
If you wanted to take the Edge Animate assetts and put them together manually inside of dreamweaver you can do that but the OAM import is just faster because dreamweaver does it all for you.
All I can say is this is Adobe's way of doing things.

Positioning Google Maps in Dreamweaver

I inserted a Google map into a website, but I can’t adjust the position on the page. I only want to move it to the right by 150 pixels, and float some extra text next to it to the right of the map. I got the code off the Google Maps link and followed the instructions on placing a Google map in Dremweaver from a video tutorial, and the map itself seems to be fine. I have tried adjusting various items the CSS fules, using the float and width adjustment. None of the general positioning options make any difference. Padding won’t work either. None of the other divs on that page are responding to any CSS adjustments, which makes me wonder if the map is somehow causing the problem. Can anyone suggest what I can try to be adjust the layout?

Hello Liz,
on "behalf" of SnakEyez02 (he probably has to do other things) I'll will reply: I'm sure he will recommend that you publish the link to your website here in the forum, where your Google map is integrated.
Did you have a look to "Google Places", where you are conducted how to insert Google maps too. I used it on one of my websites.
On the other hand, please have a look to "Adobe Widget Browser", where you will find such a gimmick too, I for my part I'am convinced it's much easier in application, see here please:
Hans-Günter

In iWeb, Why should my Google map be linked to MobileMe

I have a Google map on my website.
Now that MobileMe has closed I cannot use Google Maps.
In iWeb, Why should my Google map be linked to MobileMe when I have never joined MobileMe?
Any help please

The Google map widget assets were hosted on MobileMe.
Use the Google Map code in an HTML Snippet instead.
Google has a good tutorial for creating basic maps...
http://maps.google.com/help/maps/getmaps/plot-one.html
If you want to make changes to the code or add features...
http://www.iwebformusicians.com/iweb-snippets/map-tutorial.html
http://www.iwebformusicians.com/iweb-snippets/map.html
... or create an info slider...
http://www.iwebformusicians.com/iweb-snippets/map-2.html

My own Google Map icons are not visible in Firefox 8

I have many Google Maps on my website and they contain both default Google icons and my own icons, each with their own URLs. They work correctly in all other browsers, and Firefox 7. However, yesterday I loaded Firefox 8. In Firefox 8 the Google default icons are still visible but my own icons are now invisible, but their placeholders are still there. They are still visible in other browsers. Also, if I now try and add one of my icons to a map, the process seems to work correctly, including a placemark name appearing, but the icon is invisible. The invisible icon is definitely there because you can click the placemark and be taken to the correct position on the map for editing, but the icon is not visible.

Same problem with my maps. You posted that this issue is solved at http://forums.mozillazine.org/viewforum.php?f=25 but it is NOT SOLVED!!!!! I'm not a web developer, so I don't want a solution where I have write code or be a developer to figure it out. It works in every other browser & in FF7, so why can't you just figure it out & fix it, instead of making us have to write code or use our own developers to figure it out??

Google map data not displaying correctly in a spry collapsible panel

I created a spry collapsible panel into which I've put google map data. The map placed in the collapsible panel looks and functions OK but shows my location in the wrong place. I tested it by putting exactly the same google map elsewhere on my page and this time it displays my location correctly. Here is a link to my test page: http://www.cornucopia-design.co.uk/BatimTest/map3test.html . Mouse over the 'view our location' link to see the incorrectly located map. It places my location in the top left corner rather than in the centre. When you click on google's 'view larger map' links, they both then display the location identically. Anyone have any ideas about what's going on here? Is the coding for the collapsible panel doing something to the google code? I'm not a great code expert so any help would be greatly appreciated. Thanks

Hello, thank you for your helpful comments. At least I now won't waste any more time trying to get this to work if it just won't... I'll just have to display the map in another way.
Just a point about your suggestion of offsetting - I had thought of that but if I did that, when someone clicked on the map, they would be taken to the wrong place as, as I said, even though it displays incorrectly in my panel, the data IS correct and therefore correctly linked back to google maps.
Thanks anyway.

Iweb 08 and Google Maps

Hi Guys
I recently purchased ilife 08, mainly to get the functionality of being able to embed a Google Map into my website. This works fine on my Macbook, but when I try and upload it to my website (not a .Mac address), whilst the page displays with a big "hole" where the Google map should be, the Google map itself does not populate the page. Any ideas if this is a known "bug"?
Also, my Welcome page worked fine with iweb 06, but in iweb 08, the links to the other pages of my site at the top of the page are not visible at all. I'm currently stuck with my iweb 06 built site and unable to take advatage of the updated 08.....
Any help would be much appreciated. Many thanks!

When you publish, iWeb '08 generates three items that were not present in iWeb '06.
They are...
feed.xml
Media
Scripts
Make sure you have uploaded them to your server.
Are you talking about the navigation menu not showing in iWeb or on the published site?
If it's not present in iWeb make sure that the "display navigation menu" box is checked in the "page" inspector.
If it's not on the published site make sure you have uploaded the file I mentioned above.

How can I get Google maps back on my IOS 6 IPad

How can I get the Google Maps app back on my IOS 6 IPAD 2. This new IOS 6 Apple Maps app is absolutly awful.
Any suggestion.
Apple wake up and smell the coffee and put Google Maps back in the Apps Store.

It's still not known if and when Google Maps becomes available in the AppStore. This is today's story: http://www.macrumors.com/2012/09/25/google-has-not-yet-submitted-a-google-maps-a pp-to-apple/

N97 Ovi maps clashing with Google maps or sports t...

I have a UK Vodafone N97, Had Ovi maps working a treat and really pleased with it. However, I just installed google maps and then Nokia Sports tracker. Sports tracker wouldn't "track " at all and this then stopped Ovi maps from finding a signal.
However, Google maps finds 3-5 satellites and plots very quickly so I know the GPS receiver is working fine.
I uninstalled Sports tracker and Google maps, deleted all Ovi map data and did a soft reset, then re-installed Ovi maps for the UK ( I can not delete Ovi maps app from the phone, software V21)
I still cannot get a lock with Ovi maps but having put Google maps back on, that works fine!!
Any thoughts other than a hard reset as I have so much installed on the phone.
Thanks,
Martin

Google maps uses a different server, and installing it may have changed the server settings in the phone location settings. Go to Menu>Apps>Location>Positioning>Positioning Server> make sure that the server is still supl.nokia.com
If you find my post helpful please click the green star on the left under the avatar. Thanks.

Issue with embedded google map

When copying and pasting html from google maps to my website, the map shows correctly in preview mode. After publishing however, the target property is no longer at the center of the map but off the map at the extreme upper left hand corner. Any suggestions?

site is: www.netlease.net, maps are embedded on 'Available' page

While printing google map from FF4 its not displaying the map in the print out paper?

FF4 displaying the google map in my website. But while printing google map from FF4 its not displaying the map in the print out paper.
I chekced this FF 3.6 and there is no problem with this and other versions. FF4 having this problem.
What should I do for this? Please let me know.

What printer models is this intended for? I assume it is aimed at the lower end inkjets, with the suggestion of loading 10-25 sheets of paper.
Bob Headrick, HP Expert
I am not an employee of HP, I am a volunteer posting here on my own time.
If your problem is solved please click the "Accept as Solution" button ------------V
If my answer was helpful please click the "Thumbs Up" to say "Thank You"--V

I can't access to Youtube and Google Maps with Safari

Hello,
I've a MacBook Pro and I can't go to Youtube and Google Maps with Safari. I've also tried with Firefox but the problem is still not solved.
Actually, Safari (or Firefox) keeps charging the page but is unable to get it. I always see a blank page. It only happens with these two websites. Other sites are working perfectly.
I've tried so many things like installing the flash, erasing cookies or cache, installing updates but nothing helped. This is really annoying. Just to give you an example, if I try to localize my MacBook I just can't see where it is as the map is not appearing.
Can you help me?
Thank you!
Mac OS X 10.7.4
Safari 5.1.7

Hi CMCSK!
Thanks for your answer.
I bought my Mac in August 2011. In the first weeks, I couldn't see YouTube videos which was normal as the flash wasn't installed. I therefore installed the latest version of Abode's flash and it worked well. But maybe 1 month or more later, I don't know what happened: it began difficult or even impossible to load YouTube website. I first thought this was a problem with Safari. I downloaded Firefox but the problem remained the same: impossible to go to YouTube. I followed the instructions to uninstall the flash and to install it again. Nothing helped. I waited for an update for Safari but it didn't solve my problem.
As I've already said, the browser (Safari or Firefox) keeps loading the page and after 1 or 2 minutes I see "Safari can't open the page because the server where this page is located isn't responding".
To come back to this:
if I try to localize my MacBook I just can't see where it is as the map is not appearing.
Well I wanted to give you an example of the problem itself (with Google Maps here). If I go to iCloud and try to localize my Mac, I can see the green circle but the map is not loaded. I don't know why it isn't working. Whenever there is a Google Map on a website (e.g. a restaurant giving its localization with a small Google Map) I can't see it. I only see a light grey background with question marks everywhere. I also see this grey background when I go to the website of Google.
I hope you see more what the problem is.
Thank you

Google Map & Links Not Working...

Hi Guys
I recently purchased ilife 08, mainly to get the functionality of being able to embed a Google Map into my website. This works fine on my Macbook, but when I try and upload it to my website (not a .Mac address), whilst the page displays with a big "hole" where the Google map should be, the Google map itself does not populate the page. Any ideas if this is a known "bug"?
Also, my Welcome page worked fine with iweb 06, but in iweb 08, the links to the other pages of my site at the top of the page are not visible at all. I'm currently stuck with my iweb 06 built site and unable to take advatage of the updated 08.....
I posted before about these problems, and the advice was to make sure that the feeds, Media and script files were uploaded to the site. However, these are all there....I'm really not sure at all what I'm doing wrong!
Any help would be much appreciated. Many thanks!

Since posting the above, I was looking again at the files on the uploaded site and I noticed that whilst I had a folder called Scripts on the site, when I went into that folder, and then in to the Widgets folder inside of that, there was only the 'Detail View' folder inside of it - no Google Maps folder or Navbar folder!!! Not sure why this has happened.
I've now tried uploading these folders, but they're not appearing as folders, they just look like files for some strange reason.
It sounds like this is the reason for my problems, but how do I get these folder to upload correctly?
I feel like I am soooooo close to getting this to work now!!

Google Maps like "Ontario Magazine"

I'd like to use the Google Maps feature like "Ontario Magazine" does. You can even use Street View in their magazine.
Any suggestions?

Ontario Magazine is using the new Google Maps JavaScript API v3, wich is now the official way of using google maps on your website or mobile device.
See the documentation here:
http://code.google.com/intl/en/apis/maps/documentation/javascript/
With that you add many parameters (like map zoom and all the additional blobs) to the javascript call. This involves basic knowledge about Javascript.
Like Bob said, you need to make a HTML page with all the neccessary keys and data (see google's documentation) and that should give you the effect like in the ontario magazine, even enabling google streetview.
—Johannes

Putting Google maps on my Website

Similar Messages

Maybe you are looking for