Cara Memasang Google Maps di Website atau Blog

Cara memasang Google Maps di Website atau Blog memang menjadi hal yang sangat penting untuk mempermudah pengunjung mencari lokasi via Google Maps di Website yang kita punya. Dengan cara memasang Google Maps di Website atau Blog juga akan semakain menambah kesan tampilan website atau blog kita menjadi lebih menarik.

Cara memasang Google Maps di Website dan Blog ini bisa dilakukan dengan cara memasukka kode script alamat atau lokasi yang ada di Google Maps ke HTML. Melalui cara memasukkan Google Maps ke HTML inilah kita nantinya bisa menampilkan widget Google Maps sesuai dengan lokasi yang kita pasang.

Namun sekarang pertanyaanya adalah bagaimana cara memasang Google Maps di Website atau Blog?

Pertanyaan ini menjadi awal dari tulisan ini dibuat. Artikel ini nantinya akan sepenuhnya membahas tentang bagaimana cara memasang Widget Google Maps di Websita ataupun Blog. Dan berikut cara yang harus dilakukan untuk bisa memasang Google Maps di Website atau Blog milik kita

Cara Memasang Google Maps di Website atau Blog
Cara Memasang Google Maps di Website atau Blog



Cara Membuat Map atau Peta Google Maps di HTML

Cara yang pertama untuk bisa memasang Google Maps di Website atau Blog adalah dengan cara membuat Map di HTML atau membuat peta dengan HTML. Cara ini bisa dilakukan dengan cara mendapatkan Kode Script dari lokasi Google Maps yang akan di pasang. Dan cara untuk bisa mendapatkan kode script yang akan dasang di Website atau Blog adalah sebagai berikut.


1. Masuk ke Website Google Maps

Langkah pertama yang harus dilakukan untuk bisa memasang Google Maps di Website atau Blog adalah dengan masuk ke Google Maps terlebih dahulu. Untuk bisa masuk ke website Google Maps bisa langsung klik link yang ada di bawah ini.

Website Google Maps


2. Ketik Lokasi Google Maps yang akan dipasang di Website

Langkah berikutnya untuk memasang Google Maps di Website atau Blog adalah dengan cara mengetikkan lokasi yang akan di pasang di Website atau Blog.

Cara Memasang Google Maps di Website atau Blog, embed Google Maps ke Website, cara membuat map atau peta di website
Cara Memasang Google Maps di Website atau Blog


3. Pilih dan Klik Tab BAGIKAN

Selanjutnya untuk bisa membuat map di HTML adalah dengan cara membagikan peta Google Maps melalui menu "BAGIKAN" yang ada di Google Maps. Disini nantinya akan ada beberapa menu seperti Simpan, di sekitar, kirim ke ponsel anda dan bagikan.

Dan untuk bisa mendapatkan Kode Script Peta Google Maps itu maka kalian bisa langsung klik tab "BAGIKAN".

Cara Memasang Google Maps di Website atau Blog, embed Google Maps ke Website, cara membuat map atau peta di website
Cara Memasang Google Maps di Website atau Blog


4. Pilih Tab Sematkan peta

Langkah berikutnya pilih fitur tab "Sematkan peta" untuk bisa embed Google Maps ke Website atau Blog. Disini juga ada pilihan ukuran peta Google Maps yang akan dipasang dari ukuran kecil, sedang sampai peta ukuran besar.

Cara Memasang Google Maps di Website atau Blog, embed Google Maps ke Website, cara membuat map atau peta di website
Cara Memasang Google Maps di Website atau Blog


5. Copy atau Simpan Kode Script Google Maps

Langkah terakhir untuk membuat peta Google Maps dengan HTML adalah dengan mencopy atau simpan koda script dari Google Mapas. Copy semua kode tersebut dan copy kode seperti pada gambar dibawa ini.

