الدليل الكامل: كيفية تضمين خرائط Google في WordPress

كيفية تضمين موقع واحد على خرائط Google في WordPress

لنبدأ بالطريقة الأساسية لإظهار موقع خرائط Google على موقع WordPress الخاص بك. إذا كنت ترغب فقط في تضمين خريطة بموقع واحد أو عرض واحد ، فلن تحتاج إلى أي أدوات أو مكونات إضافية رائعة - كل ما تحتاجه هو لصق رمز تضمين خرائط Google في موقع WordPress الخاص بك .

إليك كيف يعمل كل شيء:

انتقل إلى موقع خرائط Google كالمعتاد وابحث عن الموقع الذي تريد تضمينه. يمكنك البحث عن أي شيء. إنه:

• بلد بأكمله
• مدينة محددة
• عمل محدد
• سمها ما شئت

لا يهم حقا!

بمجرد حصولك على الموقع الذي تريد عرضه على خريطتك ، ابحث عن الزر " مشاركة " في الشريط الجانبي الأيسر:

يجب أن ترى نافذة منبثقة صغيرة تظهر. انقر فوق خيار تضمين الخريطة في تلك النافذة المنبثقة:

ثم اختر الحجم الذي تريده من القائمة المنسدلة. وبمجرد تحديد الحجم الذي تريده ، انسخ الرمز الموجود في المربع:

الآن ، توجه إلى منشور WordPress أو الصفحة حيث تريد تضمين مربع خرائط Google.

في محرر WordPress ، قم بالتبديل إلى علامة التبويب "نص" والصق الرمز الذي نسخته من خرائط Google في المكان الذي تريد ظهور خريطتك فيه:

الآن ، انشر رسالتك كالمعتاد ويجب أن ترى مربع خرائط Google في الواجهة الأمامية لموقع WordPress الخاص بك:

سهل بما فيه الكفاية ، أليس كذلك؟

يمكنك أيضًا استخدام طريقة مماثلة لتضمين اتجاهات خرائط Google في WordPress. الاختلاف الوحيد هو واجهة البداية. بدلاً من رؤية زر المشاركة على الفور ، ستحتاج إلى النقر فوق رمز الهامبرغر واختيار خيار مشاركة الخريطة أو تضمينها :

كيفية تضمين خرائط Google مع علامات الموقع المتعددة في WordPress

إذا كنت ترغب في تضمين مربع خرائط Google مع علامات موقع متعددة في WordPress ، فإن الأشياء مختلفة قليلاً.

بينما سأعرض لك اثنين من المكونات الإضافية لخرائط Google ووردبريس لمساعدتك على تحقيق ذلك في القسم التالي ، فأنت لست بحاجة فعلاً إلى مكون إضافي للقيام بذلك .

بدلاً من ذلك ، يمكنك إنشاء خريطتك الخاصة باستخدام خرائطي على Google ثم تضمين تلك الخريطة في WordPress باستخدام طريقة مماثلة لتلك الموضحة أعلاه.

للبدء ، توجه إلى Google My Maps وانقر فوق Get Started لبدء تشغيل الواجهة. في الواجهة ، انقر على خيار إنشاء خريطة جديدة :

ثم استخدم الواجهة لبناء خريطتك. قد يكون البدء صعبًا بعض الشيء - ولكن بمجرد أن تتعطل الأمور ، يصبح من السهل جدًا استخدامها. يمكنك البحث عن الأشياء باستخدام مربع البحث ، ويمكنك إضافة محددات على الخريطة باستخدام الزر " علامة ":

بمجرد أن تصبح راضيًا عن خريطتك ، انقر فوق أيقونة Three Dot في الجزء العلوي وحدد Embed on my site .

بعد ذلك ، تمامًا كما كان من قبل ، يمكنك لصق الرمز الذي توفره لك خرائط Google في علامة التبويب Text في محرر WordPress لعرض الخريطة على موقع WordPress الخاص بك.

إضافات WordPress لمساعدتك على العمل مع خرائط Google بشكل أكبر

على الرغم من أنك لا تحتاج حقًا إلى مكون إضافي للتعامل مع تضمين خرائط Google الأساسي كما أوضحت لك أعلاه ، يمكن أن تكون المكونات الإضافية مفيدة إذا كنت تريد المزيد من المرونة (أو إذا كنت تريد طريقة أكثر سهولة في الاستخدام لتنفيذ هذه المرونة).

لا تفعل معظم المكونات الإضافية حقًا أي شيء لا يمكنك فعله بمفردك بما يكفي من شحم الكوع - لكنها تجعل الأمر أسهل كثيرًا وأكثر سهولة في الاستخدام. إليك بعض المكونات الإضافية الأنيقة لمساعدتك على العمل بشكل أفضل مع خرائط Google.

الفسفور الابيض خرائط جوجل

WP Google Maps هو البرنامج الإضافي المجاني الأكثر شيوعًا لخرائط Google في دليل البرنامج المساعد WordPress.org.

يساعدك على إنشاء شاشات خرائط Google المخصصة الخاصة بك باستخدام علامات الخريطة التي تختارها وموضوعات خرائط مختلفة. في الأساس ، إنه تطبيق أكثر سهولة في الاستخدام للعملية التي أشرت إليها للتو أعلاه.

الجانب السلبي الوحيد هو أن الإصدار المجاني يتيح لك فقط إنشاء خريطة واحدة. إذا كنت بحاجة إلى خرائط متعددة ، فستحتاج إما إلى شراء الإصدار المتميز أو استخدام حل مختلف.

