{"id":4098,"date":"2020-05-23T00:09:38","date_gmt":"2020-05-23T00:09:38","guid":{"rendered":"https:\/\/the7kennisbank.nl\/?p=4098"},"modified":"2020-05-29T13:20:12","modified_gmt":"2020-05-29T13:20:12","slug":"how-to-add-google-map","status":"publish","type":"post","link":"https:\/\/the7kennisbank.nl\/en\/dream-theme-support-portal\/how-to-add-google-map\/","title":{"rendered":"How to add Google map?"},"content":{"rendered":"<p><head><meta http-equiv=\"Content-Type\" content=\"text\/html; charset=utf-8\"><\/head><\/p>\n<p>How to add Google map?<\/p>\n<div id=\"wrapper\">\n<div class=\"inner-content\">\n<p>There are two methods in the7 which allows to add google maps.<\/p>\n<p>1) <strong>Default WPBackery page builder method<\/strong><\/p>\n<p>Google Map shortcode simplifies the process of Google map HTML code embedding. You are able to get required code\u00a0<a href=\"http:\/\/maps.google.com\/maps\">here<\/a>. Choose the appropriate location, click on the \u201cLink\u201d icon and copy content of the second highlighted field:<\/p>\n<div class=\"c1\">\n<dl id=\"attachment_31758\">\n<dt><a href=\"http:\/\/support.dream-theme.com\/wp-content\/uploads\/2013\/02\/main1_001.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/the7kennisbank.nl\/wp-content\/uploads\/2015\/10\/main1_001.png\" alt=\"Fig. 1. Embed Link.\" width=\"371\" height=\"412\"><\/a><\/dt>\n<dd>Fig. 1. Embed Link.<\/dd>\n<\/dl>\n<\/div>\n<div class=\"c1\">\n<dl id=\"attachment_31760\">\n<dt><a href=\"http:\/\/support.dream-theme.com\/wp-content\/uploads\/2013\/02\/main2.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/the7kennisbank.nl\/wp-content\/uploads\/2015\/10\/main2.png\" alt=\"Fig. 2. Get Embed Link.\" width=\"331\" height=\"364\"><\/a><\/dt>\n<dd>Fig. 2. Get Embed Link.<\/dd>\n<\/dl>\n<\/div>\n<div class=\"c1\">\n<dl id=\"attachment_31761\">\n<dt><a href=\"http:\/\/support.dream-theme.com\/wp-content\/uploads\/2013\/02\/main3.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/the7kennisbank.nl\/wp-content\/uploads\/2015\/10\/main3.png\" alt=\"Fig. 3. Get Embed Link code.\" width=\"572\" height=\"139\"><\/a><\/dt>\n<dd>Fig. 3. Get Embed Link code.<\/dd>\n<\/dl>\n<\/div>\n<p>In order to insert the shortcode, open the required page (or a post) in the editing mode and click the appropriate icon:<\/p>\n<div class=\"c1\">\n<dl id=\"attachment_31762\">\n<dt><a href=\"http:\/\/support.dream-theme.com\/wp-content\/uploads\/2013\/02\/map.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/the7kennisbank.nl\/wp-content\/uploads\/2015\/10\/map-1024x534-1.png\" alt=\"Fig. 4. Use Google Map element.\" width=\"368\" height=\"192\"><\/a><\/dt>\n<dd>Fig. 4. Use Google Map element.<\/dd>\n<\/dl>\n<\/div>\n<p>Google map shortcode dialogue window will appear. Insert the code into the appropriate field:<\/p>\n<div class=\"c1\">\n<dl id=\"attachment_31763\">\n<dt><a href=\"http:\/\/support.dream-theme.com\/wp-content\/uploads\/2013\/02\/final.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/the7kennisbank.nl\/wp-content\/uploads\/2015\/10\/final.png\" alt=\"Fig. 5. Add embed code.\" width=\"407\" height=\"407\"><\/a><\/dt>\n<dd>Fig. 5. Add embed code.<\/dd>\n<\/dl>\n<\/div>\n<p>2) <strong>Using Ultimate Addons element for Google Maps<\/strong><\/p>\n<div id=\"attachment_44263\" class=\"wp-caption aligncenter c2\"><a href=\"http:\/\/support.dream-theme.com\/wp-content\/uploads\/2015\/01\/mapUltimate.png\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-44263\" src=\"https:\/\/the7kennisbank.nl\/wp-content\/uploads\/2016\/08\/mapUltimate.png\" alt=\"Fig. 6. Ultimate addon Map element.\" width=\"380\" height=\"297\"><\/a><\/p>\n<p class=\"wp-caption-text\">Fig. 6. Ultimate addon Map element.<\/p>\n<\/div>\n<p>Add the appropriate Longitude and Latitude to the text boxes:<\/p>\n<div id=\"attachment_44264\" class=\"wp-caption aligncenter c3\"><a href=\"http:\/\/support.dream-theme.com\/wp-content\/uploads\/2015\/01\/2016-08-23_1553.png\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-44264\" src=\"https:\/\/the7kennisbank.nl\/wp-content\/uploads\/2016\/08\/2016-08-23_1553.png\" alt=\"Fig. 7. Add Long\/Lat information.\" width=\"548\" height=\"423\"><\/a><\/p>\n<p class=\"wp-caption-text\">Fig. 7. Add Long\/Lat information.<\/p>\n<\/div>\n<p>NOTE: If you\u2019re using the 2nd method, it is required to add Google API Key, see <a href=\"https:\/\/docs.brainstormforce.com\/how-to-create-google-api-key-in-uabb-google-map-element\/\">here<\/a> for more details.<\/p>\n<div id=\"attachment_44266\" class=\"wp-caption aligncenter c4\"><a href=\"http:\/\/support.dream-theme.com\/wp-content\/uploads\/2015\/01\/Input_Api_Key.png\"><img loading=\"lazy\" decoding=\"async\" class=\"size-large wp-image-44266\" src=\"https:\/\/the7kennisbank.nl\/wp-content\/uploads\/2016\/08\/Input_Api_Key-1024x464-1.png\" alt=\"Fig. 8. Enter API Key.\" width=\"1024\" height=\"464\"><\/a><\/p>\n<p class=\"wp-caption-text\">Fig. 8. Enter API Key.<\/p>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>How to add Google map? There are two methods in the7 which allows to add google maps. 1) Default WPBackery page builder method Google Map shortcode simplifies the process of Google map HTML code embedding. You are able to get required code\u00a0here. Choose the appropriate location, click on the \u201cLink\u201d icon and copy content of&hellip;<\/p>\n","protected":false},"author":2,"featured_media":4481,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[30,31],"tags":[],"class_list":["post-4098","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-dream-theme-support-portal","category-knowledgebase","category-30","category-31","description-off"],"acf":[],"_links":{"self":[{"href":"https:\/\/the7kennisbank.nl\/en\/wp-json\/wp\/v2\/posts\/4098","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/the7kennisbank.nl\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/the7kennisbank.nl\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/the7kennisbank.nl\/en\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/the7kennisbank.nl\/en\/wp-json\/wp\/v2\/comments?post=4098"}],"version-history":[{"count":2,"href":"https:\/\/the7kennisbank.nl\/en\/wp-json\/wp\/v2\/posts\/4098\/revisions"}],"predecessor-version":[{"id":4600,"href":"https:\/\/the7kennisbank.nl\/en\/wp-json\/wp\/v2\/posts\/4098\/revisions\/4600"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/the7kennisbank.nl\/en\/wp-json\/wp\/v2\/media\/4481"}],"wp:attachment":[{"href":"https:\/\/the7kennisbank.nl\/en\/wp-json\/wp\/v2\/media?parent=4098"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/the7kennisbank.nl\/en\/wp-json\/wp\/v2\/categories?post=4098"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/the7kennisbank.nl\/en\/wp-json\/wp\/v2\/tags?post=4098"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}