How to setup simple Google Maps on your website

Here’s a quick howto on setting up Google Maps on your website.

Ideal for “Contact Us” pages.

Go to
to get an API key for your website. An API key is a really long string
of random characters. You will get something that looks like this:

<script src=";v=2&amp;key=YOUR_API_KEY_HERE"

Put this <script> tag on the page you want the map to appear on.

<script type="text/javascript">
function loadmap() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
var geocoder = new GClientGeocoder();
map.setCenter(new GLatLng(37.4419, -122.1419), 13);
map.addControl(new GSmallMapControl());
var address = "1 James Street, Burleigh, QLD, Australia";
function(point) {
if (!point) {
alert(address + " not found");
} else {
map.setCenter(point, 13);
var marker = new GMarker(point);
"<strong>Address</strong><br>Type It Here:"+
" <br>Southport, QLD 4215<br>Australia.");
// this part uses jquery:
// if you dont have jquery, do something like:
window.onload = loadmap;

<div id="map" style="width: 300px; height: 400px">

Leave a Reply

Your email address will not be published.