Cara Pasang Peta Google Maps di Blog Tampilan Hidup dan Responsive

Cara memasang peta google maps di web/blog - Situs website/blog yang bertopik mengenai menjelaskan pemetaan lokasi seperti: wilayah, objek wisata, gunung, kelautan pusat kota dan semacamnya sangat cocok jika ditambah widget gogle maps tampilan Iframe, biasanya akan membuat artikel semakin dalam memperjelas pengunjung dengan informasi pemetaan yang tersedia.

Peta google maps di situs website blog

Google Maps adalah satu layanan pemetaan digital dengan citra stelit dari google berupa website dan aplikasi sebagai pemandu (guides) yang bisa di pasang/semat dengan sistem multilingual API (pasang dimana pun), dimana pengguna bisa berinteraksi menelusuri tempat, jalan dan lainya hanya cukup dilayar perangkat.

Selain itu maps juga banyak informasi mengenai rute (Direction) jarak tempuh dan lainya.

Istilah pasang maps

Menambahkan peta di website biasa di sebut semat peta maps atau Embed map, jadi kalau dipasang akan otomatis tampil widget google maps atau berupa link di postingan tersebut.

Contoh memasang peta google maps disemat di postingan blog

Lokasi ini di ambil di daerah Ibukota Indonesia yaitu: Tugu Monas Jakarta yang saya ambil koordinatnya untuk contoh.

Maps tampilan iframe

Lihat pula: Cara pasang tombol Aplikasi di Postingan

Inilah cara menambahkan widget peta google maps di website/blog

Catatan

• Gunakan perangkat komputer (laptop / PC)
• Jika anda memakai gadget smartphone android/iOS? terlebih dahulu Ubah tampilan situs mobile ke versi dekstop atau supaya lebih jelas lihat Cara pasang google map dengan Smartphone

1. Mulai dengan langkah pertama cara memasabg widget google map silahkan buka PC atau Laptopnya.

•  Pada browser (apa saja) kunjungi google.maps.com
• Cari koordinat lokasi target yang akan diembed, supaya lebih cepat mencari gunakan Serach maps lalu ketik nama lokasi yang akan anda buat contoh "Monas".

Cari lokasi di Adress bar maps

2. Setelah ditemukan lokasi, tentukan titik yang tepat lokasi/koordinat bisa perbesar (zoom) terlebih dahulu tempat tersebut lalu tandai dengan mengarahkan Cursor dan klik kiri.

• jika lokasi itu belum ada namanya bisa di tandai saja dengan mengklik kiri tepat pada titik tersebut dengan menggunakan Mouse itu juga akan otomatis bisa.
• Setelah ditandai lokasi >lalu "Klik" Menu  samping atas!.

Pilih lokasi klik tandai, >lalu buka Menu bar

3. Pada Menu bar >Cari pilihan Share or embed map >lalu "Klik" seperti contoh gambar!

Klik menu bar >Klik Share or embed map

4. Selanjutnya akan muncul dua kali pop up?

• Di Pop up ke 1. >(Share link<>Embed map) Klik saja "Embed map"
• Di Pop up ke 2. Akan muncul iframe peta maps, silahkan pilih ukuran tampilan: Large, medium atau small, (Saya sarankan untuk pilih Small agar tampilan sesuai di seluler tidak terlalu besar).
• Lihat kode pada Adress bar (warna biru) lalu copy/salin semua kode tersebut pasang di HTML artikel.

Pilih Embed map >Pilih Ukuran >Copy kode html maps

Note!
Sampai disini sudah selesai untuk mendapatkan kode html maps. Selanjutnya anda tinggal memasang di blog (di postingan atau Halaman statis)

Cara memasang kode HTML maps di postingan blog

Langkah dan cara memasukan kode google map di html post!

1. Login ke dashboard blog.
2. Buat Post baru atau edit postingan.
3. Pastekan kode tadi pada mode HTML postingan.

• Ingat past di mode HTML post!

Pasang kode di HTML postingan

4. Cek pratinjau lebuh dulu jika ukuran tidak sesuai coba atur lagi ukuranya di HTML post itu.

• height "250"
• width="409" (sesuaikan saja)

5. Kalau dirasa sesuai lalu disimpan, jika selesai siap diposting.


Kesimpulan  memasang widget peta google maps di web/blog

Gunakan widget iframe google maps di artikel sesuai kebutuhan dan usahakan serelevan mungkin, jika dirasa harus dipasang silahkan menampilkan google maps di blog.

Semoga artikel mengenai bagaimana cara pasang / embed widget peta google maps di website di halaman blog bisa membantu.