วิธีฝัง Google Maps ลงในเว็บไซต์ของคุณ

เผยแพร่แล้ว: 2022-05-15

การช่วยเหลือลูกค้าหรือลูกค้าในการค้นหาร้านค้าในโลกแห่งความเป็นจริงของคุณเป็นสิ่งสำคัญในการเพิ่มยอดขายต่อหน้าของคุณให้สูงสุด คุณสามารถเพิ่มธุรกิจของคุณลงใน Google Maps โดยใช้ Google My Business แต่คุณยังสามารถฝัง Google Maps ลงในเว็บไซต์ของคุณได้ เช่น หน้าติดต่อของคุณ

มันง่ายกว่าเสียง

การฝัง Google Maps ในเว็บไซต์เป็นวิธีง่ายๆ ที่จะช่วยให้ผู้บริโภคค้นหาธุรกิจของคุณได้ ด้วยผู้ใช้มากกว่า 150 ล้านคนที่เข้าถึง Google Maps ทุกเดือน คุณต้องการเข้าถึงฐานผู้ใช้นี้ ท้ายที่สุด มันคือหนทางสู่การค้นหาธุรกิจและบริษัท ไม่ว่าคุณจะเป็นลูกค้า ลูกค้า หรือแม้แต่ผู้ที่มีแนวโน้มจะเป็นพนักงานก็ตาม

ฝัง google map ฝัง google maps ในเว็บไซต์

ในบทความนี้ เราจะอธิบายวิธีฝัง Google Maps ในเว็บไซต์ ไม่ว่าจะเป็นเว็บไซต์ของบริษัทหรือร้านค้าในพื้นที่

ยกระดับการตลาดของคุณ! นัดหมายปรึกษาฟรีเพื่อเพิ่มยอดขายด้วย SEO และ PPC วันนี้!

วิธีฝัง Google Maps ในเว็บไซต์

มีสองวิธีในการฝัง Google Maps ในเว็บไซต์: รหัส HTML หรือคีย์ API

การใช้โค้ด HTML

Google Maps มีคุณสมบัติ "แชร์หรือฝังแผนที่" ที่รวมอยู่ในระบบของตน คุณใช้โค้ด HTML ของแผนที่ภายในโค้ด HTML ของเว็บไซต์ของคุณเพื่อสร้างลิงก์โดยตรงไปยัง Google Maps บนหน้าเว็บ

  1. ไปที่ google.com/maps
  2. ค้นหาตำแหน่งที่คุณต้องการฝังและเลือก
  3. คลิกเส้นแนวนอนสามเส้นในแท็บเมนูที่มุมซ้ายบน
  4. เลือกตัวเลือก "แชร์หรือฝังแผนที่"

คุณสามารถใช้ลิงก์แชร์เพื่อส่งหรือแชร์ลิงก์บนโซเชียลมีเดีย เช่น Facebook หรือ Twitter หรือแพลตฟอร์มอื่นๆ ที่เข้ากันได้
หากต้องการเพิ่มลิงก์ไปยังเว็บไซต์ของคุณ ให้คลิกที่แท็บ "ฝังแผนที่"

  1. ตัดสินใจว่าคุณต้องการให้แผนที่มีขนาดใหญ่เพียงใดในแท็บแบบเลื่อนลงทางซ้ายมือในเมนูป๊อปอัป: เล็ก กลาง ใหญ่ หรือขนาดกำหนดเอง
  2. เลือกตัวเลือก “COPY HTML” แล้ววางลงในส่วน HTML ของเว็บไซต์ของคุณ
  3. คุณสามารถวางแผนที่ได้ทุกที่ที่คุณต้องการบนหน้าเว็บของคุณ อย่างไรก็ตาม การฝังแผนที่แสดงว่าคุณยอมรับที่จะปฏิบัติตามข้อกำหนดในการให้บริการของ Google นอกจากนี้ คุณจะไม่สามารถเข้าถึงคุณลักษณะทั้งหมดของ Google Map ในแผนที่แบบฝัง เช่น ข้อมูลการจราจรแบบสด

