قبل عدة أيام اتصل بي صاحب متجر يقدم خدمة التوصيل إلى المنزل، وأخبرني أنه وموظفو التوصيل في متجره يعانون من صعوبة في معرفة مكان العميل بدقة موضحًا لي أن الكثير من الطلبات تتأخر أو تفشل بسبب العناوين الوصفية غير الواضحة وافتقار بعض المناطق لرموز بريدية دقيقة، الأمر الذي يسبب إحباطًا للعملاء وهدرًا لوقت الموظفين.
ولذلك اقترحت عليه حلًا قويًا لإنهاء هذه المشكلة، يعتمد على دمج خريطة تفاعلية في صفحة إتمام الطلب (Checkout) باستخدام إضافة Kikote وخرائط جوجل، بحيث تتيح للعميل تحديد موقعه الجغرافي بدقة على الخريطة، وهنا أشارككم تجربتي والخطوات التقنية الصحيحة لعمل هذا المتجر في ووكومرس.
تنصيب إضافة Kikote
بعد مراجعة عدة حلول لإضافة خريطة في ووردبريس، وقع اختياري على Kikote لأنها متكاملة بشكل جيد مع ووكومرس، وبسبب سهولة إعدادها.
لذلك في لوحة تحكم ووردبريس توجهت إلى إضافات > Add Plugin، ثم أدخلت اسم الإضافة في حقل البحث، ونقرت على زر التنصيب الآن (Install Now) الخاص بها، ثم فعلتها بالنقر على زر التفعيل.
اقرأ أيضًا: تضمين خريطة نشاطك التجاري لموقعك باستخدام إضافة WP Google Map
إعداد مفتاح Google Maps API
تحتاج الإضافة إلى مفتاح Google Maps API لتتمكن من إظهار خرائط جوجل في الموقع، وللحصول على هذا المفتاح توجهت إلى منصة Google Cloud Console، ثم سجلت الدخول إلى لوحة التحكم حتى وصلت إلى هذه الصفحة.
بعد ذلك أنشأت مشروعًا جديدًا بالنقر على زر المشاريع، ثم النقر على زر New project.
ثم أدخلت اسم المشروع الذي أريد إنشاءه في حقل Project name، ونقرت على زر Create.
وبعد ذلك توجهت إلى APIs & Services ثم Library.
وبحثت عن مكتبة Maps JavaScript API التي تعرض الخريطة التفاعلية، وذلك عبر إدخال اسمها في حقل البحث، ثم فعلتها عبر النقر على زر Enable الخاص بها.
ونفس الشيء فعلت مع مكتبة Places API التي تقوم بتفعيل الإكمال التلقائي عند كتابة العنوان، ومكتبة Geocoding API التي تقوم بتحويل الإحداثيات إلى نص مقروء (المدينة والشارع).
وبعد ذلك توجهت إلى APIs & Services ثم Credentials.
ثم نقرت على زر API key من قائمة Create Credentials.
وبعد ذلك أدخلت اسم المفتاح في حقل Name، ونقرت على زر Create.
فتم إنشاء مفتاح API وظهر ضمن حقل خاص به، فنسخته واحتفظت به في مكان آمن.
ضبط إعدادات إضافة Kikote في ووكومرس
بعد أن حصلت على مفتاح API، توجهت إلى لوحة تحكم ووردبريس ثم إلى WooCommerce > الإعدادات، ثم إلى تبويب محدد الموقع الجغرافي في صفحة إتمام الطلب، وأدخلت مفتاح API في حقل مفتاح API لخرائط Google، ثم نقرت على زر حفظ التغييرات في الأسفل.
كيفية ظهور الخريطة في الواجهة الأمامية
بذلك عندما يقوم العميل بإضافة المنتجات إلى سلة التسوق وينتقل إلى صفحة إتمام الطلب، سيجد خريطة تفاعلية تتيح له اختيار موقعه على الخريطة عبر النقر المزدوج على موقعه الجغرافي أو بالنقر على زر الحصول على الموقع الحالي لتحديد الموقع عبر GPS، وسيتم ملء حقول الموقع تلقائيًا بالبيانات الصحيحة.
عرض الموقع في طلبات ووكومرس
ستضاف تفاصيل الموقع تلقائيًا إلى طلب ووكومرس بعد إتمامه، وسيجد مسؤول المتجر زرًا جديدًا يمكن بالنقر عليه عرض الموقع المختار ضمن خرائط جوجل عبر رابط، حيث يمكن تزويد مندوب التوصيل به ليفتحه عبر تطبيق Google Maps.
بهذه الطريقة أنتهيت للعميل مشكلة ضياع المندوبين وتأخر طلبات التسليم، وبعد فترة تواصلت مع صاحب المتجر وأخبرني أن هذه الطريقة كانت حلًا جذريًا لمشكلته، لذلك إذا كنت تقدم خدمة التوصيل إلى المنزل في متجرك، فإن الحل الاحترافي هو بإضافة خريطة تفاعلية توفر وقتك ووقت موظفيك وتمنح عملاءك تجربة شراء احترافية.
