Bu sitedeki her şey Sevgi ile kodlanmıştır.

Kategori Listesini Göster

Google Haritalar (Google Maps) Kodunu Responsive Yapalım


FacebookTwitterPinterestTumblrYazdır


Google Haritalar (Google Maps) Kodunu Responsive YapalımEğer ki bir işletme sahibi iseniz, sitenize de Google Maps (Google Haritalar) iframe kodunu eklemiş olabilirsiniz. Ne yazık ki ilgili kod şu an için responsive değil. Bu yüzden Google haritalar kodunu responsive yapmak mantıklı bir tercih. Bunun için ise, aşağıdaki örnek CSS kodlarını kullanabilirsiniz. Aşağıda örnek kullanım verilmiş olup, kendinize ait iframe kodunu kullanmayı unutmayınız.

Google Haritalar Kodunu Responsive Yapalım

Google Haritalar (Google Maps) Kodunu Responsive Yapalım

1) Temanızın CSS dosyasına aşağıdaki kodları ekleyiniz.

.google-haritalar {
position: relative;
padding-bottom: 50%;
height: 0;
overflow: hidden;
}
.google-haritalar iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}

2) İlgili iframe kodunu ise aşağıdaki şekilde kullanınız.

<div class="google-haritalar">
İlgili kodları buraya ekleyebilirsiniz.
</div>

Bu içeriğimizde, Google Haritalar kodunu responsive yapmak hakkında bilgi paylaşımında bulunduk. Eğer ki Google Maps iframe kodunu responsive yapmak istiyorsanız, yukardaki kodları kullanmanız yeterli olacaktır.


  1. Yorum bulunmamaktadır.

Bu yazıya yorum göndermek ister misiniz?

Dikkat: Her yorum gönderen kişi, kendi gönderdiği yorumdan sorumlu olmaktadır.
Not: Yazı ile herhangi bir ilgisi bulunmayan yorumların onaylanmadığını belirtmek isteriz.
Yazı Etiketleri
Yukarı Çık