Als erstes legt ihr ein neues Template an und benennt das relativ eindeutig, zum Beispiel:
additionalFooter
[Blockierte Grafik: http://cls-design.com/upload/images/P6Cdf.png]
und wählt die Templategruppe des Stils aus. In das Codefeld kopiert ihr dann folgendes HTML-Gerüst:
HTML
<div class="additionalFooterContent">
<div class="footerContent1">
<h3 class="subHeadline">Informationen</h3>
<p><a href="http://www.link.de">Forenregeln</a></p>
<p><a href="http://www.link.de">Allgemeine Geschäftsbedingungen</a></p>
<p><a href="http://www.link.de">Häufig gestellte Fragen</a></p>
<p><a href="http://www.link.de">Lizenzen</a></p>
<p><a href="http://www.link.de">Kontakt</a></p>
<h3 class="subHeadline"></h3>
</div>
<div class="footerContent2">
<h3 class="subHeadline">Partner</h3>
<p><a href="http://www.link.de">Hairtech</a></p>
<p><a href="http://www.link.de">Foottech</a></p>
<p><a href="http://www.link.de">Wumptech</a></p>
<p><a href="http://www.link.de">Nailtech</a></p>
<p><a href="http://www.link.de">Colortech</a></p>
<h3 class="subHeadline"></h3>
</div>
<div class="footerContent3">
<h3 class="subHeadline">Werbung</h3>
<p><a href="http://www.link.de">Fototassen</a></p>
<p><a href="http://www.link.de">Kalender</a></p>
<p><a href="http://www.link.de">Poster</a></p>
<p><a href="http://www.link.de">Aufsteller</a></p>
<p><a href="http://www.link.de">Karten</a></p>
<h3 class="subHeadline"></h3>
</div>
<div class="footerContent4">
<h3 class="subHeadline">Kontakt</h3>
<p>Xen0x GmhH</p>
<p>Zentralplatz 5</p>
<p>70155 Stuttgart</p>
<p>Fon +49 7011 766 420</p>
<p>Fax +49 7011 766 421</p>
<h3 class="subHeadline"></h3>
</div>
<div style="clear:left;"></div>
</div>
Alles anzeigen
Idealerweise solltet ihr dafür Sprachvariable verwenden.
Anschliessend bearbeitet ihr den Footer eures Stil und ergänzt das Footertemplate um folgenden Eintrag an der Position des Bildes:
[Blockierte Grafik: http://cls-design.com/upload/images/ZGcIf.png]
Und jetzt benötigt ihr noch ein wenig CSS für die Formatierung:
CSS
.footerMenu img, .stylePicker img, .date img {
display:none;
}
.additionalFooterContent p {
margin-bottom:3px;
font-size:1.1em;
}
.additionalFooterContent h3, .additionalFooterContent, .footerMenu li, .footerOptions li {
border-color: #4E5055 !important;
}
.additionalFooterContent {
padding:10px 0;
color:#ccc;
}
.additionalFooterContent h3 {
border-bottom:solid 1px;
}
.footerContent1 h3, .footerContent2 h3, .footerContent3 h3{
margin-right:10px;
}
.footerContent1, .footerContent2, .footerContent3, .footerContent4 {
float: left;
width: 25%;
}
#footerContainer {
color:#ccc;
}
#footerContainer a {
color:#999;
}
#footerContainer a:hover {
color:#6BD7FE;
}
Alles anzeigen