Cara Pasang Peta Lokasi Google Maps Blog

Panduan Tutorial Cara Embed Peta Lokasi Google Maps Blog AMP dan Non-AMP yang bisa kalian coba praktikkan
Memasang Peta Lokasi Google Maps atau yang lebih dikenal dengan bahasa Embed Peta Lokasi dari Google Maps ke Blog terkadang merupakan suatu kebutuhan dimana kita bisa menunjukkan suatu lokasi misanya saja alamat toko Offline kamu di Blog yang kamu jadikan sebagai tempat menjual barang atau jasa.

an image

Dengan cara ini diharapkan akan dapat meningkatkan informasi dan kepercayaan pengunjung ataupun calon pelanggan atas barang atau jasa yang kamu jual secara online.

Pada postingan ini saya akan berbagi pengalaman bagaimana caranya agar kita dapat menampilkan alias embed peta lokasi dari Google Maps ke Blog Blog.

Cara Memasang Peta Lokasi Google Maps di Blog AMP dan Non-AMP


Berikut ini panduan tutorial cara memasang peta lokasi Google Maps ke halaman postingan blog yang bisa kamu praktikkan. Tinggal kamu pilih aja mana yang sesuai dengan Jenis Blog (Themplate Blog) yang kamu gunakan apakah type AMP atau Non-AMP.

Cara Embed Google Maps Blog Non-AMP

Yang pertama saya akan mengajarkan kepada kalian bagaimana cara memasang Embet Kode Peta Lokasi Google Maps di Blog Non-AMP, langkah-langkahnya sebagai berikut:
  1. Langkah Pertama langsung saja kalian buka Google Maps menggunakan browser

  2. an image


  3. Cari Lokasi yang ingin kamu sematkan ke postingan blogger. Ketikkan saja nama usaha atau nama tempat yang ingin kamu dapatkan peta lokasinya di kolom pencarian lokasi. 

  4. an image


  5. Apabila sudah ditemukan, Klick Icon Menu Bagikan Lokasi

  6. an image

  7. Pilih Opsi Sematkan Peta

  8. an image

    Disini kamu bisa memilih ukuran tampilan dari Peta Lokasi yang ingin kamu pasang di postinganmu. Ada 4 pilihan ukuran mulai dari Kecil, Sedang, Besar dan Ukuran Khusus.

    an image

    Sesuaikan ukuran tampilan dari Peta Lokasi sesuai kebutuhanmu. Apabila kalian butuh ukuran khusus pilih Opsi Ukuran Khusus kemudian tentukan Tinggi dan Lebar tampilan Peta Lokasi sesuai selera kalian.

    an image

  9. Salin semua kode iFrame HTMLnya 
  10. Buka halaman postingan Blog Kalian yang ingin dipasang Ebed Peta Lokasi Google Maps
  11. Biasanya dan pada umumnya format penulisan postingan adalah Mode Compose, ubah dan beralihlah ke mode HTML
  12. Tempelkan Kode IFrame ke area yang kamu inginkan
  13. Kembali ke mode Compose untuk melihat hasilnya, dan publikasikan jika dirasa sudah pas

Bagaimana? mudah sekali bukan? .Kelebihan dari pengguna Template Blog Non-AMP yaitu kalian tidak perlu mengedit susunan kode iFramenya. Tinggal salin dan tempelkan saja, beres.

Cara Memasang Google Maps di Blog AMP

Selanjutnya saya akan membahas bagaimana cara embed peta lokasi dari Google Maps ke halaman postingan Blogger AMP. Untuk kalian pengguna Template AMP, kalian tidak bisa sembarang memasang Embet Code Peta Lokasi seperti cara di atas. Dibutuhkan cara khusus agar nantinya halaman postingan kamu tidak terjadi yang namanya invalid AMP.

  1. Langkah Pertama langsung saja kalian buka Google Maps menggunakan browser

  2. an image

  3. Cari Lokasi yang ingin kamu sematkan ke postingan blogger. Ketikkan saja nama usaha atau nama tempat yang ingin kamu dapatkan peta lokasinya di kolom pencarian lokasi. 

  4. an image

  5. Apabila sudah ditemukan, Klick Icon Menu Bagikan Lokasi
  6. Pilih Opsi Sematkan Peta

  7. an image

  8. Salin semua kode iFrame HTMLnya kemudian pastekan kode IFrame ke Dokumen Word atau NotePad.
  9. an image
  10. Buka halaman postingan Blog Kalian yang ingin dipasang Ebed Peta Lokasi Google Maps
  11. Biasanya dan pada umumnya format penulisan postingan adalah Mode Compose, ubah dan beralihlah ke mode HTML
  12. Salin dan tempelkan Link yang ada di Kode IFrame yang saya beri warna merah ke area penempatan kode yang kamu inginkan menggunakan kode berikut ini:
  13. 
    <amp-iframe width="600" height="400" layout="responsive" sandbox="allow-scripts allow-same-origin allow-popups" frameborder="0" src="Link-GMAPS"> </amp-iframe>
    
    Ganti teks Link-GMAPS dengan Link yang ada di Kode IFrame yang saya beri warna merah

  14. Selesai, Publikasikan Postingan kalian
Demikianlah Panduan Tutorial Cara Embed Peta Lokasi Google Maps Blog AMP dan Non-AMP yang bisa kalian coba praktikkan. Selamat mencoba dan semoga berhasil.

About the Author

Seorang Blogger Newbie Lampung
Cookie Consent
We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.
Oops!
It seems there is something wrong with your internet connection. Please connect to the internet and start browsing again.
AdBlock Detected!
We have detected that you are using adblocking plugin in your browser.
The revenue we earn by the advertisements is used to manage this website, we request you to whitelist our website in your adblocking plugin.