اضافه کردن نقشه گوگل در وردپرس

در این آموزش قصد داریم به اضافه کردن نقشه گوگل در وردپرس بپردازیم.

وقتی به گذشته نگاه می کنیم می بینیم که برای رسیدن به جایی که قبلا هرگز به آنجا نرفته بودم مجبور بودیم از دیگران سوال کنیم. اما اکنون به لطف اینترنت و گوگل پیدا کردن یک مکان از طریق موبایل و کامپیوتر راحت تر شده و ما اکنون می توانیم بدون اینکه از کسی سوال کنیم به مکان مورد نظر خودمان برسیم. گاهی نیز می خواهیم نقشه مورد نظر خود را در اختیار دیگران قرار دهیم تا آنها نیز بتوانند مکان مورد نظر ما را بیابند.

در این مقاله قصد داریم به شما نحوه جانمایی نقشه گوگل در وردپرس را آموزش دهیم.

در ادامه این آموزش با ما همراه باشید.

با این سه روش نقشه گوگل را در وردپرس اضافه کنید

فرض کنید می خواهید یک نمایشگاه ترتیب دهید و قصد دارید موقعیت مکانی آن را در وب سایت خود قرار دهید. برای این کار باید نقشه گوگل در وردپرس را به کمک خدمات نقشه گوگل اضافه کنید. اضافه کردن نقشه گوگل در وردپرس یه سه روش انجام می شود”

  • قراردادن نقشه گوگل در سایت
  • استفاده از کلید Api جاوا اسکریپت (Java script IPA key)
  • استفاده از پلاگین وردپرس

قرار دادن نقشه گوگل با استفاده از Embedded

گام اول :

به مرورگر وب سایت خود رفته و عبارت www.maps.google.com را تایپ کنید.پس از ورود به این لینک با صفحه ای مثل صفحه زیر رو به رو می شوید.

قرار دادن نقشه گوگل با استفاده از Embedded

اکنون مکان مورد نظر خود را سرچ کنید. به عنوان مثال، می خواهید نمایشگاه خود را در “Fresno City Theatre” قرار دهید. اکنون باید  نام این مکان را در فیلد مورد قرمز رنگ کپی پیست کنید. بعد از آن دکمه سرچ را بزنید تا محل مورد نظر روی نقشه نشان داده شود.

قرار دادن نقشه گوگل با استفاده از Embedded

قرار دادن نقشه گوگل با استفاده از Embedded

این نقشه ای است که باید آن را در وردپرس قرار دهید .

گام دوم :

 دکمه Share را مانند شکل انتخاب کنید.

قرار دادن نقشه گوگل با استفاده از Embedded

در این هنگام صفحه زیر برایتان نمایش داده می شود.

قرار دادن نقشه گوگل با استفاده از Embedded

بر روی گزینه Embed a map کلیک کنید.

قرار دادن نقشه گوگل با استفاده از Embedded

حال تگ Iframe  را کپی کنید.

گام سوم :

 اکنون باید نقشه گوگل را در وردپرس جانمایی کنیم.

قرار دادن نقشه گوگل با استفاده از Embedded

اکنون می توانید آن را به صورت draft  ذخیره و منتشر  کنید.

نکته: ممکن است پس از فشار دکمه draft  و یا publish ، کد آن در وردپرس به صورت shortcut عمل کند.

قرار دادن نقشه گوگل با استفاده از Embedded

چگونگی نمایش نقشه گوگل

اگر دکمه preview را بزنید نقشه گوگل در وردپرس شما به صورت زیر نمایش داده می شود:

چگونگی نمایش نقشه گوگل

یک نکته مثبت این است که کاربر با تکان دادن موس بر روی نقشه، می تواند آن را به کمک دکمه Ctrl و Scroll موس بزرگنمایی کند.

چگونگی نمایش نقشه گوگل

این روش اول اضافه کردن نقشه گوگل در وردپرس بود.

 

ایجاد نقشه دلخواه

اگر شما می خواهید موقعیت مکانی مد نظر خود را در گوگل مپ نشان دهید نگران نباشید. گوگل مپ یه شما امکان می دهد نقشه خود را ایجاد کنید.