للبدء ، قم بتثبيت وتنشيط خرائط جوجل الفسفور الابيض. نظرًا لأنه مدرج في WordPress.org ، يمكنك القيام بذلك مباشرة من لوحة معلومات WordPress الخاصة بك.

بمجرد تنشيطه ، انتقل إلى خيار الخرائط الجديد في الشريط الجانبي للبدء.

قبل أن تتمكن من إنشاء خريطتك الأولى ، ستحتاج إلى الحصول على مفتاح API لخرائط Google JavaScript وإدخاله في إعدادات المكون الإضافي. يمكنك القيام بذلك باتباع التعليمات التالية:

بمجرد إدخال مفتاح API الخاص بك ، يمكنك تحرير خريطتي الأولى الافتراضية ( تذكر - يتيح لك الإصدار المجاني من هذا المكون الإضافي إنشاء خريطة واحدة فقط ):

استخدم الواجهة لبناء خريطتك. بعد ذلك ، عند الانتهاء ، يمكنك تضمينه في أي مكان على موقعك باستخدام الرمز القصير:

إنه سهل ومرن للغاية - الجانب السلبي الوحيد هو قيود الخريطة الواحدة في الإصدار المجاني.

منشئ الخرائط

يعد Maps Builder خيارًا جيدًا آخر لإنشاء تضمين خرائط Google باستخدام مكون WordPress الإضافي.

بمجرد تثبيت البرنامج المساعد وتنشيطه ، ستحصل على علامة تبويب خرائط Google جديدة في الشريط الجانبي للوحة القيادة. كما هو الحال مع WP Google Maps ، ستحتاج إلى إضافة مفتاح API لخرائط Google قبل أن تتمكن من البدء في البرنامج المساعد.

بمجرد القيام بذلك ، يمكنك الانتقال إلى خرائط Google ← إضافة جديد لإنشاء خريطة جديدة. في تلك الواجهة ، انقر فوق الزر Open Map Builder لبدء تشغيل الواجهة سهلة الاستخدام:

هناك ، يمكنك إنشاء خريطتك باستخدام الشريط الجانبي للمكون الإضافي:

بمجرد الانتهاء ، يمكنك استخدام الرمز المختصر الذي تم إنشاؤه بواسطة المكون الإضافي لتضمين الخريطة في أي مكان على موقع WordPress الخاص بك.

WP Store Locator

إذا كنت ترغب على وجه التحديد في استخدام خرائط Google لعرض مواقع متاجر متعددة على موقع WordPress الخاص بك ( رغبة مشتركة! ) ، فقد يكون من الأفضل لك استخدام مكون إضافي محدد موقع المتجر.

بينما يمكنك العثور على العديد من المكونات الإضافية للقيام بذلك ، فأنا أحب WP Store Locator لأنه مرن ويبدو رائعًا.

استخدم وحدة خرائط Google لمنشئ الصفحة المفضلة لديك

يتضمن معظم منشئي صفحات WordPress عنصرًا / وحدة خرائط Google مخصصة لمساعدتك على تضمين محتوى خرائط Google في تصميماتك.

على سبيل المثال ، يشتمل المكون الإضافي Divi Builder الشهير على وحدة خرائط Google التي يمكنك تخصيصها قليلاً عبر واجهة البرنامج المساعد:

لذلك إذا كنت تستخدم بالفعل مُنشئ الصفحات ، فتحقق لمعرفة ما إذا كان مُنشئ الصفحة الخاص بك يحتوي على أداة خرائط Google قبل أن تبدأ بالركض للعثور على مكون إضافي مخصص لخرائط Google ،

قرص ممتع للمستخدمين المتقدمين

هذه الطريقة متقدمة وتتطلب معرفة بالكود - لذلك إذا كنت مبتدئًا ، فلا تتردد في تجاهل ذلك.

ولكن إذا كنت تعرف طريقك حول WordPress والحقول المخصصة ، فيمكنك استخدام حقل مخصص لإنشاء خريطة تلقائيًا استنادًا إلى مخطط عناوين URL لخرائط Google.

على سبيل المثال ، يمكنك إنشاء حقل على الواجهة الخلفية لـ WordPress حيث يحتاج المستخدم فقط إلى لصق العنوان في الموقع.

بعد ذلك ، مع القليل من المعالجة المسبقة لإزالة المسافات ، يمكنك إدراج هذا العنوان في شيء مثل أدناه في iframe في ملفات قالب القالب الخاص بك:

وفويلا! كل ما يحتاجه المستخدم هو إدخال عنوان في محرر WordPress وسيظهر تضمين خرائط Google تلقائيًا في الواجهة الأمامية لهذا الموقع.

مرة أخرى - تتطلب هذه الطريقة بالتأكيد معرفة أساسية بـ PHP والحقول المخصصة - لكنها اختراق رائع لتوفير بعض الوقت.

التفاف الأشياء

سواء كنت ترغب فقط في القيام بشيء أساسي مثل تضمين موقع خرائط Google عادي في WordPress أو الحصول على مزيد من التقدم باستخدام علامات الخريطة المتعددة أو إنشاء الخرائط تلقائيًا ، فلديك الكثير من الخيارات.

لتضمين خرائط فردية ، يمكنك على الأرجح تخطي المكونات الإضافية واستخدام كود التضمين العادي لخرائط Google. ولكن إذا كنت ترغب في إنشاء خرائط بمواقع متعددة ولديك تحكم سهل في التصميم ، فإن المكونين الإضافيين لخرائط Google هما خياران جيدان.

وأخيرًا ، إذا كنت تستخدم أداة إنشاء الصفحات ، فيجب عليك بالتأكيد التحقق لمعرفة ما إذا كان لديك بالفعل عنصر خرائط Google قبل أن تتحول إلى حل خارجي.