웹사이트에 Google 지도를 삽입하는 방법

게시 됨: 2022-05-15

고객이나 고객이 실제 매장을 찾도록 돕는 것은 대면 판매를 극대화하는 데 필수적입니다. Google 마이 비즈니스를 사용하여 Google 지도에 비즈니스를 추가할 수 있습니다. 그러나 웹사이트(예: 연락처 페이지)에 Google 지도를 삽입할 수도 있습니다.

생각보다 쉽습니다.

웹사이트에 Google 지도를 삽입하는 것은 소비자가 귀하의 비즈니스를 찾는 데 도움이 되는 간단한 방법입니다. 매월 1억 5천만 명 이상의 사용자가 Google 지도에 액세스하고 있으므로 이 사용자 기반을 활용하고 싶습니다. 결국, 고객이든, 고객이든, 잠재적인 직원이든 관계없이 비즈니스와 회사를 찾는 방법입니다.

이 기사에서는 회사 사이트든 지역 상점이든 웹사이트에 Google 지도를 삽입하는 방법을 설명합니다.

마케팅을 업그레이드하십시오! 지금 무료 상담을 예약하여 SEO 및 PPC로 매출을 늘리십시오!

웹사이트에 Google 지도를 삽입하는 방법

웹사이트에 Google 지도를 삽입하는 방법에는 HTML 코드 또는 API 키의 두 가지가 있습니다.

HTML 코드 사용

Google 지도에는 시스템에 통합된 "지도 공유 또는 포함" 기능이 있습니다. 웹사이트의 HTML 코드 안에 있는 지도의 HTML 코드를 사용하여 페이지에 Google 지도에 대한 직접 링크를 만듭니다.

google.com/maps로 이동합니다.
삽입할 위치를 찾아 선택합니다.
왼쪽 상단의 메뉴 탭에서 세 개의 수평선을 클릭합니다.
"지도 공유 또는 포함" 옵션을 선택합니다.

공유 링크를 사용하여 Facebook이나 Twitter와 같은 소셜 미디어 또는 기타 호환 가능한 플랫폼에서 링크를 보내거나 공유할 수 있습니다.
웹사이트에 대한 링크를 추가하려면 "지도 삽입" 탭을 클릭하십시오.

팝업 메뉴의 왼쪽 드롭다운 탭에서 지도 크기를 작게, 중간, 크게 또는 사용자 정의 크기로 결정합니다.
"COPY HTML" 옵션을 선택하고 웹사이트의 HTML 섹션에 붙여넣습니다.
웹 페이지에서 원하는 위치에 지도를 배치할 수 있습니다. 그러나 지도를 삽입하면 Google 서비스 약관을 준수하는 데 동의하는 것입니다. 또한 실시간 교통 정보와 같은 내장된 지도의 모든 Google 지도 기능에 액세스할 수 없습니다.

추천 블로그 : 매출 증대를 위한 즉시 사용 가능한 상위 20개 아이디어와 SEO란? 검색 엔진 최적화에 대한 초보자 가이드.

API 키를 사용하여 Google 지도 삽입

이 방법을 구현하려면 코딩에 어느 정도 능숙해야 합니다.

1단계: API 키 생성

Google Cloud Platform의 Google 지도 섹션으로 이동합니다.
(프로젝트를 설정할 때 Enabled API가 있어야 합니다.)
왼쪽 메뉴에서 "자격 증명"을 선택합니다.
"+ CREATE CREDENTIALS"를 클릭하십시오.
메뉴에서 "API 키"를 선택하고 나타나는 API를 복사합니다(나중에 필요합니다).

2단계: 지도가 작동하도록 코드 만들기

페이지의 지도 스타일 코드를 결정합니다.
<스타일>
#map { 너비: 100%;

높이: 400px;
배경색: 회색;
}
</스타일>
비즈니스 좌표가 포함된 지도 스크립트를 추가합니다.
<스크립트> 함수 initMap() {
var macc = {위도: <위도>, 경도: <경도>};
var 지도 = 새로운 google.maps.Map(
document.getElementById('지도'), {확대: 15, 중앙: macc});
var marker = new google.maps.Market({위치: macc, 지도: 지도});
}
</스크립트>

