ต้องหาวิธีเพิ่ม Google แผนที่ไปยัง WordPress ด้วย JetElements?

มีปลั๊กอินมากมายที่คุณสามารถใช้เพิ่มได้ Google แผนที่ของคุณ เว็บไซต์ WordPress JetElements เป็นหนึ่งเดียว JetElements เป็นส่วนเสริม Elementor ระดับพรีเมียมที่พัฒนาโดย Crocoblock มันเพิ่มวิดเจ็ตเพิ่มเติมให้กับคุณ Elementorรวมถึงแผนที่ขั้นสูงที่คุณสามารถใช้เพื่อเพิ่มได้อย่างง่ายดาย Google แผนที่ไปยังไซต์ WordPress ของคุณ

คุณสามารถเลือกรูปแบบแผนที่ได้ 10 แบบ คุณยังสามารถเพิ่มพินได้หลายอัน

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

ก่อนที่คุณจะเริ่ม ตรวจสอบให้แน่ใจว่าคุณได้ติดตั้งแล้ว Elementor และ JetEements บน WordPress ของคุณ คุณสามารถใช้เวอร์ชันฟรีของElementor เพื่อใช้ JetElements ในขณะที่ JetElements คุณต้องได้รับมันจากมัน เว็บไซต์อย่างเป็นทางการ ราคา $19

ขั้นตอนที่ 1: รับรหัส Google Maps API

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

เมื่อเข้าสู่ระบบแล้ว ให้สร้างโครงการใหม่โดยคลิกที่เมนูแบบเลื่อนลงที่ด้านบนแล้วคลิก โครงการใหม่.

ตั้งชื่อโครงการของคุณและคลิกที่ปุ่ม CREATE.

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

เพิ่ม Google Maps ลงใน WordPress ด้วย JetElements

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

  • API การเข้ารหัสทางภูมิศาสตร์
  • แผนที่ JavaScript API

Google เองแบ่ง Google Maps API ออกเป็น 17 ประเภท คุณสามารถดูได้โดยคลิก แสดงทั้งหมด ในส่วน แผนที่.

ในการเปิดใช้งาน API ให้เลือก API ที่คุณต้องการเปิดใช้งาน (โดยคลิกที่มัน) และคลิกที่ปุ่ม เปิดใช้งาน.

เมื่อคุณเปิดใช้งาน API ที่จำเป็นเสร็จแล้ว ให้กลับไปที่แดชบอร์ดหลักของคอนโซล Google API แล้วคลิก ตัวบ่งชี้ ที่แผงด้านซ้าย คลิกที่ปุ่ม สร้างข้อมูลรับรอง และเลือก รหัส API. คัดลอกคีย์ API บนป๊อปอัปที่ปรากฏขึ้น

จากนั้น ลงชื่อเข้าใช้แดชบอร์ด WordPress ของคุณแล้วไปที่เมนู JetPlugins -> JetElements การตั้งค่า.

เพิ่ม Google Maps ลงใน WordPress ด้วย JetElements

เปิดแท็บ การผสานรวม และวางคีย์ API ที่คุณเพิ่งคัดลอกลงในฟิลด์ รหัส Google แผนที่ API

เริ่มเพิ่มแผนที่

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

เพิ่ม Google Maps ลงใน WordPress ด้วย JetElements

คุณสามารถไปที่แผงด้านซ้ายเพื่อปรับเปลี่ยนการตั้งค่าบางอย่างในแผนที่ของคุณ คุณสามารถทำการตั้งค่าได้จากส่วน การตั้งค่าแผนที่.

หากต้องการเปลี่ยนรูปแบบแผนที่ คุณสามารถเปิดส่วนนี้ได้ รูปแบบแผนที่.

เพิ่ม Google Maps ลงใน WordPress ด้วย JetElements

เพิ่มตำแหน่งของคุณลงในแผนที่

ตามค่าเริ่มต้น ที่อยู่พินจะถูกตั้งค่าเป็นลอนดอนอาย ลอนดอน สหราชอาณาจักร คุณสามารถแก้ไขเพื่อเพิ่มที่ตั้งธุรกิจของคุณได้

เมื่อต้องการทำเช่นนี้ ให้เปิดส่วน Pins และคลิกที่อยู่พินที่มีอยู่ วางที่อยู่ธุรกิจของคุณในช่อง ที่อยู่พิน และแก้ไขคำอธิบายในช่อง คำอธิบายพิน.

เพิ่ม Google Maps ลงใน WordPress ด้วย JetElements

ในการทำให้ที่อยู่พินที่คุณเพิ่งตั้งค่าไว้ปรากฏบนแผนที่ คุณต้องตั้งค่ากึ่งกลางของแผนที่ ตัวอย่างเช่น หากสถานที่ตั้งธุรกิจของคุณอยู่ในปารีส คุณจะต้องตั้งค่าศูนย์กลางของแผนที่เป็นปารีส

หากต้องการกำหนดศูนย์กลางของแผนที่ ให้เปิดส่วนนั้น  การตั้งค่าแผนที่ พิมพ์ศูนย์กลางแผนที่ที่คุณต้องการ (ชื่อเมือง) อีกครั้ง

เพิ่ม Google Maps ลงใน WordPress ด้วย JetElements

Remarque: หากคุณเห็นข้อความ 'เพื่อวัตถุประสงค์ในการพัฒนาเท่านั้น' เมื่อเพิ่มบัตร อย่าลืมเปิดใช้งานการเรียกเก็บเงินของ Google Cloud นโยบายใหม่ของ Google กำหนดให้นักพัฒนาเปิดใช้งานบัญชีสำหรับการเรียกเก็บเงิน (คุณยังคงสามารถใช้ Google Maps API ได้ฟรี)

รับ Elementor Pro ทันที!!!

สรุป

ดังนั้น ! สำหรับบทความนี้จะแสดงวิธีเพิ่ม Google Maps ลงใน WordPress ด้วย JetElements หากคุณมีข้อสงสัยเกี่ยวกับวิธีการเดินทาง โปรดแจ้งให้พวกเขาทราบใน ความเห็น.

อย่างไรก็ตามคุณสามารถปรึกษาได้ ทรัพยากรของเราหากคุณต้องการองค์ประกอบเพิ่มเติมเพื่อดำเนินโครงการสร้างเว็บไซต์อินเทอร์เน็ตของคุณโดยปรึกษากับเราใน การสร้างบล็อก WordPress หรือที่อยู่บน Divi: ธีม WordPress ที่ดีที่สุดตลอดกาล.

แต่ในขณะเดียวกัน แบ่งปันบทความนี้ในเครือข่ายโซเชียลต่าง ๆ ของคุณ.

...