گام اول: به لینک My Maps بروید. اکنون می توانید نقشه جدید خود را طراحی کنید. اگر نقشه ای طراحی کرده اید باید ان را از حالت خصوصی یه حالت عمومی در آورید تا برای همه قابل رویت باشد. برای این کار بر روی دکمه share کلیک کنید.

ایجاد نقشه دلخواه

اکنون بر روی دکمه change کلیک کنید.

ایجاد نقشه دلخواه

حال گزینه public on the web را انتخاب کنید.

ایجاد نقشه دلخواه

اکنون بر روی گزینه done کلیک کنید.

ایجاد نقشه دلخواه

گام دوم :

 بر روی Map Action Menu or More Icon کلیک کنید. (سه نقطه)

ایجاد نقشه دلخواه

حالت از منو گزینه Embed on my site را انتخاب کنید.

ایجاد نقشه دلخواه

پس از انجام اینکار یک تک html دریافت می کنید. آن را کپی کنید.

ایجاد نقشه دلخواه

گام سوم :

تگ html را در وب سایت وردپرس پیست کنید.

ایجاد نقشه دلخواه

اکنون می توانید آن را به صورت draft ذخیره کنید و یا آن را منتشر کنید.

 

نحوه نمایش نقشه گوگل توسط کاربران

اگر دکمه preview را بزنید می توانید پیش نمایش نقشه خود را در وب سایت ملاحظه کنید. نقشه شما یه صورت زیر نمایش داده می شود.

نحوه نمایش نقشه گوگل توسط کاربران

شما با این روش می توانید نقشه گوگل  را در وب سایت وردپرس خود شخصی سازی کنید.

اضافه کردن نقشه گوگل در وردپرس با استفاده از جاوا اسکریپت

 اگر می خواهید موقعیت مکانی مد نظر خود را در صفحه ای خاص پست کنید می توانید به راحتی از جاوا اسکریپت استفاده کنید. شما باید کد زیر را در ان صفحه کپی کنید.

اضافه کردن نقشه گوگل در وردپرس با استفاده از جاوا اسکریپت

برای اینکار به داشبورد wp Admin Dashboard رفته و گزینه add new post/ page را انتخاب کنید.

اضافه کردن نقشه گوگل در وردپرس با استفاده از جاوا اسکریپت

تنظیمات نقشه گوگل با استفاده از API Key

  • برای استفاده از کد، مطمئن شوید که free Google map Api key را کلیک کرده اید.
  • شما باید مقادیر طول و عرض جغرافیایی را تغییر دهید. می توانید این مقادیر را از گوگل مپ به راحتی به دست آورید.
  • باید ارتفاع نقشه خود را با تغییر استایل تغییر دهید.
  • می توانید میزان زوم نقشه را با تغییر مقدار آن تغییر دهید. به عنوان مثال می توانید مقدار آن را به 16 تغییر دهید.

کاربرن نقشه شما را به صورت زیر خواهند دید.

تنظیمات نقشه گوگل با استفاده از API Key

نقشه گوگل را با استفاده از افزونه وردپرسی اضافه کنید

برای اضافه کردن نقشه گوگل در وردپرس می توانید از پلاگین هایی ذکر شده، استفاده کنید.

معمولا این  پلاگین ها به  Google Maps Key نیاز دارند.

نتیجه گیری

در این مقاله نحوه اضافه کردن نقشه گوگل در وردپرس را آموزش دادیم.  این کار به سه روش ساده توضیح داده شد. کاربران می توانند با جانمایی نقشه گوگل در وردپرس و یا اضافه کردن کد جاوا اسکریپت و یا با استفاده از پلاگین های وردپرس نقشه مد نظر خود را در وب ساست وردپرس خود اضافه کنند.

آموزش دریافت (API KEY) گوگل مپ 

نظرات شما
  1. یعنی الان با وجودتحریم گوگل بازم میشه نقشه سایت رو ایجادکرد؟ مطالب آموزشیتون مفیدهستن.من علاقمندبه وردپرس هستن

ارسال نظر