Sadržaj:

Kako ugraditi Google karte na web stranicu: 4 koraka
Kako ugraditi Google karte na web stranicu: 4 koraka

Video: Kako ugraditi Google karte na web stranicu: 4 koraka

Video: Kako ugraditi Google karte na web stranicu: 4 koraka
Video: Дедушка не выдержал и дал ответ за Украинский флаг 2024, Novembar
Anonim
Kako ugraditi Google karte na web lokaciju
Kako ugraditi Google karte na web lokaciju

Glasajte za mene u izazovu Maps!

Nedavno sam stvorio web stranicu koja koristi Google karte. Ugraditi Google karte na moju web stranicu bilo je prilično jednostavno i nije tako teško učiniti. U ovom Instructables -u pokazat ću vam kako je lako ugraditi Google Maps na vašu web stranicu.

Da budem iskren s vama, samo sam iz zabave ugradio Google karte na svoju web stranicu. Nema toliko stvari za raditi dok ste u karanteni, pa zašto ne biste napravili web stranicu koja koristi Google Maps, a zatim ljudima pokažite korake koje sam poduzeo prilikom stvaranja ove web stranice.

Moram reći, morate znati par stvari o HTML -u i CSS -u da biste ugradili Google karte na svoju web stranicu. Ako ne znate ništa o HTML -u ili CSS -u, pokušajte posjetiti

Napomena: Nisam povezan sa W3Schools u bilo kojem obliku ili obliku. To je samo web stranica za koju smatram da je od pomoći pri učenju HTML -a i CSS -a.

Supplies

  • Uređivač teksta (koristi se za prilagođavanje vaše web stranice i pružanje sadržaja na vašoj web stranici).
  • Google mape (ono što bi bilo ugrađeno na vašu web stranicu).
  • Osnovno razumijevanje HTML -a i CSS -a (ovo su sljedeći programski jezici koji bi se koristili pri prilagođavanju vaše web stranice i pružanju sadržaja na vašoj web stranici).

Korak 1: Pružite sadržaj na svojoj web stranici

Pružite sadržaj na svojoj web stranici
Pružite sadržaj na svojoj web stranici
Pružite sadržaj na svojoj web stranici
Pružite sadržaj na svojoj web stranici

Idite na softver za uređivanje teksta na računaru. Na primjer, budući da imam Windows, trebao bih otići u Notepad. Nakon što otvorite Notepad, upišite sljedeće:

google mape

google mape

Nakon što završite s upisivanjem sljedećeg u Notepad, idite na Google Maps gdje ćete kasnije dobiti kôd koji ćete koristiti za ugradnju Google Maps na svoju web stranicu.

Evo veze za posjet Google mapama:

Korak 2: Ugradite Google karte na svoju web stranicu

Ugradite Google karte na svoju web stranicu
Ugradite Google karte na svoju web stranicu
Ugradite Google karte na svoju web stranicu
Ugradite Google karte na svoju web stranicu
Ugradite Google karte na svoju web stranicu
Ugradite Google karte na svoju web stranicu

Kada ste na Google kartama, kliknite gumb "Izbornik", a zatim potražite "Dijeli ili ugradi kartu". Kada vidite "Dijeli ili ugradi kartu", kliknite na nju. Nakon što kliknete na to, trebali biste vidjeti "Pošalji vezu" i "Ugradi kartu". Sada kliknite na "Ugradi mapu", nakon što ste kliknuli na "Ugradi kartu", sada biste trebali vidjeti strelicu prema dolje lijevo od okvira za tekst koja bi se koristila za odabir veličine ili veličine karte. Kopirajte tekst u okvir. I zalijepite tekst u HTML vaše web stranice.

Korak 3: Prilagodite svoju web stranicu

Prilagodite svoju web stranicu
Prilagodite svoju web stranicu
Prilagodite svoju web stranicu
Prilagodite svoju web stranicu

Vratite se na softver za uređivanje teksta na računaru i upišite sljedeće:

Google Maps tijelo {background-color: rgb (129, 207, 224, 1);}

google mape

Oznaka stila koristi se za prilagođavanje vaše web stranice. Sada ću vas savjetovati da ovaj korak koristi CSS. Možete unijeti sljedeće kako bi vaša izgledala potpuno poput moje web stranice.

Kada završite, spremite datoteku kao "Google Maps.html". Ne zaboravite html dio jer ako ne uključite ovaj dio, ne možete napraviti web stranicu.

Korak 4: Pogledajte svoj konačni proizvod

Pogledajte svoj konačni proizvod
Pogledajte svoj konačni proizvod

Nakon što završite sa svim koracima u ovim uputama, dobro pogledajte svoj konačni proizvod. Ako ste zadovoljni svojim konačnim proizvodom, to je sjajno. No, ako niste zadovoljni svojim konačnim proizvodom, vratite se u svoj Notepad i pokušajte popraviti svoj konačni proizvod tako da ćete sljedeći put kada dobro pogledate svoj konačni proizvod biti zadovoljni s onim što ste stvorili tvoje ruke.

Ako želite pogledati moj izvorni kod, on se može pronaći na dnu ovog uputstva. Hvala vam što ste pregledali moje instrukcije i sretno kodiranje!

Podsjećanja radi, glasajte za mene u Maps Challengeu!

Preporučuje se: