نحوه جاسازی نقشه های گوگل در وب سایت: 4 مرحله

2024 نویسنده: John Day | [email protected]. آخرین اصلاح شده: 2024-01-30 08:53

در چالش Maps به من رای دهید!

اخیراً ، من یک وب سایت ایجاد کرده ام که از Google Maps استفاده می کند. جاسازی نقشه های گوگل در وب سایت من نسبتاً آسان بود و انجام آن چندان هم سخت نبود. در این دستورالعمل ها ، به شما نشان خواهم داد که چگونه می توان Google Maps را در وب سایت خود جاسازی کرد.

اگر بخواهم صادق باشم ، من فقط برای سرگرمی Google Maps را در وب سایت خود جاسازی کردم. کارهای زیادی برای انجام در قرنطینه انجام نمی شود ، بنابراین چرا وب سایتی ایجاد نکنید که از نقشه های گوگل استفاده می کند و سپس مراحل انجام این وب سایت را به مردم نشان می دهد.

اکنون باید بگویم ، برای جاسازی Google Maps در وب سایت خود ، باید یک یا دو مورد در مورد HTML و CSS بدانید. اگر چیزی در مورد HTML یا CSS نمی دانید ، سعی کنید به https://www.w3schools.com/ بروید

توجه: من به هیچ وجه به W3Schools وابسته نیستم. این فقط یک وب سایت است که به نظرم هنگام یادگیری HTML و CSS مفید است.

تدارکات

• ویرایشگر متن (برای سفارشی سازی وب سایت شما و ارائه محتوای وب سایت شما استفاده می شود).
• Google Maps (آنچه در وب سایت شما جاسازی می شود).
• آشنایی اولیه با HTML و CSS (اینها زبانهای برنامه نویسی زیر هستند که هنگام سفارشی سازی وب سایت شما و ارائه محتوا در وب سایت شما استفاده می شود).

مرحله 1: ارائه محتوا در وب سایت خود

به رایانه خود به نرم افزار ویرایشگر متن خود بروید. به عنوان مثال ، از آنجا که من ویندوز دارم ، باید به دفترچه یادداشت بروم. پس از رفتن به Notepad عبارت زیر را وارد کنید:

نقشه های گوگل

نقشه های گوگل

پس از اتمام تایپ موارد زیر در دفترچه یادداشت ، به Google Maps بروید ، جایی که بعداً کد لازم را برای جاسازی Google Maps در وب سایت خود دریافت خواهید کرد.

در اینجا پیوندی برای رفتن به Google Maps وجود دارد:

مرحله 2: Google Maps را در وب سایت خود قرار دهید

پس از ورود به Google Maps ، روی دکمه "منو" کلیک کنید و سپس به دنبال "اشتراک گذاری یا جاسازی نقشه" باشید. پس از مشاهده "اشتراک گذاری یا جاسازی نقشه" ، روی آن کلیک کنید. پس از کلیک بر روی آن ، باید "ارسال پیوند" و "جاسازی نقشه" را مشاهده کنید. اکنون روی "جاسازی نقشه" کلیک کنید ، هنگامی که روی "جاسازی نقشه" کلیک کرده اید ، اکنون باید یک پیکان رو به پایین در سمت چپ یک جعبه متن مشاهده کنید که برای انتخاب اندازه بزرگ یا کوچک مورد نظر شما استفاده می شود. متن موجود در کادر را کپی کنید. و متن را در HTML وب سایت خود جایگذاری کنید.

مرحله 3: وب سایت خود را سفارشی کنید

به رایانه خود به نرم افزار ویرایشگر متن خود بازگردید و موارد زیر را تایپ کنید:

بدنه Google Maps {background-color: rgb (129، 207، 224، 1)؛}

نقشه های گوگل

برچسب سبک برای سفارشی سازی وب سایت شما استفاده می شود. اکنون ، من به شما توصیه می کنم که این مرحله از CSS استفاده می کند. می توانید موارد زیر را تایپ کنید تا وب سایت شما دقیقا شبیه وب سایت من باشد.

پس از اتمام کار ، فایل خود را به عنوان "Google Maps.html" ذخیره کنید. قسمت html را فراموش نکنید زیرا اگر این قسمت را وارد نکنید ، نمی توانید وب سایت بسازید.

مرحله 4: به محصول نهایی خود نگاه کنید

هنگامی که تمام مراحل این دستورالعمل را انجام دادید ، محصول نهایی خود را خوب بررسی کنید. اگر از محصول نهایی خود راضی هستید ، بسیار عالی است. اما ، اگر از محصول نهایی خود راضی نیستید ، به دفترچه یادداشت خود برگردید و سعی کنید محصول نهایی خود را اصلاح کنید تا دفعه بعد که یک بار خوب به محصول نهایی خود نگاه کنید ، از آنچه ایجاد کرده اید خوشحال باشید. دست های تو

اگر می خواهید کد منبع من را مشاهده کنید ، می توانید آن را در پایین این دستورالعمل ها بیابید. از اینکه دستورالعمل های آموزشی من را مشاهده کردید و کد نویسی خوشحال کردید متشکرم!

به عنوان یک یادآوری ، لطفاً در Challenge Maps به من رای دهید!