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

ในบทช่วยสอนนี้เราจะแสดงวิธีเพิ่มการเติมข้อความอัตโนมัติสำหรับช่องที่อยู่บน WordPress โดยใช้ " ที่อยู่ API ของ Google '

สิ่งแรกที่คุณต้องทำคือติดตั้งและเปิดใช้งานปลั๊กอิน " การเติมข้อมูลอัตโนมัติที่อยู่โดยใช้ Google Place Api " สำหรับรายละเอียดเพิ่มเติมโปรดดูคำแนะนำทีละขั้นตอนของเรา วิธีการติดตั้งปลั๊กอิน WordPress.

หลังจากเปิดใช้งานคุณต้องไปที่ตำแหน่ง " การตั้งค่า> Google เติมข้อความอัตโนมัติ เพจเพื่อกำหนดการตั้งค่าปลั๊กอิน

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

ไปที่ " คอนโซลนักพัฒนาซอฟต์แวร์ Google เพื่อสร้างโครงการใหม่

หน้าต่างจะปรากฏขึ้นเพื่อขอให้คุณระบุชื่อโครงการของคุณ ใช้ชื่อที่จะช่วยคุณระบุโครงการในภายหลังจากนั้นคลิกปุ่ม "สร้าง"

ป๊อปอัปจะหายไปรอสักครู่และคุณจะถูกเปลี่ยนเส้นทางโดยอัตโนมัติไปยังโครงการใหม่ของคุณ

ตอนนี้คุณจะเห็นรายการของ Google API ที่คุณสามารถเปิดใช้งานสำหรับโครงการของคุณ คุณต้องค้นหาและคลิกที่ " บริการเว็บ Google Places API '

ซึ่งจะนำคุณไปยังหน้าตัวอย่างที่อธิบายวิธีการทำงานของ API นี้ คุณต้องคลิกที่ลิงค์“ เปิดใช้งาน” เพื่อดำเนินการต่อ

คอนโซลนักพัฒนาซอฟต์แวร์เปิดใช้งาน Google APIs สถานที่สำหรับโครงการของคุณ

อย่างไรก็ตามคุณยังคงต้องมีข้อมูลรับรองเพื่อใช้ API บนไซต์ของคุณ คลิกที่ปุ่มสร้างข้อมูลรับรองเพื่อดำเนินการต่อ

ในหน้าจอถัดไปคุณต้องคลิกที่ปุ่ม "ฉันต้องการข้อมูลรับรองอะไร"

Developer Console จะแสดงรหัส API ให้คุณ คุณต้องคัดลอกคีย์นี้และวางลงในการตั้งค่าบนไซต์ WordPress ของคุณ

คุณต้องเปิดใช้งานคีย์ API อื่นในโครงการ Google Developers ของคุณเสมอ คลิกไลบรารีในคอนโซลนักพัฒนาซอฟต์แวร์ของ Google แล้วคลิก " Google แผนที่ JavaScript API '

การดำเนินการนี้จะนำคุณไปยังหน้า "ภาพรวม API" ซึ่งคุณต้องคลิกลิงก์ "เปิดใช้งาน" เพื่อดำเนินการต่อ

API นี้ไม่จำเป็นต้องมีคีย์ API เพิ่มเติมดังนั้นคุณพร้อมที่จะดำเนินการต่อแล้ว

วิธีเปิดใช้งานการเติมข้อความอัตโนมัติในเขตข้อมูลฟอร์ม

คุณสามารถเพิ่มฟังก์ชันการเติมข้อความอัตโนมัติให้กับฟิลด์ที่สร้างโดยปลั๊กอินการสร้างแบบฟอร์ม

เราจะใช้ WPForms ในบทช่วยสอนนี้ อย่างไรก็ตามปลั๊กอินนี้สามารถทำงานร่วมกับปลั๊กอินการสร้างรูปแบบใดก็ได้

ก่อนอื่นคุณต้องสร้างแบบฟอร์มที่มีฟิลด์ที่อยู่หรือชุดของฟิลด์ที่อยู่

เมื่อเสร็จแล้วให้เพิ่มแบบฟอร์มนี้ในเว็บไซต์ของคุณตามปกติ

จากนั้นไปที่บทความหรือหน้าเว็บที่คุณเพิ่มฟอร์ม คุณต้องคลิกขวาที่ฟิลด์และเลือก "ตรวจสอบ" จากเมนูเบราว์เซอร์

คุณจะเห็นชื่อ ID และค่าของคลาส CSS สำหรับฟิลด์ที่อยู่

ตัวอย่างเช่นในการจับนี้ชื่อแอตทริบิวต์ " wpforms [สาขา] [9] [address1] ค่า ID คือ " wpforms-352-field_9 และคลาส css คือ " wpforms สนามอยู่-address1 '

คุณต้องคัดลอกหนึ่งในค่าเหล่านี้เท่านั้นและวางลงในหน้าการตั้งค่าปลั๊กอิน

หากคุณต้องการกำหนดเป้าหมายหลายฟิลด์ในหลายรูปแบบคุณสามารถเพิ่มเครื่องหมายจุลภาคและเพิ่มค่าอื่น ๆ

อย่าลืมคลิกที่ปุ่ม« Enregistrer เพื่อบันทึกการเปลี่ยนแปลงของคุณ

ตอนนี้คุณสามารถไปที่หน้าแบบฟอร์มและลองป้อนที่อยู่ ช่องแบบฟอร์มจะเริ่มแสดงคำแนะนำโดยใช้ Google สถานที่และ Google แผนที่

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