บล็อกที่แนะนำ : 20 สุดยอดไอเดียนอกกรอบเพื่อเพิ่มยอดขาย และ SEO คืออะไร? คู่มือเริ่มต้นสำหรับการเพิ่มประสิทธิภาพกลไกค้นหา

การใช้คีย์ API เพื่อฝัง Google Maps

คุณจะต้องมีความเชี่ยวชาญในการเขียนโค้ดจึงจะสามารถใช้วิธีนี้ได้

ขั้นตอนที่ 1: สร้างคีย์ API

  1. ไปที่ส่วน Google Maps ของ Google Cloud Platform
    (คุณจะต้องมี API ที่เปิดใช้งานเมื่อคุณตั้งค่าโครงการ)
  2. ในเมนูด้านซ้ายมือ เลือก "ข้อมูลประจำตัว"
  3. คลิกที่ "+ สร้างข้อมูลรับรอง"
  4. เลือก “คีย์ API” จากเมนู และคัดลอก API ที่ปรากฏ (คุณจะต้องใช้ในภายหลัง)

ขั้นตอนที่ 2: สร้างรหัสเพื่อให้แผนที่ใช้งานได้

  1. ตัดสินใจเกี่ยวกับรหัสการจัดรูปแบบแผนที่สำหรับหน้าเว็บของคุณ
    <style>
    #map { ความกว้าง: 100%;

    ความสูง: 400px;

    พื้นหลังสี: สีเทา;

    }

    </style>

  2. เพิ่มสคริปต์แผนที่ด้วยพิกัดของธุรกิจของคุณ
    <script> ฟังก์ชัน initMap() {

    var macc = {lat: <ละติจูด>, lng: <ลองจิจูด>};

    var map = google.maps.Map ใหม่ (

    document.getElementById('map'), {zoom: 15, center: macc});

    var marker = google.maps.Market ใหม่ ({ตำแหน่ง: macc, แผนที่: map});

    }

    </script>

ขั้นตอนที่ 3: เพิ่มสคริปต์ Google ลงในเอกสาร HTML

  1. เพิ่มคีย์ API ลงใน async ของสคริปต์ด้านล่าง โดยแทนที่ “YOUR_API_KEY”
    <สคริปต์ async
    src=”https://maps.googleapis.com/maps/api/js?key=<YOUR_API_KEY>&callback=initMap”>
    </script>
  2. เพิ่มสคริปต์ลงในเอกสาร HTML เพื่อให้สมบูรณ์

คุณต้องใช้ฟังก์ชัน initMap() เนื่องจาก Google ต้องใช้ฟังก์ชันนี้เพื่อเริ่มต้นและเพิ่มตำแหน่งที่จะโหลดแผนที่ ภายในฟังก์ชันนี้ ควรมีละติจูดและลองจิจูดของตำแหน่ง

เมื่อคุณทำเสร็จแล้ว คุณมีแผนที่ตอบสนองที่พร้อมให้ลูกค้าของคุณใช้

บล็อกที่แนะนำ: วิธีสร้างช่องทางการตลาดเนื้อหาที่แปลงและการเขียนคำโฆษณาคืออะไร วิธีเพิ่มยอดขายด้วยการเขียนคำโฆษณาดิจิทัล

ทำไมต้องฝัง Google Maps ในเว็บไซต์ของคุณ?

บางทีคุณอาจมีจุดประสงค์เฉพาะที่คุณต้องการเพิ่ม Google แผนที่ หากไม่ ต่อไปนี้คือเหตุผลบางประการที่คุณควรฝัง Google Maps บนเว็บไซต์

ค้นหาร้านค้าของคุณ

