Menu


Menu Tab

Pages

Showing posts with label Widget Footer Empat Kolom. Show all posts
Showing posts with label Widget Footer Empat Kolom. Show all posts

Widget Footer Empat Kolom

Widget Footer Empat Kolom
Memasang footer empat kolom di edit HTML
Footer pada blog yang berada dibagian paling bawah pada halaman blog, biasanya berjumlah lebih dari satu kolom, yang memiliki fungsi untuk menambahkan  gadged dihalaman blog, gadged tersebut berfungsi untuk tempat penyimpanan file. Dibawah ini adalah kode footer empat kolom,
berikut cara penerapannya.
Login ke akun blog klik edit HTML temukan kode ]]></b:skin>
gunakan CTRL F untuk pencarian copy kode berikut pastekan diatas kode ]]></b:skin> 

/*----- MBT MULTI COLUMN FOOTER WIDGET -----*/
#lower {
margin:auto;
padding: 0px 0px 10px 0px;
width: 100%;
background:#333333;
}
#lower-wrapper {
background:#333333;
margin:auto;
padding: 20px 0px 20px 0px;
width: 960px;
border:0;
}
#lowerbar-wrapper {
background:#333333;
float: left;
margin: 0px 5px auto;
padding-bottom: 20px;
width: 23%;
text-align: justify;
color:#ddd;
font: bold 12px Arial, Tahoma, Verdana;
line-height: 1.6em;
word-wrap: break-word;
overflow: hidden;
}
.lowerbar {margin: 0; padding: 0;}
.lowerbar .widget {margin: 0; padding: 10px 20px 0px 20px;}
.lowerbar h2 {
margin: 0px 0px 10px 0px;
padding: 3px 0px 3px 0px;
text-align: left;
border:0;
color:#ddd;
text-transform:uppercase;
font: bold 14px Arial, Tahoma, Verdana;
}
.lowerbar ul {
color:#fff;
margin: 0 auto;
padding: 0;
list-style-type: none;
}
.lowerbar li {
display:block;
color:#fff;
line-height: 1.6em;
margin-left: 0 !important;
padding: 6px;
border-bottom: 1px solid #222;
border-top: 1px solid #444;
list-style-type: none;
}
.lowerbar li a {
text-decoration:none; color: #DBDBDB;
}
.lowerbar li a:hover {
text-decoration:underline;
}
.lowerbar li:hover {
display:block;
background: #222;
}
Kemudian cari kode </body>
copy kode berikut ini pastekan diatas kode tersebut dan klik simpan selesai

<div id='lower'>
<div id='lower-wrapper'>


<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar1' preferred='yes'>
</b:section>
</div>


<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar2' preferred='yes'>
</b:section>
</div>


<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar3' preferred='yes'>
</b:section>
</div>


<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar4' preferred='yes'>
</b:section>
</div>


<div style='clear: both;'/>
</div> </div>
Edited   by. Myscript2010
Sumber by. Mybloggertricks

Myscript2010

Home Page
 
 

M2010

Copyright © Cibeber Cimahi