{"id":16887,"date":"2013-08-11T18:47:13","date_gmt":"2013-08-11T18:47:13","guid":{"rendered":"http:\/\/localhost:8888\/test\/?page_id=514"},"modified":"2022-01-03T14:52:27","modified_gmt":"2022-01-03T12:52:27","slug":"map","status":"publish","type":"page","link":"https:\/\/naudenaturals.com\/en\/elements\/map\/","title":{"rendered":"Map"},"content":{"rendered":"\r\n\t<!-- \r\n\tAstounding forms added to top of page\r\n\t<br>\r\n\t<br>\r\n\t<form action=\"https:\/\/naudenaturals.com\/wp-comments-post.php\" method=\"post\" id=\"commentform1\">\r\n\t<p><input name=\"author\" id=\"author\" value=\"\" size=\"22\"  aria-required=\"true\" type=\"text\">\r\n\t<label for=\"author\"><small>Name (required)<\/small><\/label><\/p>\r\n\r\n\t<p><input name=\"email\" id=\"email\" value=\"\" size=\"22\"  aria-required=\"true\" type=\"text\">\r\n\t<label for=\"email\"><small>Mail (will not be published) (required)<\/small><\/label><\/p>\r\n\r\n\t<p><input name=\"url\" id=\"url\" value=\"\" size=\"22\" type=\"text\">\r\n\t<label for=\"url\"><small>Website<\/small><\/label><\/p>\r\n\t<p><textarea name=\"comment\" id=\"comment\" cols=\"58\" rows=\"10\" ><\/textarea><\/p>\r\n\r\n\t<p>\r\n\t<input name=\"comment_post_ID\" value=\"16887\" id=\"comment_post_ID\" type=\"hidden\">\r\n\t<input name=\"comment_parent\" id=\"comment_parent\" value=\"0\" type=\"hidden\">\r\n\t<\/p>\r\n\r\n\t<p><input id=\"astound_comment_nonce\" name=\"astound_comment_nonce\" value=\"6984b31b5e\" type=\"hidden\"><\/p>\r\n\t<\/form>\r\n\r\n<form name=\"registerform\" id=\"registerform\" action=\"https:\/\/naudenaturals.com\/wp-login.php?action=register\" method=\"post\" novalidate=\"novalidate\">\r\n\t<p>\r\n\t\t<label for=\"user_login\">Username<br>\r\n\t\t<input name=\"user_login\" id=\"user_login\" class=\"input\" value=\"\" size=\"20\" type=\"text\"><\/label>\r\n\t<\/p>\r\n\t<p>\r\n\t\t<label for=\"user_email\">Email<br>\r\n\t\t<input name=\"user_email\" id=\"user_email\" class=\"input\" value=\"\" size=\"25\" type=\"email\"><\/label>\r\n\t<\/p>\r\n\t\t<p id=\"reg_passmail\">Registration confirmation will be emailed to you.<\/p>\r\n\t<br class=\"clear\">\r\n\t<input name=\"redirect_to\" value=\"\" type=\"hidden\">\r\n\t<p class=\"submit\"><input name=\"wp-submit\" id=\"wp-submit\" class=\"button button-primary \t<p><input id=\"astound_comment_nonce\" name=\"astound_comment_nonce\" value=\"6984b31b5e\" button-large\" value=\"Register\" type=\"submit\"><\/p>\r\n<\/form>\r\n\r\n\t-->\r\n\t\n\t<script type=\"text\/javascript\">\n  jQuery( document ).ready(function() {\n    function initialize() {\n        var styles = {\n            'flatsome':  [{\n            \"featureType\": \"administrative\",\n            \"stylers\": [\n              { \"visibility\": \"on\" }\n            ]\n          },\n          {\n            \"featureType\": \"road\",\n            \"stylers\": [\n              { \"visibility\": \"on\" },\n              { \"hue\": \"\" }\n            ]\n          },\n          {\n            \"stylers\": [\n\t\t\t  { \"visibility\": \"on\" },\n\t\t\t  { \"hue\": \"\" },\n\t\t\t  { \"saturation\": -100 }\n            ]\n          }\n        ]};\n\n        var myLatlng = new google.maps.LatLng(40.79022, -73.95981);\n        var myOptions = {\n            zoom: 17,\n            center: myLatlng,\n            mapTypeId: google.maps.MapTypeId.ROADMAP,\n            disableDefaultUI: true,\n            mapTypeId: 'flatsome',\n            draggable: true,\n            zoomControl: false,\n            zoomControlOptions: {\n              position: google.maps.ControlPosition.TOP_LEFT\n            },\n      \t\t\tmapTypeControl: false,\n            mapTypeControlOptions: {\n              position: google.maps.ControlPosition.TOP_LEFT\n            },\n      \t\t\tstreetViewControl: false,\n            streetViewControlOptions: {\n              position: google.maps.ControlPosition.TOP_LEFT\n            },\n            scrollwheel: false,\n            disableDoubleClickZoom: true\n        }\n        var map = new google.maps.Map(document.getElementById(\"map-4159223709-inner\"), myOptions);\n        var styledMapType = new google.maps.StyledMapType(styles['flatsome'], {name: 'flatsome'});\n        map.mapTypes.set('flatsome', styledMapType);\n\n        var marker = new google.maps.Marker({\n            position: myLatlng,\n            map: map,\n            title:\"\"\n        });\n    }\n\n    \/\/ Required to proceed\n    if (!(typeof google === 'object' && typeof google.maps === 'object')) {\n      return\n    }\n\n    initialize()\n    google.maps.event.addDomListener(window, 'resize', initialize);\n    });\n    <\/script>\n\n    <div class=\"google-map relative mb\" id=\"map-4159223709\">\n        <div class=\"map-height\" id=\"map-4159223709-inner\"><\/div>\n        <div id=\"map_overlay_top\"><\/div>\n        <div id=\"map_overlay_bottom\"><\/div>\n                  <div class=\"map_inner map-inner last-reset absolute x0 md-x50 lg-x50 y50 md-y50 lg-y50\">\n              \n<h3 class=\"uppercase\"><strong>GOOGLE MAP ELEMENT<\/strong><\/h3>\n<p class=\"lead\">Add highly customisable Google Maps to any page.<\/p>\n         <\/div>\n       \n       \n<style>\n#map-4159223709 .map-inner {\n  background-color: rgb(255, 255, 255);\n  max-width: 100%;\n}\n#map-4159223709 .map-height {\n  height: 400px;\n}\n@media (min-width:550px) {\n  #map-4159223709 .map-inner {\n    max-width: 30%;\n  }\n}\n<\/style>\n    <\/div>\n\n\t\n<div class=\"container section-title-container\" style=\"margin-top:14px;\"><h3 class=\"section-title section-title-center\"><b aria-hidden=\"true\"><\/b><span class=\"section-title-main\" >Examples<\/span><b aria-hidden=\"true\"><\/b><\/h3><\/div>\n<div class=\"row\"  id=\"row-841123685\">\n\n\t<div id=\"col-906885611\" class=\"col medium-6 small-12 large-6\"  >\n\t\t\t\t<div class=\"col-inner\"  >\n\t\t\t\n\t\t\t\n\n\t<script type=\"text\/javascript\">\n  jQuery( document ).ready(function() {\n    function initialize() {\n        var styles = {\n            'flatsome':  [{\n            \"featureType\": \"administrative\",\n            \"stylers\": [\n              { \"visibility\": \"on\" }\n            ]\n          },\n          {\n            \"featureType\": \"road\",\n            \"stylers\": [\n              { \"visibility\": \"on\" },\n              { \"hue\": \"\" }\n            ]\n          },\n          {\n            \"stylers\": [\n\t\t\t  { \"visibility\": \"on\" },\n\t\t\t  { \"hue\": \"\" },\n\t\t\t  { \"saturation\": -30 }\n            ]\n          }\n        ]};\n\n        var myLatlng = new google.maps.LatLng(40.79028, -73.95972);\n        var myOptions = {\n            zoom: 17,\n            center: myLatlng,\n            mapTypeId: google.maps.MapTypeId.ROADMAP,\n            disableDefaultUI: true,\n            mapTypeId: 'flatsome',\n            draggable: true,\n            zoomControl: false,\n            zoomControlOptions: {\n              position: google.maps.ControlPosition.TOP_LEFT\n            },\n      \t\t\tmapTypeControl: false,\n            mapTypeControlOptions: {\n              position: google.maps.ControlPosition.TOP_LEFT\n            },\n      \t\t\tstreetViewControl: false,\n            streetViewControlOptions: {\n              position: google.maps.ControlPosition.TOP_LEFT\n            },\n            scrollwheel: false,\n            disableDoubleClickZoom: true\n        }\n        var map = new google.maps.Map(document.getElementById(\"map-4131273852-inner\"), myOptions);\n        var styledMapType = new google.maps.StyledMapType(styles['flatsome'], {name: 'flatsome'});\n        map.mapTypes.set('flatsome', styledMapType);\n\n        var marker = new google.maps.Marker({\n            position: myLatlng,\n            map: map,\n            title:\"\"\n        });\n    }\n\n    \/\/ Required to proceed\n    if (!(typeof google === 'object' && typeof google.maps === 'object')) {\n      return\n    }\n\n    initialize()\n    google.maps.event.addDomListener(window, 'resize', initialize);\n    });\n    <\/script>\n\n    <div class=\"google-map relative mb\" id=\"map-4131273852\">\n        <div class=\"map-height\" id=\"map-4131273852-inner\"><\/div>\n        <div id=\"map_overlay_top\"><\/div>\n        <div id=\"map_overlay_bottom\"><\/div>\n                  <div class=\"map_inner map-inner last-reset absolute x95 md-x95 lg-x95 y95 md-y95 lg-y95\">\n              \n<p>Enter street adress here. Or any other information you want.<\/p>\n         <\/div>\n       \n       \n<style>\n#map-4131273852 .map-inner {\n  background-color: #fff;\n  max-width: 30%;\n}\n#map-4131273852 .map-height {\n  height: 400px;\n}\n<\/style>\n    <\/div>\n\n\t\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\n\n\t<div id=\"col-1120010591\" class=\"col medium-6 small-12 large-6\"  >\n\t\t\t\t<div class=\"col-inner\"  >\n\t\t\t\n\t\t\t\n\n\t<script type=\"text\/javascript\">\n  jQuery( document ).ready(function() {\n    function initialize() {\n        var styles = {\n            'flatsome':  [{\n            \"featureType\": \"administrative\",\n            \"stylers\": [\n              { \"visibility\": \"on\" }\n            ]\n          },\n          {\n            \"featureType\": \"road\",\n            \"stylers\": [\n              { \"visibility\": \"on\" },\n              { \"hue\": \"\" }\n            ]\n          },\n          {\n            \"stylers\": [\n\t\t\t  { \"visibility\": \"on\" },\n\t\t\t  { \"hue\": \"\" },\n\t\t\t  { \"saturation\": -30 }\n            ]\n          }\n        ]};\n\n        var myLatlng = new google.maps.LatLng(40.79028, -73.95972);\n        var myOptions = {\n            zoom: 17,\n            center: myLatlng,\n            mapTypeId: google.maps.MapTypeId.ROADMAP,\n            disableDefaultUI: true,\n            mapTypeId: 'flatsome',\n            draggable: true,\n            zoomControl: true,\n            zoomControlOptions: {\n              position: google.maps.ControlPosition.TOP_LEFT\n            },\n      \t\t\tmapTypeControl: true,\n            mapTypeControlOptions: {\n              position: google.maps.ControlPosition.TOP_LEFT\n            },\n      \t\t\tstreetViewControl: true,\n            streetViewControlOptions: {\n              position: google.maps.ControlPosition.TOP_LEFT\n            },\n            scrollwheel: false,\n            disableDoubleClickZoom: true\n        }\n        var map = new google.maps.Map(document.getElementById(\"map-3788812469-inner\"), myOptions);\n        var styledMapType = new google.maps.StyledMapType(styles['flatsome'], {name: 'flatsome'});\n        map.mapTypes.set('flatsome', styledMapType);\n\n        var marker = new google.maps.Marker({\n            position: myLatlng,\n            map: map,\n            title:\"\"\n        });\n    }\n\n    \/\/ Required to proceed\n    if (!(typeof google === 'object' && typeof google.maps === 'object')) {\n      return\n    }\n\n    initialize()\n    google.maps.event.addDomListener(window, 'resize', initialize);\n    });\n    <\/script>\n\n    <div class=\"google-map relative mb\" id=\"map-3788812469\">\n        <div class=\"map-height\" id=\"map-3788812469-inner\"><\/div>\n        <div id=\"map_overlay_top\"><\/div>\n        <div id=\"map_overlay_bottom\"><\/div>\n                  <div class=\"map_inner map-inner last-reset absolute x95 md-x95 lg-x95 y95 md-y95 lg-y95\">\n              \n<p><strong>Map With Tools<\/strong><\/p>\n         <\/div>\n       \n       \n<style>\n#map-3788812469 .map-inner {\n  background-color: #fff;\n  max-width: 30%;\n}\n#map-3788812469 .map-height {\n  height: 400px;\n}\n<\/style>\n    <\/div>\n\n\t\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\n\n\t<div id=\"col-1705060416\" class=\"col medium-6 small-12 large-6\"  >\n\t\t\t\t<div class=\"col-inner\"  >\n\t\t\t\n\t\t\t\n\n\t<script type=\"text\/javascript\">\n  jQuery( document ).ready(function() {\n    function initialize() {\n        var styles = {\n            'flatsome':  [{\n            \"featureType\": \"administrative\",\n            \"stylers\": [\n              { \"visibility\": \"on\" }\n            ]\n          },\n          {\n            \"featureType\": \"road\",\n            \"stylers\": [\n              { \"visibility\": \"on\" },\n              { \"hue\": \"#6d5854\" }\n            ]\n          },\n          {\n            \"stylers\": [\n\t\t\t  { \"visibility\": \"on\" },\n\t\t\t  { \"hue\": \"#6d5854\" },\n\t\t\t  { \"saturation\": -30 }\n            ]\n          }\n        ]};\n\n        var myLatlng = new google.maps.LatLng(40.79028, -73.95972);\n        var myOptions = {\n            zoom: 17,\n            center: myLatlng,\n            mapTypeId: google.maps.MapTypeId.ROADMAP,\n            disableDefaultUI: true,\n            mapTypeId: 'flatsome',\n            draggable: true,\n            zoomControl: false,\n            zoomControlOptions: {\n              position: google.maps.ControlPosition.TOP_LEFT\n            },\n      \t\t\tmapTypeControl: false,\n            mapTypeControlOptions: {\n              position: google.maps.ControlPosition.TOP_LEFT\n            },\n      \t\t\tstreetViewControl: false,\n            streetViewControlOptions: {\n              position: google.maps.ControlPosition.TOP_LEFT\n            },\n            scrollwheel: false,\n            disableDoubleClickZoom: true\n        }\n        var map = new google.maps.Map(document.getElementById(\"map-642627508-inner\"), myOptions);\n        var styledMapType = new google.maps.StyledMapType(styles['flatsome'], {name: 'flatsome'});\n        map.mapTypes.set('flatsome', styledMapType);\n\n        var marker = new google.maps.Marker({\n            position: myLatlng,\n            map: map,\n            title:\"\"\n        });\n    }\n\n    \/\/ Required to proceed\n    if (!(typeof google === 'object' && typeof google.maps === 'object')) {\n      return\n    }\n\n    initialize()\n    google.maps.event.addDomListener(window, 'resize', initialize);\n    });\n    <\/script>\n\n    <div class=\"google-map relative mb\" id=\"map-642627508\">\n        <div class=\"map-height\" id=\"map-642627508-inner\"><\/div>\n        <div id=\"map_overlay_top\"><\/div>\n        <div id=\"map_overlay_bottom\"><\/div>\n                  <div class=\"map_inner map-inner last-reset absolute x95 md-x95 lg-x95 y95 md-y95 lg-y95\">\n              \n<p>Use any color \u00a0for your map<\/p>\n         <\/div>\n       \n       \n<style>\n#map-642627508 .map-inner {\n  background-color: #fff;\n  max-width: 89%;\n}\n#map-642627508 .map-height {\n  height: 400px;\n}\n@media (min-width:550px) {\n  #map-642627508 .map-inner {\n    max-width: 30%;\n  }\n}\n<\/style>\n    <\/div>\n\n\t\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\n\n\t<div id=\"col-1245812136\" class=\"col medium-6 small-12 large-6\"  >\n\t\t\t\t<div class=\"col-inner\"  >\n\t\t\t\n\t\t\t\n\n\t<script type=\"text\/javascript\">\n  jQuery( document ).ready(function() {\n    function initialize() {\n        var styles = {\n            'flatsome':  [{\n            \"featureType\": \"administrative\",\n            \"stylers\": [\n              { \"visibility\": \"on\" }\n            ]\n          },\n          {\n            \"featureType\": \"road\",\n            \"stylers\": [\n              { \"visibility\": \"on\" },\n              { \"hue\": \"\" }\n            ]\n          },\n          {\n            \"stylers\": [\n\t\t\t  { \"visibility\": \"on\" },\n\t\t\t  { \"hue\": \"\" },\n\t\t\t  { \"saturation\": -100 }\n            ]\n          }\n        ]};\n\n        var myLatlng = new google.maps.LatLng(40.79028, -73.95972);\n        var myOptions = {\n            zoom: 17,\n            center: myLatlng,\n            mapTypeId: google.maps.MapTypeId.ROADMAP,\n            disableDefaultUI: true,\n            mapTypeId: 'flatsome',\n            draggable: true,\n            zoomControl: false,\n            zoomControlOptions: {\n              position: google.maps.ControlPosition.TOP_LEFT\n            },\n      \t\t\tmapTypeControl: false,\n            mapTypeControlOptions: {\n              position: google.maps.ControlPosition.TOP_LEFT\n            },\n      \t\t\tstreetViewControl: false,\n            streetViewControlOptions: {\n              position: google.maps.ControlPosition.TOP_LEFT\n            },\n            scrollwheel: false,\n            disableDoubleClickZoom: true\n        }\n        var map = new google.maps.Map(document.getElementById(\"map-1585345050-inner\"), myOptions);\n        var styledMapType = new google.maps.StyledMapType(styles['flatsome'], {name: 'flatsome'});\n        map.mapTypes.set('flatsome', styledMapType);\n\n        var marker = new google.maps.Marker({\n            position: myLatlng,\n            map: map,\n            title:\"\"\n        });\n    }\n\n    \/\/ Required to proceed\n    if (!(typeof google === 'object' && typeof google.maps === 'object')) {\n      return\n    }\n\n    initialize()\n    google.maps.event.addDomListener(window, 'resize', initialize);\n    });\n    <\/script>\n\n    <div class=\"google-map relative mb\" id=\"map-1585345050\">\n        <div class=\"map-height\" id=\"map-1585345050-inner\"><\/div>\n        <div id=\"map_overlay_top\"><\/div>\n        <div id=\"map_overlay_bottom\"><\/div>\n                  <div class=\"map_inner map-inner last-reset absolute x5 md-x5 lg-x5 y5 md-y5 lg-y5\">\n              \n<p>Enter street adress here. Or any other information you want.<\/p>\n         <\/div>\n       \n       \n<style>\n#map-1585345050 .map-inner {\n  background-color: #fff;\n  max-width: 86%;\n}\n#map-1585345050 .map-height {\n  height: 400px;\n}\n@media (min-width:550px) {\n  #map-1585345050 .map-inner {\n    max-width: 30%;\n  }\n}\n<\/style>\n    <\/div>\n\n\t\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\n<\/div>\n\n\t<script type=\"text\/javascript\">\n  jQuery( document ).ready(function() {\n    function initialize() {\n        var styles = {\n            'flatsome':  [{\n            \"featureType\": \"administrative\",\n            \"stylers\": [\n              { \"visibility\": \"on\" }\n            ]\n          },\n          {\n            \"featureType\": \"road\",\n            \"stylers\": [\n              { \"visibility\": \"on\" },\n              { \"hue\": \"\" }\n            ]\n          },\n          {\n            \"stylers\": [\n\t\t\t  { \"visibility\": \"on\" },\n\t\t\t  { \"hue\": \"\" },\n\t\t\t  { \"saturation\": 44 }\n            ]\n          }\n        ]};\n\n        var myLatlng = new google.maps.LatLng(40.79022, -73.95981);\n        var myOptions = {\n            zoom: 17,\n            center: myLatlng,\n            mapTypeId: google.maps.MapTypeId.ROADMAP,\n            disableDefaultUI: true,\n            mapTypeId: 'flatsome',\n            draggable: true,\n            zoomControl: false,\n            zoomControlOptions: {\n              position: google.maps.ControlPosition.TOP_LEFT\n            },\n      \t\t\tmapTypeControl: false,\n            mapTypeControlOptions: {\n              position: google.maps.ControlPosition.TOP_LEFT\n            },\n      \t\t\tstreetViewControl: false,\n            streetViewControlOptions: {\n              position: google.maps.ControlPosition.TOP_LEFT\n            },\n            scrollwheel: false,\n            disableDoubleClickZoom: true\n        }\n        var map = new google.maps.Map(document.getElementById(\"map-2201016875-inner\"), myOptions);\n        var styledMapType = new google.maps.StyledMapType(styles['flatsome'], {name: 'flatsome'});\n        map.mapTypes.set('flatsome', styledMapType);\n\n        var marker = new google.maps.Marker({\n            position: myLatlng,\n            map: map,\n            title:\"\"\n        });\n    }\n\n    \/\/ Required to proceed\n    if (!(typeof google === 'object' && typeof google.maps === 'object')) {\n      return\n    }\n\n    initialize()\n    google.maps.event.addDomListener(window, 'resize', initialize);\n    });\n    <\/script>\n\n    <div class=\"google-map relative mb\" id=\"map-2201016875\">\n        <div class=\"map-height\" id=\"map-2201016875-inner\"><\/div>\n        <div id=\"map_overlay_top\"><\/div>\n        <div id=\"map_overlay_bottom\"><\/div>\n                  <div class=\"map_inner map-inner last-reset absolute x100 md-x95 lg-x95 y100 md-y10 lg-y10\">\n              \n<div class=\"container section-title-container\" ><h3 class=\"section-title section-title-normal\"><b aria-hidden=\"true\"><\/b><span class=\"section-title-main\" ><i class=\"icon-envelop\" aria-hidden=\"true\"><\/i>A map with a Form<\/span><b aria-hidden=\"true\"><\/b><\/h3><\/div>\n<p>(insert contact form here)<\/p>\n         <\/div>\n       \n       \n<style>\n#map-2201016875 .map-inner {\n  background-color: rgba(255, 255, 255, 0.85);\n  max-width: 100%;\n}\n#map-2201016875 .map-height {\n  height: 747px;\n}\n@media (min-width:550px) {\n  #map-2201016875 .map-inner {\n    max-width: 30%;\n  }\n  #map-2201016875 .map-height {\n    height: 589px;\n  }\n}\n<\/style>\n    <\/div>\n\n\t\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":16895,"menu_order":20,"comment_status":"closed","ping_status":"closed","template":"page-blank.php","meta":{"footnotes":""},"class_list":["post-16887","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/naudenaturals.com\/en\/wp-json\/wp\/v2\/pages\/16887","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/naudenaturals.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/naudenaturals.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/naudenaturals.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/naudenaturals.com\/en\/wp-json\/wp\/v2\/comments?post=16887"}],"version-history":[{"count":0,"href":"https:\/\/naudenaturals.com\/en\/wp-json\/wp\/v2\/pages\/16887\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/naudenaturals.com\/en\/wp-json\/wp\/v2\/pages\/16895"}],"wp:attachment":[{"href":"https:\/\/naudenaturals.com\/en\/wp-json\/wp\/v2\/media?parent=16887"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}