home sitemap mailform print Impressum

Google-Maps

Google-Maps in Webseite einbinden
 
Anleitung google-maps iframe responsive in eigene Webseite einbinden.
Google Maps wird auf der ganzen Breite angezeigt.
Einbettcode ist ohne html und CSS Fehler.
Tippen Sie in Ihre Browser Adresszeile Google Maps ein.
 
google_maps2.jpg
 
google_maps1.jpg
 
Fügen Sie diesen iframe-Code von Google Maps z.B. in Notepad++ ein.
Sie müssen dem Einbettungscode noch Ihr Google Maps Standort zuordnen. Auf Google Maps Adresse eingeben, Teilen anklicken und nochmals auf Karte einbetten klicken und Code kopieren. Nur den Teil nach src="https:// bis " allowfullscreen= Markieren und kopieren.
 
Kopierter Code nun in den Einbettungscode kopieren zwischen src="https:// und vor " allowfullscreen=
 

<p> </p>
<div class="google-maps">
<iframe src="<-- Code von Google Maps -->" allowfullscreen="allowfullscreen"></iframe>
<p> </p>

Jetzt nur noch den bearbeiteten Einbettungscode kopieren und in Ihre Seite einfügen. Im Editor auf <> Quelltext oder HTML klicken und den kopierten Code einfügen und speichern.
 
Fügen Sie den untenstehenden Code in Ihre Stylesheet Datei ein, der Code wird Google Maps im Responsive Webdesign anzeigen.
 
/* google-maps responsive  start */
.google-maps {
background-color: #EEE;
width: 100%;
height: 100%;
margin-left:auto;
margin-right:auto;
}
.google-maps {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
.google-maps iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/* google-maps responsive end */

 

 

 

 

News

  

Templats Download für
CMSimple_XH  
 
links_icon.png
 
Webseiten Tipp: Fitness-Studio in Steffisburg.
www.silvergym.ch

 

Templates Demo

 

 Besuchen Sie meine
Templates Demo Seite.
 
Templates Demo richu153.jpg