Blogger neues Footer einfügen

Das hier ist wohl einer der besten Tutorials den ich erstellt habe. Hiermit zeige ich euch, wie man einfach seinem Blog einen weiteren Footer hinterher hängt. Dises neue Bereich kann dann sehr vielseitig genutzt werden.

Backup einrichten (optional)

Gehe in: Dashboard/Layout/Html Bearbeiten
Klicke auf: Vollständige Vorlage herunter laden

nicht Verstanden? Dann klick hier.

CSS code einfügen

suche:

</b:skin>

füge dieses Code direkt darüber:

#footer-column-container
clear:both;
}
.footer-column
padding: 10px;
}
.footer-bottom
padding: 10px;
}

Html code einfügen

suche:

<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

ersetze dieses code <b:section class='footer' id='footer'/> mit folgendem:

<div id='footer-column-container'>

<div style='clear:both;'/>

<div id='footer2' style='width: 33%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col1' preferred='yes' style='float:left;'>
<b:widget id='HTML1' locked='false' title='' type='HTML'/>
</b:section>
</div>

<div id='footer3' style='width: 33%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col2' preferred='yes' style='float:left;'>
<b:widget id='HTML2' locked='false' title='' type='HTML'/>
</b:section>
</div>

<div id='footer4' style='width: 33%; float: right; margin:0; text-align: left;'>
<b:section class='footer-column' id='col3' preferred='yes' style='float:right;'>
<b:widget id='HTML3' locked='false' title='' type='HTML'/>
</b:section>
</div>

<div style='clear:both;'/>

<div id='footer-bottom' style='text-align: center; padding: 10px; text-transform: lowercase;'>
<b:section class='footer' id='col-top' preferred='yes'>
<b:widget id='HTML4' locked='false' title='' type='HTML'/>
</b:section>
</div>

<p>
<hr align='center' color='#cccccc' width='90%'/></p>
<div id='footer-bottom' style='text-align: center; padding: 10px; text-transform: lowercase;'>

<b:section class='footer' id='col-bottom' preferred='yes'>
<b:widget id='HTML5' locked='false' title='' type='HTML'/>
</b:section>
</div>

<div style='clear:both;'/>
</div>

Related post
Blogger Neues Widget neben Header einfügen
Blogger 5 Sterne Rating-System unter Posts