--- title: "Як уставіць карту Google на сайт без API-ключа" description: "Як убудаваць карту Google на сайт бясплатна і без ключа API: код з Google Карт, адаптыўная шырыня, маршрут. І калі без ключа ўжо не абысціся." url: "https://it-deweloper.pl/be/blog/embed-google-map-on-website" date: "2026-10-17T22:34:22+00:00" language: "be-BY" --- [Перайсці да змесціва](#tm-main) - [ Распрацоўка сайтаў](https://it-deweloper.pl/be "Галоўная старонка вэб-студыі IT Deweloper") - [Кошты](https://it-deweloper.pl/be/cost "Тарыфы і кошт паслуг") - [ПрайсПрыкладныя цэны на вэб-распрацоўку](https://it-deweloper.pl/be/cost/pricing "Цэны на распрацоўку сайта") - [КалькулятарСамастойны онлайн-разлік](https://it-deweloper.pl/be/cost/calculator "Разлічыць кошт сайта анлайн") - [БрыфАтрымайце дакладны разлік праекта](https://it-deweloper.pl/be/cost/brief "Запоўніць брыф на распрацоўку сайта") - [Рашэнні](https://it-deweloper.pl/be/web "Рашэнні IT Deweloper у вэб-распрацоўцы") - [Этапы працыЯк мы робім сайты](https://it-deweloper.pl/be/web/process "Этапы і тэрміны распрацоўкі сайта") - [SEOПошукавая аптымізацыя](https://it-deweloper.pl/be/web/seo "SEO прасоўванне сайта: аптымізацыя, раскрутка, пазіцыі ў Google") - [GEOПрасоўванне сайта ў ШІ](https://it-deweloper.pl/be/web/geo "GEO-аптымізацыя: прасоўванне сайта ў адказах ChatGPT, Gemini і Perplexity") - [ШIШтучны інтэлект на сайце](https://it-deweloper.pl/be/web/ai) - [JoomlaСістэма кіравання вэб-сайтам](https://it-deweloper.pl/be/web/joomla "Распрацоўка сайтаў на Joomla") - [GoogleНалада сэрвісаў Google](https://it-deweloper.pl/be/web/google "Налада сэрвісаў Google для сайта") - [Партфоліа](https://it-deweloper.pl/be/portfolio "Партфоліа і прыклады работ") - [Пра нас](https://it-deweloper.pl/be/about "Пра заснавальніка студыі — Віктар Пархімчык") - [Кантакт](https://it-deweloper.pl/be/contact "Кантакты вэб-студыі IT Deweloper") - [ +48 731 190 041](tel:+48731190041 "Тэлефон") - [ office@it-deweloper.pl](mailto:office@it-deweloper.pl "Электронная пошта") - [ Nowogródzka 4A, Беласток, Польшча](https://maps.app.goo.gl/BNjvryytwRyv4omA7 "Адрас") - [ WhatsApp](https://wa.me/48731190041 "WhatsApp") - [ Telegram](https://t.me/+48731190041 "Telegram") - [FAQ](https://it-deweloper.pl/be/faq "Частыя пытанні пра распрацоўку сайтаў") - [Блог](https://it-deweloper.pl/be/blog "Артыкулы пра распрацоўку і прасоўванне сайтаў") - [ Русский ](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) Беларуская - [ Русский ](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/be) [ Меню ](#tm-dialog) - [ Распрацоўка сайтаў](https://it-deweloper.pl/be "Галоўная старонка вэб-студыі IT Deweloper") - [Кошты](https://it-deweloper.pl/be/cost "Тарыфы і кошт паслуг") - [ПрайсПрыкладныя цэны на вэб-распрацоўку](https://it-deweloper.pl/be/cost/pricing "Цэны на распрацоўку сайта") - [КалькулятарСамастойны онлайн-разлік](https://it-deweloper.pl/be/cost/calculator "Разлічыць кошт сайта анлайн") - [БрыфАтрымайце дакладны разлік праекта](https://it-deweloper.pl/be/cost/brief "Запоўніць брыф на распрацоўку сайта") - [Рашэнні](https://it-deweloper.pl/be/web "Рашэнні IT Deweloper у вэб-распрацоўцы") - [Этапы працыЯк мы робім сайты](https://it-deweloper.pl/be/web/process "Этапы і тэрміны распрацоўкі сайта") - [SEOПошукавая аптымізацыя](https://it-deweloper.pl/be/web/seo "SEO прасоўванне сайта: аптымізацыя, раскрутка, пазіцыі ў Google") - [GEOПрасоўванне сайта ў ШІ](https://it-deweloper.pl/be/web/geo "GEO-аптымізацыя: прасоўванне сайта ў адказах ChatGPT, Gemini і Perplexity") - [ШIШтучны інтэлект на сайце](https://it-deweloper.pl/be/web/ai) - [JoomlaСістэма кіравання вэб-сайтам](https://it-deweloper.pl/be/web/joomla "Распрацоўка сайтаў на Joomla") - [GoogleНалада сэрвісаў Google](https://it-deweloper.pl/be/web/google "Налада сэрвісаў Google для сайта") - [Партфоліа](https://it-deweloper.pl/be/portfolio "Партфоліа і прыклады работ") - [Пра нас](https://it-deweloper.pl/be/about "Пра заснавальніка студыі — Віктар Пархімчык") - [Кантакт](https://it-deweloper.pl/be/contact "Кантакты вэб-студыі IT Deweloper") - [ +48 731 190 041](tel:+48731190041 "Тэлефон") - [ office@it-deweloper.pl](mailto:office@it-deweloper.pl "Электронная пошта") - [ Nowogródzka 4A, Беласток, Польшча](https://maps.app.goo.gl/BNjvryytwRyv4omA7 "Адрас") - [ WhatsApp](https://wa.me/48731190041 "WhatsApp") - [ Telegram](https://t.me/+48731190041 "Telegram") - [FAQ](https://it-deweloper.pl/be/faq "Частыя пытанні пра распрацоўку сайтаў") - [Блог](https://it-deweloper.pl/be/blog "Артыкулы пра распрацоўку і прасоўванне сайтаў") [ Блог вэб-студыі IT Deweloper ](https://it-deweloper.pl/index.php?option=com_content&view=category&id=20&lang=be-BY "Блог вэб-студыі IT Deweloper") # Як уставіць карту Google на сайт без API-ключа Карта на старонцы «Кантакты» дапамагае кліенту зразумець, дзе вы знаходзіцеся, і адразу пракласці маршрут. Для гэтага не патрэбныя ні API-ключ, ні плацежная картка ў Google Cloud: простую карту можна ўбудаваць кодам проста з Google Карт за пару хвілін. Паказваю, як атрымаць код карты, як зрабіць яе зручнай на тэлефоне, як убудаваць маршрут — і ў якіх выпадках без ключа Google Maps Platform усё ж не абысціся. --- ![Метка на карце ў акне браўзера, спіс крокаў і знак пытання — інструкцыя па ўбудаванні карты Google на сайт](https://it-deweloper.pl/images/blog/embed-google-map-on-website-cover-2x.webp) Назвы пунктаў меню даю па англамоўным інтэрфейсе — на іншых мовах яны перакладзеныя. ## Крок 1. Знайдзіце месца на Google Картах Адкрыйце [Google Карты](https://www.google.com/maps) на камп’ютары і знайдзіце сваю кампанію па назве. Калі ў кампаніі ёсць Профіль у Google, убудоўвайце менавіта яго: тады на карце будуць назва, рэйтынг і кнопка маршруту, а не проста кропка па адрасе. Калі профіль яшчэ не пацверджаны, спатрэбіцца [артыкул пра пацвярджэнне Профілю кампаніі](https://it-deweloper.pl/be/blog/verify-google-business-profile). ## Крок 2. Скапіруйце код 1. У картцы месца націсніце Share. Калі патрэбны проста фрагмент карты без карткі, адкрыйце меню злева ўверсе і выберыце Share or embed map. 2. Перайдзіце на ўкладку Embed a map. 3. Пры жаданні выберыце памер і пасуньце карту, каб месца апынулася ў цэнтры. 4. Націсніце Copy HTML. Вы атрымаеце код выгляду ``. ## Крок 3. Устаўце код на сайт Устаўце код у патрэбнае месца старонкі. У большасці візуальных рэдактараў для гэтага ёсць рэжым HTML або асобны блок для кода. Улічыце, што некаторыя рэдактары і фільтры CMS з меркаванняў бяспекі выразаюць `iframe`. Калі пасля захавання карты няма, праверце налады фільтра тэксту для сваёй групы карыстальнікаў. ## Крок 4. Зрабіце карту адаптыўнай У кодзе з Google Карт стаіць фіксаваная шырыня, напрыклад `width="600"`. На тэлефоне такая карта вылазіць за экран. Прасцей за ўсё замяніць шырыню на 100%: ``` ``` Атрыбут `loading="lazy"` адкладвае загрузку карты, пакуль наведвальнік не пракруціць да яе, і паскарае старонку. Атрыбут `title` патрэбны экранным дыктарам, каб назваць карту. ## Як убудаваць маршрут Пабудуйце маршрут у Google Картах праз Directions, выберыце варыянт, націсніце Share → Embed a map → Copy HTML. Так зручна паказаць, напрыклад, як прайсці да офіса ад вакзала або паркоўкі. ## Калі без API-ключа не абысціся Карта з Share падыходзіць для адной кропкі або маршруту. Ключ Google Maps Platform патрэбны, калі вы хочаце: - паказаць на адной карце некалькі філіялаў або аб’ектаў са сваімі меткамі; - падказваць адрас пры ўводзе ў форме заказу або дастаўкі; - разлічваць адлегласць або кошт дастаўкі; - аформіць карту ў фірмовых колерах. Для ўбудавання карт праз API ў Google ёсць Maps Embed API: паводле Google, усе яго запыты бясплатныя і без абмежавання колькасці. Астатнія API платныя звыш бясплатнага аб’ёму, таму ключ абмяжоўваюць па дамене і сочаць за выдаткамі. **Прыватнасць.** Убудаваная карта загружаецца з сервераў Google і можа ўсталёўваць cookie. На сайтах для наведвальнікаў з ЕС гэта ўлічваюць у cookie-банеры і палітыцы прыватнасці — напрыклад, паказваюць карту пасля згоды або па кліку. ## Частыя памылкі - Убудавана кропка па адрасе, а не Профіль кампаніі — кліент не бачыць назву і водгукі. - Фіксаваная шырыня ламае вёрстку на тэлефоне. - Карта стаіць на кожнай старонцы сайта — гэта лішняя загрузка, дастаткова старонкі «Кантакты». - Замест карты ўстаўлены скрыншот — па ім нельга пракласці маршрут. ## Коратка 1. Знайдзіце кампанію на Google Картах, лепш — яе Профіль. 2. Share → Embed a map → Copy HTML. 3. Устаўце код у HTML-рэжыме рэдактара. 4. Замяніце шырыню на 100% і пакіньце `loading="lazy"`. 5. Для некалькіх кропак, падказкі адраса і разліку дастаўкі патрэбны ключ API. Калі патрэбная карта з некалькімі кропкамі, падказка адраса ў формах або маршрут да кліента, мы можам [падключыць Google Maps да сайта](https://it-deweloper.pl/be/web/google/maps-platform) праз API: аформім доступ, абаронім ключ і абмяжуем выдаткі. 17 кастрычніка 2026 | [Victor Parhimchik](https://it-deweloper.pl/index.php?option=com_contact&view=contact&id=1&catid=4) | [Блог вэб-студыі IT Deweloper](https://it-deweloper.pl/index.php?option=com_content&view=category&id=20) [ ![Значок базы даных у акне браўзера, спіс крокаў і знак пытання — інструкцыя па першых запытах да даных GA4 у BigQuery](https://it-deweloper.pl/images/blog/ga4-bigquery-first-query-cover.webp) ### Як зрабіць першы запыт да даных GA4 у BigQuery Пасля звязкі Google Analytics 4 з BigQuery у вашым сховішчы кожны дзень з’яўляюцца сырыя падзеі: кожны прагляд старонкі, клік і заяўка з усімі параме… ](https://it-deweloper.pl/index.php?option=com_content&view=article&id=285:ga4-bigquery-first-query&catid=20&lang=be-BY) [ ![Арка шлюза са стрэлкай у акне браўзера, спіс крокаў і знак пытання — тлумачэнне працы Google tag gateway](https://it-deweloper.pl/images/blog/how-google-tag-gateway-works-cover.webp) ### Як працуе Google tag gateway і ці варта яго ўключаць Google tag gateway — функцыя, якая дазваляе загружаць тэгі Google з вашага ўласнага дамена, а не з сервераў Google. Яе часта апісваюць як спосаб «абы… ](https://it-deweloper.pl/index.php?option=com_content&view=article&id=284:how-google-tag-gateway-works&catid=20&lang=be-BY) [ ![Шкала хуткасці са стрэлкай у акне браўзера, спіс крокаў і знак пытання — інструкцыя па праверцы Core Web Vitals](https://it-deweloper.pl/images/blog/check-core-web-vitals-cover.webp) ### Як праверыць Core Web Vitals сайта і зразумець лічбы Core Web Vitals — тры паказчыкі, па якіх Google ацэньвае, наколькі зручна карыстацца старонкай: як хутка з’яўляецца галоўнае змесціва, як хутка сайт… ](https://it-deweloper.pl/index.php?option=com_content&view=article&id=283:check-core-web-vitals&catid=20&lang=be-BY) [ ![Канверт у акне браўзера, спіс крокаў і знак пытання — інструкцыя па наладзе SPF, DKIM і DMARC для Google Workspace](https://it-deweloper.pl/images/blog/google-workspace-spf-dkim-dmarc-cover.webp) ### Як наладзіць SPF, DKIM і DMARC для Google Workspace Калі лісты з вашага дамена трапляюць у спам або ўвогуле не даходзяць, першым чынам правяраюць тры запісы ў DNS: SPF, DKIM і DMARC. З 2024 года Gmail… ](https://it-deweloper.pl/index.php?option=com_content&view=article&id=282:google-workspace-spf-dkim-dmarc&catid=20&lang=be-BY) [ ![Шчыт з замком у акне браўзера, спіс крокаў і знак пытання — інструкцыя па выбары reCAPTCHA і атрыманні ключоў](https://it-deweloper.pl/images/blog/choose-recaptcha-version-cover.webp) ### Як выбраць reCAPTCHA для формы і атрымаць ключы reCAPTCHA абараняе формы сайта ад спам-ботаў. За 2025 год Google перанёс усе ключы reCAPTCHA ў Google Cloud, таму многія старыя інструкцыі састарэлі… ](https://it-deweloper.pl/index.php?option=com_content&view=article&id=281:choose-recaptcha-version&catid=20&lang=be-BY) [ ![Метка на карце ў акне браўзера, спіс крокаў і знак пытання — інструкцыя па ўбудаванні карты Google на сайт](https://it-deweloper.pl/images/blog/embed-google-map-on-website-cover.webp) ### Як уставіць карту Google на сайт без API-ключа Карта на старонцы «Кантакты» дапамагае кліенту зразумець, дзе вы знаходзіцеся, і адразу пракласці маршрут. Для гэтага не патрэбныя ні API-ключ, ні пл… ](https://it-deweloper.pl/index.php?option=com_content&view=article&id=280:embed-google-map-on-website&catid=20&lang=be-BY) [ ![Мішэнь са стралой у акне браўзера, спіс крокаў і знак пытання — інструкцыя па праверцы канверсій Google Ads](https://it-deweloper.pl/images/blog/check-google-ads-conversions-cover.webp) ### Як праверыць, што канверсіі Google Ads лічацца Рэклама ў Google Ads вучыцца на канверсіях: заяўках, званках, пакупках. Калі яны лічацца няправільна, сістэма аптымізуе кампаніі ўсляпую — марнуе бюд… ](https://it-deweloper.pl/index.php?option=com_content&view=article&id=279:check-google-ads-conversions&catid=20&lang=be-BY) [ ![Кругавая і слупковая дыяграмы ў акне браўзера, спіс крокаў і знак пытання — інструкцыя па стварэнні справаздачы ў Data Studio](https://it-deweloper.pl/images/blog/data-studio-first-report-cover.webp) ### Як зрабіць справаздачу ў Data Studio па Analytics і GSC Data Studio — бясплатны сэрвіс Google для справаздач і дашбордаў. У красавіку 2026 года Google вярнуў яму гэтую назву, да гэтага ён некалькі гадоў на… ](https://it-deweloper.pl/index.php?option=com_content&view=article&id=278:data-studio-first-report&catid=20&lang=be-BY) [ ![Значок cookie ў акне браўзера, спіс крокаў і знак пытання — інструкцыя па праверцы рэжыму згоды Google](https://it-deweloper.pl/images/blog/check-consent-mode-v2-cover.webp) ### Як праверыць, ці працуе Consent Mode v2 на сайце Рэжым згоды Google (Consent Mode v2) перадае ў Google Analytics і Google Ads выбар, які наведвальнік зрабіў у cookie-банеры. Банер можа выглядаць ідэ… ](https://it-deweloper.pl/index.php?option=com_content&view=article&id=277:check-consent-mode-v2&catid=20&lang=be-BY) [ ![Значок цэтліка Tag Manager у акне браўзера, спіс крокаў і знак пытання — інструкцыя па ўсталёўцы Google Tag Manager](https://it-deweloper.pl/images/blog/install-google-tag-manager-cover.webp) ### Як усталяваць Google Tag Manager на сайт Google Tag Manager — гэта «скрыня» для ўсіх кодаў адсочвання на сайце: Google Analytics, канверсій Google Ads, пікселяў сацсетак. Код кантэйнера став… ](https://it-deweloper.pl/index.php?option=com_content&view=article&id=276:install-google-tag-manager&catid=20&lang=be-BY) [](#) [](#) ## Стварыце свой сайт Даведайцеся, колькі будзе каштаваць распрацоўка вашага сайта [ Прайс ](https://it-deweloper.pl/index.php?Itemid=269&lang=be-BY) ![](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) ### [ Кантакт ](https://it-deweloper.pl/index.php?Itemid=283&lang=be-BY) Вэб-студыя IT Deweloper распрацоўка сайтаў, Польшча. 5423493188 SEOШІРэкламаВэбSMM ### Адрас Nowogródzka 4A Беласток, 15-490, PL [ ### Тэлефон +48 731 190 041 ](tel:+48731190041) [ ### Электронная пошта Гэты адрас электроннай пошты абаронены ад спам-ботаў. Для яго прагляду ў вас павінен быць уключаны JavaScript у браўзэры. ](mailto:office@it-deweloper.pl) [ ### WhatsApp ](https://wa.me/48731190041) [ ### Telegram ](https://t.me/+48731190041) Час працы: - Панядзелак 0900–1800 - Аўторак 0900–1800 - Серада 0900–1800 - Чацвер 0900–1800 - Пятніца 0900–1800 - Субота 0900–1600 - Нядзеля выхадны ![IT Deweloper](https://it-deweloper.pl/images/Logo.webp) Вэб-распрацоўка можа быць цікавай! Нашы сацыяльныя сеткі з кантэнтам пра стварэнне сайтаў. - [](https://www.facebook.com/ITdeweloper) - [](https://www.linkedin.com/company/it-deweloper) - [](https://t.me/IT_deweloper) - [](https://www.instagram.com/it_deweloper/) - [Партфоліа](https://it-deweloper.pl/index.php?Itemid=307&lang=be-BY) - [Кантакты](https://it-deweloper.pl/index.php?Itemid=283&lang=be-BY) - [Пра нас](https://it-deweloper.pl/index.php?Itemid=260&lang=be-BY) **it-deweloper** — студыя вэб-распрацоўкі. Мы праектуем і ствараем сучасныя сайты і інтэрнэт-крамы. © [it-deweloper](https://it-deweloper.pl/be). Усе правы абаронены. [Палітыка прыватнасці](https://it-deweloper.pl/index.php?Itemid=312&lang=be)