Cara Memasang Google Maps di Website atau Blog, embed Google Maps ke Website, cara membuat map atau peta di website
Cara Memasang Google Maps di Website atau Blog

Setelah selesai membuat peta Google Maps dengan HTML, maka cara berikutnya adalah dengan embed Google Maps ke Website atau Blog. Cara untuk bisa embed Google Maps ke Website atau Blog berikutnya ada pada pembahasan berikut ini.


Cara Embed Google Maps ke Website atau Blog

Cara berikutnya ini akan membahas tentang bagaimana cara embed Google Maps ke Website atau Blog agar nantinya Widget bisa terpasang. Dan berikut langkah-langkah yang harus dilakukan untuk memasang Google Maps di Website atau Blog.


1. Masuk ke Website atau Blog

Sebelum bisa memasang Google Maps di Website atau Blog adalah dengan cara masuk atau login ke website yang kalian punya. Lakukan proses login atau masuk ke Website Blog seperti biasanya.


2. Mulai Tulis New Entry

Langkah berikutnya kalian bisa langsung menulis artikel yang akan dipasang peta atau widget dari Google Maps yang sudah kita buat sebelumnya. Mulai masuk ke Website atau Blog kalian bisa langsung klik tab New Entry.

3. Tentukan Lokasi Widget dan Pindah Mode HTML

Selanjutnya setelah menulis artikel dan menentukan lokasi dimana peta widget Google Maps yang akan dipasang, maka kalian harus merubah dari Mode Compose ke Mode HTML. Perubahan mode ini untuk bisa embed Google Maps ke Website atau Blog tersebut.

4. Embed Google Maps ke Website atau Blog

Langkah selanjutnya untuk bisa embed Google Maps ke Website atau Blog adalah dengan cara memasukkan atau copy kode script dari Google Maps yang sudah kita simpan sebelumnya. Copy kode script tersebut diposisi yang sudah ditentukan dan paste di posisi tersebut.

Cara Memasang Google Maps di Website atau Blog, embed Google Maps ke Website, cara membuat map atau peta di website
Cara Memasang Google Maps di Website atau Blog


5. Lihat Hasil Embed Google Maps ke Website atau Blog

Setelah berhasil mengcopy kode dari Google Maps maka kalian bisa langsung melihat hasilnya dengan klik tab "Pratinjau" untuk melihat hasilnya.
Dan berikut hasil dari cara memasang Google Maps di Website atau Blog


Cara memasang Google Maps di Website atau Blog ini bisa kalian jadikan referensi untuk bisa embed Google Maps ke situs yang kita punya. Dengan tampilan tambahan Google Maps yang ada di situs kita maka tampilan situs akan terlihat lebih menarik dan profesional.

Dan selamat mencoba...

5 komentar:

  1. Sempet bingung nyari embed google map nya dimana,,,krena bru pemula,,,
    Makasih ilmunya gan,,,tetep semangat,,,

    Kunjungi website saya ya : https://faiz4l.mahasiswa.atmaluhur.ac.id/ dan website kampus saya : http://www.atmaluhur.ac.id

    BalasHapus
  2. gan, untuk web dengan sistem open conference system (OCS) kok gak bisa ya ditambahin peta dari google maps ? udah di copy kode dari google maps ke htmlnya di bagian detail web ocs, terus pas disimpen , gak muncul petanya, pas cek di bagian detail web ocsnya kodenya hilang sendiri

    BalasHapus
  3. Haiii….. Terimakasih atas informasinya yang sangat bermanfaat. Seiring perkembangan zaman yang serba menggunakan teknologi canggih ini, informasi apapun dapat dengan mudah didapatkan di internet. Cara untuk memasang atau membagikan url google maps di website ini pun tersedia banyak referensinya di internet. Jangan lupa kunjungi laman web kampus kami tercinta walisongo.ac.id

    BalasHapus
  4. masih kurang paham saya karna pake aplikasi google map beda

    BalasHapus

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel