headlogo
Verfasst: 09.12.2018 14:43
Guten Tag also ich bin mit meinem Projekt jetzt soweit das der Banner funktioniert. Nur bekomme ich ihn nicht zentriert und bei responsiver ansicht das er sich an das bild anpasst.
Also mal langsam zum nachvollziehen.
Ich bin einen Style am bearbeiten wo ein banner 800*200px drin ist. Soweit so gut. Da der Original style die änderungen aber direkt in dem style gemacht hat möchte ich dies umgehen und habe dafür eine ext gebastellt, auch das hat funktioniert.
Hier mal die codeschnipsel meiner Extension.
/ext/name1/name2/
styles/name/theme/name.css
Styles/name/template/event/overall_header_navbar_before.html
Das hat zur folge, das wenn die ext geladen ist der komplette original div-Container
Jetzt brauch ich eigentlich nur noch die entsprechenden angaben, wie ich erstens den banner zentriert bekomme und zweitens das der sich von der breite des Bildschirms anpasst ( ich weis bei 800px breite etwas gequetscht aber der foren betreiber möchte es so haben)
Also mal langsam zum nachvollziehen.
Ich bin einen Style am bearbeiten wo ein banner 800*200px drin ist. Soweit so gut. Da der Original style die änderungen aber direkt in dem style gemacht hat möchte ich dies umgehen und habe dafür eine ext gebastellt, auch das hat funktioniert.
Hier mal die codeschnipsel meiner Extension.
/ext/name1/name2/
styles/name/theme/name.css
Code: Alles auswählen
.headerbar {
display: none;
}
.headerbar2 {
color: #FFFFFF;
background-color: #12A3EB;
background-image: -webkit-linear-gradient(top, #6ACEFF 0%, #0076B1 2px, #12A3EB 92px, #12A3EB 100%);
background-image: linear-gradient(to bottom, #6ACEFF 0%,#0076B1 2px,#12A3EB 92px,#12A3EB 100%);
background-repeat: repeat-x;
margin-bottom: 4px;
padding: 5px;
border-radius: 7px;
}
.logo2 {
float: left;
width: auto;
padding: 10px 13px 0 10px;
}
.logo2:hover {
text-decoration: none;
}
.site_logo2 {
background-image: url("./images/banner.gif");
background-position: center;
display: inline-block;
width: 800px;
height: 200px;
}Styles/name/template/event/overall_header_navbar_before.html
Code: Alles auswählen
<div class="headerbar2" role="banner">
<!-- EVENT overall_header_headerbar_before -->
<div class="inner">
<div id="site-description" class="site-description">
<a id="logo2" class="logo2" href="<!-- IF U_SITE_HOME -->{U_SITE_HOME}<!-- ELSE -->{U_INDEX}<!-- ENDIF -->" title="<!-- IF U_SITE_HOME -->{L_SITE_HOME}<!-- ELSE -->{L_INDEX}<!-- ENDIF -->"><span class="site_logo2"></span></a>
<p class="skiplink"><a href="#start_here">{L_SKIP}</a></p>
</div>
</div>
<!-- EVENT overall_header_headerbar_after -->
</div>Das hat zur folge, das wenn die ext geladen ist der komplette original div-Container
<div class="headerbar" role="banner"> ausgeblendet wird und der inhalt in besagter event datei eingefügt wird. Soweit passt das genau so wie ich es vorgesehen habe. auch die original link fürs logo hab ich benutzen können, lediglich die class angaben geändert damit die von meiner css der ext gemanagt werden. das hat alles funktioniert. Jetzt brauch ich eigentlich nur noch die entsprechenden angaben, wie ich erstens den banner zentriert bekomme und zweitens das der sich von der breite des Bildschirms anpasst ( ich weis bei 800px breite etwas gequetscht aber der foren betreiber möchte es so haben)