5 files changed, 52 insertions, 27 deletions

diff --git a/README.md b/README.md
index d2a63b8..60b5ac3 100644
--- a/README.md
+++ b/README.md
@@ -100,6 +100,15 @@ id = "contact"
 +++
 ```
 
+You can optionally add the google maps widget defining latitude and longitude in the section `params` at `config.toml`:
+
+```
+[params]
+    ...
+    latitude = "-12.043333"
+    longitude = "-77.028333"
+```
+
 Since this Hugo sites are static, the contact form uses [Formspree](https://formspree.io/) as a proxy. The form makes a POST request to their servers to send the actual email. Visitors can send up to a 1000 emails each month for free.
 
 To enable the form in the contact page, just type your Formspree email in the `config.toml` file.
diff --git a/exampleSite/config.toml b/exampleSite/config.toml
index 3a4d30a..7ec2317 100644
--- a/exampleSite/config.toml
+++ b/exampleSite/config.toml
@@ -42,6 +42,8 @@ paginate = 10
         <strong>Great Britain</strong>
       </p>
       """
+    latitude = "-12.043333"
+    longitude = "-77.028333"
 
 [Permalinks]
     blog = "/blog/:year/:month/:day/:filename/"
diff --git a/layouts/partials/contact.html b/layouts/partials/contact.html
index a04d098..0bdcd67 100644
--- a/layouts/partials/contact.html
+++ b/layouts/partials/contact.html
@@ -66,3 +66,13 @@
     </div>
     <!-- /.row -->
 </div>
+
+{{ if isset .Site.Params "latitude" }}
+  {{ if isset .Site.Params "longitude" }}
+    <div class="hidden">
+      <input id="gmap-lat" value="{{ .Site.Params.latitude }}" />
+      <input id="gmap-lng" value="{{ .Site.Params.longitude }}" />
+    </div>
+    <div id="map" />
+  {{ end }}
+{{ end }}
diff --git a/layouts/partials/scripts.html b/layouts/partials/scripts.html
index a438f1b..ca6da21 100644
--- a/layouts/partials/scripts.html
+++ b/layouts/partials/scripts.html
@@ -6,6 +6,9 @@
 <script src="{{ .Site.BaseURL }}js/waypoints.min.js"></script>
 <script src="{{ .Site.BaseURL }}js/jquery.counterup.min.js"></script>
 <script src="{{ .Site.BaseURL }}js/jquery.parallax-1.1.3.js"></script>
+<script src='https://maps.googleapis.com/maps/api/js?v=3.exp'></script>
+<script src="{{ .Site.BaseURL }}js/gmaps.js"></script>
+<script src="{{ .Site.BaseURL }}js/gmaps.init.js"></script>
 <script src="{{ .Site.BaseURL }}js/front.js"></script>
 
 <!-- owl carousel -->
diff --git a/static/js/gmaps.init.js b/static/js/gmaps.init.js
index c77e0e0..869d061 100644
--- a/static/js/gmaps.init.js
+++ b/static/js/gmaps.init.js
@@ -1,41 +1,42 @@
 $(function () {
-
     map();
-
 });
 
 /* map */
 
 function map() {
+  if ($("#map") != undefined) {
+    var lat = $("#gmap-lat").val();
+    var lng = $("#gmap-lng").val();
+    var image = '/img/marker.png';
 
     var styles = [{"featureType": "landscape", "stylers": [{"saturation": -100}, {"lightness": 65}, {"visibility": "on"}]}, {"featureType": "poi", "stylers": [{"saturation": -100}, {"lightness": 51}, {"visibility": "simplified"}]}, {"featureType": "road.highway", "stylers": [{"saturation": -100}, {"visibility": "simplified"}]}, {"featureType": "road.arterial", "stylers": [{"saturation": -100}, {"lightness": 30}, {"visibility": "on"}]}, {"featureType": "road.local", "stylers": [{"saturation": -100}, {"lightness": 40}, {"visibility": "on"}]}, {"featureType": "transit", "stylers": [{"saturation": -100}, {"visibility": "simplified"}]}, {"featureType": "administrative.province", "stylers": [{"visibility": "off"}]}, {"featureType": "water", "elementType": "labels", "stylers": [{"visibility": "on"}, {"lightness": -25}, {"saturation": -100}]}, {"featureType": "water", "elementType": "geometry", "stylers": [{"hue": "#ffff00"}, {"lightness": -25}, {"saturation": -97}]}];
     map = new GMaps({
-	el: '#map',
-	lat: -12.043333,
-	lng: -77.028333,
-	zoomControl: true,
-	zoomControlOpt: {
-	    style: 'SMALL',
-	    position: 'TOP_LEFT'
-	},
-	panControl: false,
-	streetViewControl: false,
-	mapTypeControl: false,
-	overviewMapControl: false,
-	scrollwheel: false,
-	draggable: false,
-	styles: styles
+    	el: '#map',
+    	lat: lat,
+    	lng: lng,
+    	zoomControl: true,
+    	zoomControlOpt: {
+  	    style: 'SMALL',
+  	    position: 'TOP_LEFT'
+    	},
+    	panControl: false,
+    	streetViewControl: false,
+    	mapTypeControl: false,
+    	overviewMapControl: false,
+    	scrollwheel: false,
+    	draggable: false,
+    	styles: styles
     });
 
-    var image = 'img/marker.png';
-
     map.addMarker({
-	lat: -12.043333,
-	lng: -77.028333,
-	icon: image/* ,
-	 title: '',
-	 infoWindow: {
-	 content: '<p>HTML Content</p>'
-	 }*/
+    	lat: lat,
+    	lng: lng,
+    	icon: image/* ,
+    	 title: '',
+    	 infoWindow: {
+    	 content: '<p>HTML Content</p>'
+    	 }*/
     });
-}
\ No newline at end of file
+  }
+}