Adaptīva Google Karte jūsu WordPress lapā
Pirms pievienot Google karti ir nepieciešams pievienot papildus rindas jūsu weblapas .css failam:
.google-maps {
position: relative;
padding-bottom: 75%; // This is the aspect ratio
height: 0;
overflow: hidden;
}
.google-maps iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}
Kad tas tika izdarīts, varat pievienot Google karti, ievietojot html kodu, ka ir norādīts piemērā:
<div class="google-maps"><iframe style="border: 0;" src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d34763.31759586287!2d24.127696627816785!3d57.00519580278729!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x46eecf2288021511%3A0x808993c47189809c!2zTWXFvmFwYXJrcywgWmllbWXEvHUgcmFqb25zLCBSxKtnYSwgTGF0dmlqYQ!5e0!3m2!1slv!2sru!4v1469863440077" width="1200" height="450" frameborder="0" allowfullscreen="allowfullscreen"></iframe></div>
Tagad Jūsu karte būs adaptīva un tiks korekti atspoguļota visās ierīcēs.
Atbildēt
Vēlies pievienoties diskusijai?Jūtieties brīvi, lai veicinātu!