درخواست پیش فاکتور

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

  • 5 آبان 1397
  • بدون دیدگاه
  • مجید عابد
آموزش قرار دادن نقشه گوگل به صورت ریسپانسیو در هر سایت

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

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

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

 

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

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

 

سپس در کادر باز شده بر روی گزینه Embed map کلیک کنید . کد آیفریم را انتخاب کنید و سپس آن را کپی کنید .

 

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

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

 

حال باید کد را درون سایت خود قرار دهید . کد قرار داده شده در سایت مشابه کد زیر خواهد بود :

 

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

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

 

امیدوارم که از این آموزش استفاده کافی برده باشید . خوشحال میشویم تا نظرتان را درباره این آموزش بشنویم . پس هر چه سریعتر دست به کار شده و نظر خود را در پایین همین مطلب برای ما ارسال کنید .

امتیاز شما به این مقاله ؟
خیلی بدبدمعمولیخوبخیلی عالی
2 رای : 3٫00 از 5

دکتر رنک لول رنگ - پالت رنگ های مورد تایید آی وحید درگاه پرداخت واسط jibme