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

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

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

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

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

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

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

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

4. ในกล่องโต้ตอบให้คลิกแท็บฝังแผนที่  
5. คลิกเมนูแบบเลื่อนลงขนาด แผนที่และเลือก ขนาด 
6. คลิกคัดลอก HTML เพื่อคัดลอกโค้ดฝังแผนที่

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

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

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

7. หากต้องการเผยแพร่การเปลี่ยนแปลงให้คลิกเผยแพร่หรืออัปเดตที่ด้านบนขวา

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

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

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

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

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

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

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

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

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

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

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

6. ที่ด้านบนขวาให้คลิกเผยแพร่การเปลี่ยนแปลง
7. เพิ่ม Google Map ในโมดูลข้อความสมบูรณ์ต่อไป