3단계: HTML 문서에 Google 스크립트 추가

API 키를 아래 스크립트 async에 추가하고 "YOUR_API_KEY"를 바꿉니다.
<스크립트 비동기
src=”https://maps.googleapis.com/maps/api/js?key=<YOUR_API_KEY>&callback=initMap”>
</스크립트>
스크립트를 HTML 문서에 추가하여 완료합니다.

Google에서 지도가 로드되는 위치를 초기화하고 추가하기 위해 이 함수가 필요하기 때문에 initMap() 함수를 사용해야 합니다. 이 함수 내부에는 위치의 위도와 경도가 포함되어야 합니다.

완료되면 고객이 사용할 수 있는 반응형 지도가 준비됩니다.

추천 블로그: 전환하는 콘텐츠 마케팅 퍼널을 만드는 방법과 카피라이팅이란? 디지털 카피라이팅으로 매출을 늘리는 방법.

웹사이트에 Google 지도를 삽입해야 하는 이유

Google 지도를 추가하려는 특정 목적이 있을 수 있습니다. 그렇지 않은 경우 웹사이트에 Google 지도를 삽입해야 하는 몇 가지 이유가 있습니다.

매장 찾기

모든 지역 비즈니스는 웹사이트에 내장된 Google 지도를 포함하는 것을 우선시해야 합니다. Google 지도의 스크린샷은 도움이 되지만 완벽하게 작동하는 포함된 지도 수준의 세부 정보를 제공하지 않습니다. 예를 들어, 고객은 귀하의 상점이 집에서 얼마나 멀리 떨어져 있는지 보기 위해 스크롤할 수 있습니다.

매장을 찾을 수 있으면 매장 방문, 판매 및 이익이 증가합니다. 온라인 인지도를 실제 비즈니스와 연결하는 간단한 방법입니다.

추천 블로그: 새로운 Shopify 스토어로 트래픽을 유도하는 방법, 비즈니스 성장을 위한 브랜드 인지도 전략 아이디어, 중소기업을 위한 5가지 효과적인 온라인 마케팅 아이디어.

연락처 페이지에 가치를 더하십시오

주소를 나열하는 것도 중요하지만 고객은 Google 지도로 이동하여 어쨌든 검색할 것입니다. 마케팅에는 고객이 취해야 하는 단계를 최소화하는 규칙이 있습니다. 모든 추가 클릭 또는 검색은 고객을 잃게 됩니다.

내장된 Google 지도 앱을 추가하여 연락처 페이지에 가치를 추가하고 고객의 시간을 절약할 수 있습니다. 귀하의 비즈니스가 약간 벗어난 경우 중요합니다.

경로 시연

일부 기업은 도움이 될 것입니다. 하이킹 신발이나 러닝 탑을 판매하는 경우 고객이 시도할 수 있는 산책이나 달리기를 추천하고 싶을 수 있습니다. (훌륭한 블로그 게시물이 됩니다.) Google 지도에서 강조 표시된 경로보다 이러한 정보를 표시하는 더 좋은 방법은 없습니다.

추천 블로그 : 디지털 마케팅이란? 디지털 마케팅의 기본 사항, Google 마이 비즈니스의 이점 및 내 웹사이트의 Sitemap을 찾는 방법.

웹사이트에 Google을 삽입하는 방법을 배우는 것은 간단합니다.

조금 위압적으로 보일 수 있습니다. 그러나 위의 가이드를 단계별로 진행하면 고객이 감상할 수 있는 완벽하게 포함된 지도가 완성됩니다. 편리하고 도움이 되며 비즈니스에도 도움이 됩니다. API 기술은 다른 옵션보다 훨씬 더 많은 기능을 제공하므로 시도해 볼 가치가 있습니다.

물론 정말 힘들면 언제든지 전문가에게 연락하여 도움을 받을 수 있습니다. 우리는 웹사이트를 구성하고 Google 지도를 삽입한 경험이 있습니다. 기꺼이 도와드리겠습니다.