ธุรกิจในท้องถิ่นทั้งหมดควรให้ความสำคัญกับ Google Maps ที่ฝังอยู่ในเว็บไซต์ของตน ภาพหน้าจอจาก Google Maps มีประโยชน์ แต่ไม่มีที่ใดที่ใกล้เคียงกับระดับรายละเอียดของแผนที่แบบฝังที่ใช้งานได้อย่างสมบูรณ์ ตัวอย่างเช่น ลูกค้าสามารถเลื่อนเพื่อดูว่าร้านค้าของคุณอยู่ห่างจากบ้านของพวกเขาเพียงใด

ความสามารถในการค้นหาร้านค้าของคุณจะเพิ่มจำนวนก้าวเดิน ยอดขาย และผลกำไรในร้านค้าของคุณ เป็นวิธีง่ายๆ ในการเชื่อมโยงตัวตนออนไลน์ของคุณกับธุรกิจในโลกแห่งความเป็นจริง

บล็อกที่แนะนำ: วิธีดึงดูดผู้เข้าชมร้านค้า Shopify ใหม่ แนวคิดกลยุทธ์การรับรู้แบรนด์เพื่อขยายธุรกิจของคุณ และ 5 แนวคิดการตลาดออนไลน์ที่มีประสิทธิภาพสำหรับธุรกิจขนาดเล็ก

เพิ่มมูลค่าให้กับหน้าติดต่อของคุณ

การแสดงที่อยู่เป็นสิ่งหนึ่ง แต่ลูกค้าของคุณจะตรงไปที่ Google Maps และค้นหาเท่านั้น เรามีกฎการตลาด – ลดขั้นตอนที่ลูกค้าต้องดำเนินการ การคลิกหรือการค้นหาที่เพิ่มขึ้นทุกครั้งจะนำไปสู่ลูกค้าที่หายไป

การเพิ่มแอป Google Maps แบบฝัง คุณจะเพิ่มมูลค่าให้กับหน้าติดต่อและประหยัดเวลาของลูกค้าได้ เป็นสิ่งสำคัญหากธุรกิจของคุณอยู่ไกลออกไปเล็กน้อย

สาธิตเส้นทาง

บางธุรกิจออกไปเพื่อช่วยเหลือ หากคุณขายรองเท้าเดินป่าหรือเสื้อวิ่ง บางทีคุณอาจต้องการแนะนำให้ลูกค้าของคุณลองเดินหรือวิ่ง (ทำให้เป็นบล็อกโพสต์ที่ยอดเยี่ยม) ไม่มีวิธีใดที่ดีไปกว่าการแสดงข้อมูลดังกล่าวด้วยเส้นทางที่ไฮไลต์ใน Google แผนที่

บล็อกที่แนะนำ : Digital Marketing คืออะไร? พื้นฐานของดิจิทัลในการตลาด ประโยชน์ของ Google My Business และวิธีค้นหาแผนผังเว็บไซต์สำหรับเว็บไซต์ของฉัน

การเรียนรู้ที่จะฝัง Google ในเว็บไซต์เป็นเรื่องง่าย

มันอาจจะดูน่ากลัวเล็กน้อย แต่ให้อ่านคำแนะนำข้างต้นแบบเป็นขั้นเป็นตอน แล้วคุณจะลงเอยด้วยแผนที่ที่ฝังไว้อย่างสมบูรณ์เพื่อให้ลูกค้าของคุณชื่นชม มีประโยชน์และมีประโยชน์ และยังช่วยส่งเสริมธุรกิจของคุณอีกด้วย คุณควรลองใช้เทคนิค API เพราะมันจะทำให้คุณมีฟังก์ชันการทำงานมากกว่าตัวเลือกอื่นๆ อย่างมาก

แน่นอน หากคุณประสบปัญหา คุณสามารถติดต่อผู้เชี่ยวชาญเพื่อช่วยเหลือได้ตลอดเวลา เรามีประสบการณ์ในการกำหนดค่าเว็บไซต์และการฝัง Google Maps และเรายินดีเป็นอย่างยิ่งที่จะช่วยเหลือ