Menampilkan Google Maps Di Blog AMP

Menampilkan google maps di blog AMP

Beberapa orang di blog mereka dengan sengaja mempilkan google maps atau lokasi google maps,Memasang lokasi di google maps ini menurut saya sangat penting bagi blog dengan nice bisnis ataupun blog jual yang di fungsikan sebagai tempat jualan/online store dengan menampilkan google maps di blog juga akan mempermudah bagi visitors atau pelanggan untuk bernavigasi dengan mudah ke tempat kita di bandingkan hanya dengan hanya mengcapture maps yang di maksud.

Dengan menampilkan google maps secara langsung atau embed ini akan terlihat sangat propesional karna lokasi kita benar benar nyata dan ada di google maps tersebut.

Sebenarnya untuk menampilkan google maps di blog dengan cara mengembed lokasi baik itu untuk di pasang di blog HTML biasa ataupun blog AMP HTML sama saja yang membedakan cuma kode iframe nya saja.

Langsung saja ini sangat mudah jika anda tertarik untuk mencobanya berikut ini caranya :


  1. Pertama anda buka google maps di PC ataupun di smartphone pastikan juga jika menggukan smartphone ubah browser anda menjadi destop
  2. Langkah kedua cari alamat atau tempat yang mau di tampikan dengan mengetik di pencarian google maps
  3. Langkah ketiga pilih bagikan lalu pilih lagi sematkan peta dan salin kode iframe nya 
  4. Langkah terakhir lalu tempel kode tadi di blog anda 

Berikut ini contoh iframe lokasi google maps saya

<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d1980.6705965427834!2d107.06668631500064!3d-6.849640995049898!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x2e699a10ce7ca547%3A0x582dbd17cc1e9ca5!2sEncep+Nurdin+ID!5e0!3m2!1sid!2sid!4v1510168017646" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>


<amp-iframe width="600" height="400" layout="responsive" sandbox="allow-scripts allow-same-origin allow-popups" frameborder="0" src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d1980.6705965427834!2d107.06668631500064!3d-6.849640995049898!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x2e699a10ce7ca547%3A0x582dbd17cc1e9ca5!2sEncep+Nurdin+ID!5e0!3m2!1sid!2sid!4v1510168017646"> </amp-iframe>

Dan hasilnya akan terlihat di bawah ini


Nah Mudahkan menampilkan google maps di blog AMP HTML.
Semoga bermafaat dan selamat mencoba....

blog views
Reactions:
Donate via PayPal

You Might Also Like:

ADD A COMMENT WITH YOUR FACEBOOK PLEASE WAIT FOR FACEBOOK COMMENT WILL SOON OPEN

ADD A COMMENT WITH DISQUS HIDE COMMENT

Disqus Comments

ADD A COMMENT WITH GOOGLE PLUS HIDE COMMENT

google Comments

Hello, how may we help you? Just send us a message now to get assistance.

Facebook Messenger ×