Selamat siang sahabat blogger, pada kali ini saya bagikan cara memasukkan google maps ke dalam web atau kode HTML anda. Pada google maps, digunakan untuk memberikan lokasi dimana perusahaan atau institusi berada Sehingga memudahkan pembaca untuk mengetahui lokasinya. Langkah-langkah dalam memasukkan maps kedalam web atau HTML sebagai berikut:
Langkah pertama yaitu buka browser anda kemudian buka https://www.google.co.id/maps/ setelah itu cari nama institusi atau nama perusahaan anda pada menu Telusuri google Maps,pada contoh kali ini saya menggunakan alamat toko online calesmart.
Maka akan terlihat hasil di google maps seperti pada gambar berikut
Langkah selanjutnya pilih Bagikan pada tampilan kiri layar setelah itu akan menghasilkan tampilan seperti berikut ini
Keterangan:
Untuk membagikan lokasi berupa link, anda bisa pilih Bagikan Link kemudian copy tulisan yang ada didalam kotak tersebut, jika untuk menyematkan peta di dalam web atau HTML anda harus pilih tab sematkan Peta pada menu sebelah kanannya seperti pada gambar berikut ini:
Langkah ketiga yaitu copy alamat link yang akan kita sematkan kedalam body web kita.
|
|
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>memasukkan peta kedalam HTML</title> </head> <body> <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3952.4058095464975!2d110.3819395087761!3d-7.852527164914419!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x2e7a56f4085b1d53%3A0x4991913f249b4dab!2sOnline+Shop+calesmart.com!5e0!3m2!1sid!2sid!4v1503900872256" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe> </body> </body> </html> |
Fungsi dari iframe adalah menampilkan isi dari web lain contoh lainya yaitu untuk menampilkan maps dari google map. Untuk hasil tampilan bisa anda lihat pada gambar dibawah ini.
Semoga artikel ini bermanfaat, salam.
telah dibaca: 5,372
I’m not sure ѡһеre you аre getting ｙour infօ,
but good topic. I needs to spеnd some time learning more oｒ understanding more.
Thanks for fantastіc information I was looking for this information for my missіon.