--- title: "How to Embed a Google Map on Your Website Without an API Key" description: "How to embed a Google map on your website for free, without an API key: code from Google Maps, responsive width, directions — and when you need a key." url: "https://it-deweloper.pl/en/blog/embed-google-map-on-website" date: "2026-10-17T23:40:13+00:00" language: "en-GB" --- [Skip to main content](#tm-main) - [ Home](https://it-deweloper.pl/en "IT Deweloper web studio home page") - [Contact](https://it-deweloper.pl/en/contact "Contact the IT Deweloper web studio") - [ +48 731 190 041](tel:+48731190041 "Phone") - [ office@it-deweloper.pl](mailto:office@it-deweloper.pl "E-mail") - [ Nowogródzka 4A, Białystok, Poland](https://maps.app.goo.gl/BNjvryytwRyv4omA7 "Address") - [ WhatsApp](https://wa.me/48731190041 "WhatsApp") - [ Telegram](https://t.me/+48731190041 "Telegram") - [Solutions](https://it-deweloper.pl/en/web "IT Deweloper's web development solutions") - [How we workStages of work](https://it-deweloper.pl/en/web/process "Website development stages and timelines") - [SEOSearch engine optimization](https://it-deweloper.pl/en/web/seo "SEO promotion: optimization, links, positions in Google") - [GEOWebsite promotion in AI](https://it-deweloper.pl/en/web/geo "GEO optimization: website promotion in ChatGPT, Gemini and Perplexity answers") - [AIArtificial Intelligence on the website](https://it-deweloper.pl/en/web/ai) - [JoomlaWebsite Management System](https://it-deweloper.pl/en/web/joomla "Joomla website development") - [GoogleGoogle services setup](https://it-deweloper.pl/en/web/google "Google services setup for your website") - [Cost](https://it-deweloper.pl/en/cost "Rates and cost of services") - [PricingIndicative website development prices](https://it-deweloper.pl/en/cost/pricing "Website development prices") - [CalculatorSelf-service online estimate](https://it-deweloper.pl/en/cost/calculator "Calculate your website cost online") - [BriefGet an accurate project quote](https://it-deweloper.pl/en/cost/brief "Fill out the website development brief") - [Portfolio](https://it-deweloper.pl/en/portfolio "Portfolio and examples of our work") - [About us](https://it-deweloper.pl/en/about "About the founder — Victor Parhimchik") - [FAQ](https://it-deweloper.pl/en/faq "Frequently asked questions about website development") - [Blog](https://it-deweloper.pl/en/blog "Articles on website development and promotion") - [ Русский ](https://it-deweloper.pl/ru/blog/embed-google-map-on-website) - [ Polski ](https://it-deweloper.pl/pl/blog/embed-google-map-on-website) - [ Беларуская ](https://it-deweloper.pl/be/blog/embed-google-map-on-website) - [ English ](https://it-deweloper.pl/en/blog/embed-google-map-on-website) - ![](https://it-deweloper.pl/templates/yootheme/assets/images/language.svg) English - [ Русский ](https://it-deweloper.pl/ru/blog/embed-google-map-on-website) - [ Polski ](https://it-deweloper.pl/pl/blog/embed-google-map-on-website) - [ Беларуская ](https://it-deweloper.pl/be/blog/embed-google-map-on-website) - [ English ](https://it-deweloper.pl/en/blog/embed-google-map-on-website) [ ![IT-Deweloper](https://it-deweloper.pl/images/Faviocon.svg)![IT-Deweloper](https://it-deweloper.pl/images/Logo-light.svg)](https://it-deweloper.pl/en) [ Menu ](#tm-dialog) - [ Home](https://it-deweloper.pl/en "IT Deweloper web studio home page") - [Contact](https://it-deweloper.pl/en/contact "Contact the IT Deweloper web studio") - [ +48 731 190 041](tel:+48731190041 "Phone") - [ office@it-deweloper.pl](mailto:office@it-deweloper.pl "E-mail") - [ Nowogródzka 4A, Białystok, Poland](https://maps.app.goo.gl/BNjvryytwRyv4omA7 "Address") - [ WhatsApp](https://wa.me/48731190041 "WhatsApp") - [ Telegram](https://t.me/+48731190041 "Telegram") - [Solutions](https://it-deweloper.pl/en/web "IT Deweloper's web development solutions") - [How we workStages of work](https://it-deweloper.pl/en/web/process "Website development stages and timelines") - [SEOSearch engine optimization](https://it-deweloper.pl/en/web/seo "SEO promotion: optimization, links, positions in Google") - [GEOWebsite promotion in AI](https://it-deweloper.pl/en/web/geo "GEO optimization: website promotion in ChatGPT, Gemini and Perplexity answers") - [AIArtificial Intelligence on the website](https://it-deweloper.pl/en/web/ai) - [JoomlaWebsite Management System](https://it-deweloper.pl/en/web/joomla "Joomla website development") - [GoogleGoogle services setup](https://it-deweloper.pl/en/web/google "Google services setup for your website") - [Cost](https://it-deweloper.pl/en/cost "Rates and cost of services") - [PricingIndicative website development prices](https://it-deweloper.pl/en/cost/pricing "Website development prices") - [CalculatorSelf-service online estimate](https://it-deweloper.pl/en/cost/calculator "Calculate your website cost online") - [BriefGet an accurate project quote](https://it-deweloper.pl/en/cost/brief "Fill out the website development brief") - [Portfolio](https://it-deweloper.pl/en/portfolio "Portfolio and examples of our work") - [About us](https://it-deweloper.pl/en/about "About the founder — Victor Parhimchik") - [FAQ](https://it-deweloper.pl/en/faq "Frequently asked questions about website development") - [Blog](https://it-deweloper.pl/en/blog "Articles on website development and promotion") [ IT Deweloper Blog ](https://it-deweloper.pl/index.php?option=com_content&view=category&id=29&lang=en-GB "IT Deweloper Blog") # How to Embed a Google Map on Your Website Without an API Key A map on your Contact page helps customers see where you are and get directions straight away. You don’t need an API key or a payment card in Google Cloud for that: a simple map can be embedded with code straight from Google Maps in a couple of minutes. Here’s how to get the map code, how to make it work well on phones, how to embed directions — and when you can’t do without a Google Maps Platform key after all. --- ![A map pin in a browser window, a step checklist and a question mark — a guide to embedding a Google map on a website](https://it-deweloper.pl/images/blog/embed-google-map-on-website-cover-2x.webp) ## Step 1. Find the place on Google Maps Open [Google Maps](https://www.google.com/maps) on a computer and search for your business by name. If your business has a Google Business Profile, embed that: the map will then show the name, rating and a directions button rather than just a pin at an address. If the profile isn’t verified yet, the [article on verifying your Business Profile](https://it-deweloper.pl/en/blog/verify-google-business-profile) will help. ## Step 2. Copy the code 1. In the place card, click Share. If you just need a section of the map without the card, open the menu at the top left and choose Share or embed map. 2. Switch to the Embed a map tab. 3. If you like, pick a size and move the map so the place is centred. 4. Click Copy HTML. You’ll get code like ``. ## Step 3. Add the code to your site Paste the code where you want it on the page. Most visual editors have an HTML mode or a dedicated code block for this. Note that some editors and CMS filters strip `iframe` tags for security reasons. If the map is missing after saving, check the text filter settings for your user group. ## Step 4. Make the map responsive The code from Google Maps has a fixed width, such as `width="600"`. On a phone, a map like that overflows the screen. The simplest fix is to change the width to 100%: ``` ``` The `loading="lazy"` attribute delays loading the map until the visitor scrolls to it, which speeds up the page. The `title` attribute lets screen readers name the map. ## How to embed directions Get directions in Google Maps, choose a route, then click Share → Embed a map → Copy HTML. It’s a handy way to show, for example, how to reach your office from the station or car park. ## When you can’t do without an API key A map from Share is fine for one location or one route. You need a Google Maps Platform key if you want to: - show several branches or locations on one map with your own markers; - suggest addresses as people type in an order or delivery form; - calculate distance or delivery cost; - style the map in your brand colours. For embedding maps via the API, Google offers the Maps Embed API: according to Google, all its requests are free with unlimited usage. The other APIs are paid beyond the free allowance, so keys are restricted to your domain and costs are monitored. **Privacy.** An embedded map loads from Google’s servers and may set cookies. On sites for EU visitors, this is reflected in the cookie banner and privacy policy — for example, by showing the map after consent or on click. ## Common mistakes - A pin at an address is embedded instead of the Business Profile — customers don’t see the name or reviews. - A fixed width breaks the layout on phones. - The map is on every page of the site — unnecessary loading; the Contact page is enough. - A screenshot instead of a real map — you can’t get directions from it. ## In short 1. Find your business on Google Maps, ideally its Business Profile. 2. Share → Embed a map → Copy HTML. 3. Paste the code in your editor’s HTML mode. 4. Change the width to 100% and keep `loading="lazy"`. 5. For multiple locations, address suggestions and delivery calculations, you need an API key. If you need a map with several locations, address suggestions in forms or directions to a customer, we can [connect Google Maps to your website](https://it-deweloper.pl/en/web/google/maps-platform) via the API: set up access, secure the key and cap the costs. 17 October 2026 | [Victor Parhimchik](https://it-deweloper.pl/index.php?option=com_contact&view=contact&id=1&catid=4) | [IT Deweloper Blog](https://it-deweloper.pl/index.php?option=com_content&view=category&id=29) [ ![A database icon in a browser window, a step checklist and a question mark — a guide to first queries on GA4 data in BigQuery](https://it-deweloper.pl/images/blog/ga4-bigquery-first-query-cover.webp) ### How to Write Your First Query on GA4 Data in BigQuery Once Google Analytics 4 is linked to BigQuery, raw events appear in your warehouse every day: every page view, click and enquiry with all its paramet… ](https://it-deweloper.pl/index.php?option=com_content&view=article&id=300:ga4-bigquery-first-query&catid=29&lang=en-GB) [ ![A gateway arch with an arrow in a browser window, a step checklist and a question mark — an explanation of how Google tag gateway works](https://it-deweloper.pl/images/blog/how-google-tag-gateway-works-cover.webp) ### How Google Tag Gateway Works and Whether to Turn It On Google tag gateway is a feature that lets you load Google tags from your own domain instead of Google’s servers. It’s often described as a way to “by… ](https://it-deweloper.pl/index.php?option=com_content&view=article&id=299:how-google-tag-gateway-works&catid=29&lang=en-GB) [ ![A speed gauge with a needle in a browser window, a step checklist and a question mark — a guide to checking Core Web Vitals](https://it-deweloper.pl/images/blog/check-core-web-vitals-cover.webp) ### How to Check Your Core Web Vitals and Read the Numbers Core Web Vitals are three metrics Google uses to judge how comfortable a page is to use: how quickly the main content appears, how quickly the page r… ](https://it-deweloper.pl/index.php?option=com_content&view=article&id=298:check-core-web-vitals&catid=29&lang=en-GB) [ ![An envelope in a browser window, a step checklist and a question mark — a guide to setting up SPF, DKIM and DMARC for Google Workspace](https://it-deweloper.pl/images/blog/google-workspace-spf-dkim-dmarc-cover.webp) ### How to Set Up SPF, DKIM and DMARC for Google Workspace If emails from your domain land in spam or don’t arrive at all, the first thing to check is three DNS records: SPF, DKIM and DMARC. Since 2024, Gmail… ](https://it-deweloper.pl/index.php?option=com_content&view=article&id=297:google-workspace-spf-dkim-dmarc&catid=29&lang=en-GB) [ ![A shield with a padlock in a browser window, a step checklist and a question mark — a guide to choosing reCAPTCHA and getting keys](https://it-deweloper.pl/images/blog/choose-recaptcha-version-cover.webp) ### How to Choose reCAPTCHA for a Form and Get the Keys reCAPTCHA protects your website forms from spam bots. During 2025, Google moved all reCAPTCHA keys to Google Cloud, so many older guides are out of d… ](https://it-deweloper.pl/index.php?option=com_content&view=article&id=296:choose-recaptcha-version&catid=29&lang=en-GB) [ ![A map pin in a browser window, a step checklist and a question mark — a guide to embedding a Google map on a website](https://it-deweloper.pl/images/blog/embed-google-map-on-website-cover.webp) ### How to Embed a Google Map on Your Website Without an API Key A map on your Contact page helps customers see where you are and get directions straight away. You don’t need an API key or a payment card in Google… ](https://it-deweloper.pl/index.php?option=com_content&view=article&id=295:embed-google-map-on-website&catid=29&lang=en-GB) [ ![A target with an arrow in a browser window, a step checklist and a question mark — a guide to checking Google Ads conversions](https://it-deweloper.pl/images/blog/check-google-ads-conversions-cover.webp) ### How to Check That Google Ads Conversions Are Tracked Google Ads learns from conversions: enquiries, calls, purchases. If they’re counted wrongly, the system optimises your campaigns blind — spending bud… ](https://it-deweloper.pl/index.php?option=com_content&view=article&id=294:check-google-ads-conversions&catid=29&lang=en-GB) [ ![Pie and bar charts in a browser window, a step checklist and a question mark — a guide to building a Data Studio report](https://it-deweloper.pl/images/blog/data-studio-first-report-cover.webp) ### How to Build a Data Studio Report from Analytics and GSC Data Studio is Google’s free tool for reports and dashboards. In April 2026 Google brought back this name; for several years before that it was calle… ](https://it-deweloper.pl/index.php?option=com_content&view=article&id=293:data-studio-first-report&catid=29&lang=en-GB) [ ![A cookie icon in a browser window, a step checklist and a question mark — a guide to checking Google Consent Mode](https://it-deweloper.pl/images/blog/check-consent-mode-v2-cover.webp) ### How to Check If Consent Mode v2 Works on Your Website Google Consent Mode v2 passes the choice a visitor made in your cookie banner to Google Analytics and Google Ads. A banner can look perfect and still… ](https://it-deweloper.pl/index.php?option=com_content&view=article&id=292:check-consent-mode-v2&catid=29&lang=en-GB) [ ![A Tag Manager tag icon in a browser window, a step checklist and a question mark — a guide to installing Google Tag Manager](https://it-deweloper.pl/images/blog/install-google-tag-manager-cover.webp) ### How to Install Google Tag Manager on Your Website Google Tag Manager is a “box” for all the tracking codes on your site: Google Analytics, Google Ads conversions, social media pixels. You install the… ](https://it-deweloper.pl/index.php?option=com_content&view=article&id=291:install-google-tag-manager&catid=29&lang=en-GB) [](#) [](#) ## Build your website Find out what your website will cost [ Pricing ](https://it-deweloper.pl/index.php?Itemid=262&lang=en-GB) ![](https://it-deweloper.pl/media/yootheme/cache/3c/background-square-01-3c44c74f.png?src=images/yootheme/demo/background-square-01.png&thumbnail=900,900,&hash=72c31958) ![](https://it-deweloper.pl/media/yootheme/cache/cb/background-square-03-cbb341a0.png?src=images/yootheme/demo/background-square-03.png&thumbnail=600,600,&hash=6e9dde93) ### [ Contact ](https://it-deweloper.pl/index.php?Itemid=277&lang=en-GB) Web studio IT Deweloper website development, Poland. 5423493188 SEOAIAdsWebSMM ### Address Nowogródzka 4A Białystok, 15-490, PL [ ### Phone +48 731 190 041 ](tel:+48731190041) [ ### Email This email address is being protected from spambots. You need JavaScript enabled to view it. ](mailto:office@it-deweloper.pl) [ ### WhatsApp ](https://wa.me/48731190041) [ ### Telegram ](https://t.me/+48731190041) Opening hours: - Monday 0900–1800 - Tuesday 0900–1800 - Wednesday 0900–1800 - Thursday 0900–1800 - Friday 0900–1800 - Saturday 0900–1600 - Sunday closed ![IT Deweloper](https://it-deweloper.pl/images/Logo.webp) Web development can be interesting! Our social media, with content about building websites. - [](https://www.facebook.com/ITdeweloper) - [](https://www.linkedin.com/company/it-deweloper) - [](https://t.me/IT_deweloper) - [](https://www.instagram.com/it_deweloper/) - [Portfolio](https://it-deweloper.pl/index.php?Itemid=264&lang=en-GB) - [Contact](https://it-deweloper.pl/index.php?Itemid=277&lang=en-GB) - [About us](https://it-deweloper.pl/index.php?Itemid=261&lang=en-GB) **it-deweloper** — a web development studio. We design and build modern websites and online stores. © [it-deweloper](https://it-deweloper.pl/en). All rights reserved. [Privacy Policy](https://it-deweloper.pl/index.php?Itemid=313&lang=en)