ข้ามไปที่เนื้อหา
โปรดทราบ:: บทความนี้จัดทำขึ้นเพื่อความสะดวกของคุณ ได้รับการแปลโดยอัตโนมัติโดยใช้ซอฟต์แวร์การแปลและอาจไม่ได้รับการพิสูจน์อักษร บทความฉบับภาษาอังกฤษนี้ควรถือเป็นฉบับทางการที่คุณสามารถค้นหาข้อมูลล่าสุดได้มากที่สุด คุณสามารถเข้าถึงได้ที่นี่

เพิ่ม Google Map ไปยังเนื้อหา HubSpot

อัปเดตล่าสุด: 25 กุมภาพันธ์ 2026

สามารถใช้ได้กับการสมัครใช้บริการใดๆ ต่อไปนี้ ยกเว้นที่ระบุไว้:

เพิ่ม Google Map แบบโต้ตอบไปยังเนื้อหา HubSpot โดยคัดลอกโค้ดฝังของแผนที่และแทรกลงในโมดูลข้อความที่สมบูรณ์ วิธีนี้ทำงานในตัวแก้ไขเนื้อหาและในเทมเพลตที่รองรับโมดูลข้อความแบบสมบูรณ์ 

ก่อนที่คุณจะเริ่มต้น

ก่อนที่จะเพิ่ม Google Map ลงในเนื้อหา HubSpot ของคุณให้ตรวจสอบข้อกำหนดและข้อควรพิจารณาต่อไปนี้ 

ต้องได้รับสิทธิ์​ ต้องได้รับอนุญาตดังต่อไปนี้:

ทำความเข้าใจข้อจำกัดและข้อพิจารณา

  • Google Maps แบบฝังได้รับการจัดการโดย Google พฤติกรรมการแสดงผลสไตล์และฟังก์ชันการทำงานขึ้นอยู่กับการตั้งค่าการฝังของ Google 

รับโค้ดฝังของ Google Map

  1. ไปที่ Google Maps
  2. ในแถบค้นหาให้ป้อนที่ อยู่ 
  3. คลิกแชร์ที่พักของที่อยู่

Google Maps is displayed for an address and an arrow points to the Share button.

  1. ในกล่องโต้ตอบให้คลิกแท็บฝังแผนที่  
  2. คลิกเมนูแบบเลื่อนลงขนาด แผนที่และเลือก ขนาด 
  3. คลิกคัดลอก HTML เพื่อคัดลอกโค้ดฝังแผนที่
A dialog box is displayed on Google Maps for the Embed a map tab. An arrow points to the map size and a box is placed around the Copy HTML hyperlinked text.

เพิ่ม Google Map ในเครื่องมือแก้ไขเนื้อหา 

  1. ไปที่เนื้อหาของคุณ:

  2. คลิกที่ชื่อเนื้อหาของคุณ 
  3. ในเครื่องมือแก้ไขเนื้อหาให้คลิกไอคอนadd เพิ่มในแถบด้านซ้าย 
  4. คลิกเพื่อขยายส่วนข้อความจากนั้นคลิกโมดูล Rich Text แล้วลากไปยังตำแหน่ง
  5. ในแถบเครื่องมือ Rich Text ให้คลิกเมนูแบบเลื่อนลงขั้นสูงแล้วเลือกซอร์สโค้ด 
  6. ในกล่องโต้ตอบให้วางรหัสการฝังแผนที่จากนั้นคลิก บันทึก 
  7. หากต้องการเผยแพร่การเปลี่ยนแปลงให้คลิกเผยแพร่หรืออัปเดตที่ด้านบนขวา

เพิ่ม Google Map ลงในเทมเพลต

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

เพิ่มโมดูลข้อความสมบูรณ์ลงในเทมเพลตการลากและวาง

เพิ่มโมดูลข้อความสมบูรณ์ลงในเทมเพลตการลากและวางเพื่อให้สามารถเพิ่ม Google Map ในตัวแก้ไขเนื้อหาได้ เรียนรู้เพิ่มเติมเกี่ยวกับการใช้โมดูลในเทมเพลตแบบลากและวาง 

  1. ไปที่เนื้อหาของคุณ:

  2. คลิกที่ชื่อเนื้อหาของคุณ 
  3. คลิกเมนูการตั้งค่าแล้วเลือก เทมเพลต 
  4. คลิกแก้ไขเทมเพลตนี้ ระบบจะนำคุณไปยังผู้จัดการฝ่ายออกแบบ
  5. คลิก เพิ่ม ผู้ตรวจสอบ 
  6. ในแถบค้นหาให้ป้อนข้อความที่สมบูรณ์ 

In the design manager, a drag and drop template is displayed. An arrow points to the Search field in the Add tab. The Search field contains 'rich text' as the search term.

  1. คลิกโมดูลข้อความแบบสมบูรณ์และลากไปยังตำแหน่งบนเทมเพลตของคุณ 
  2. ที่ด้านบนขวาให้คลิกเผยแพร่การเปลี่ยนแปลง
  3. เพิ่ม Google Map ในเครื่องมือแก้ไขเนื้อหาต่อไป

เพิ่มโมดูลข้อความสมบูรณ์ลงในเทมเพลตที่มีรหัส

เพิ่มโมดูลข้อความสมบูรณ์ลงในเทมเพลตที่มีรหัสเพื่อให้สามารถเพิ่ม Google Map ในตัวแก้ไขเนื้อหาได้ เรียนรู้เพิ่มเติมเกี่ยวกับการใช้โมดูลในเทมเพลตรหัส 

  1. ไปที่เนื้อหาของคุณ:
  2. คลิกที่ชื่อเนื้อหาของคุณ
  3. คลิกเมนูการตั้งค่าแล้วเลือก เทมเพลต
  4. คลิกแก้ไขเทมเพลตนี้
  5. ในเครื่องมือแก้ไขโค้ดให้เพิ่มโมดูล Rich text ที่แผนที่ควรปรากฏตัวอย่างเช่น:

{% module
"map_embed"
path="@hubspot/rich_text"
label="Google Map" %}

  1. ที่ด้านบนขวาให้คลิกเผยแพร่การเปลี่ยนแปลง
  2. เพิ่ม Google Map ในโมดูลข้อความสมบูรณ์ต่อไป
บทความนี้มีประโยชน์หรือไม่
แบบฟอร์มนี้ใช้สำหรับคำติชมเอกสารเท่านั้น เรียนรู้วิธีขอความช่วยเหลือจาก HubSpot