Cara Mudah Membuat Widget Footer Empat Kolom di Blog

PITAKON- Di kesempatan kali ini saya akan share Tutorial Cara Mudah Membuat Widget Footer Empat Kolom di Blogger bagi anda para blogger yang mungkin belum tau caranya bisa simak baik baik tutrial di bawah ini dengan seksama dan alangkah baiknya langsung anda peraktikan di blogger anda all sobat karena hanya membaca tana praktik tak akan afdol rasanya mungkin seperti makan tanpa lauk hehe lagsung saja.

Berikut Tutorialnya :

1. Masuk Blogger Anda
2. Masuk ke Dashboard
3. Pilih teamplate
4. Pilih Edit HTML
5. Cari kode ]]></b:skin>  Copas kode di bawah ini tepat di atasnya 



#lower {
margin: otomatis;
padding: 0px 0px 10px 0px;
lebar: 100%;
latar belakang: # 333333;
}
# lower-wrapper {
latar belakang: # 333333;
margin: otomatis;
padding: 20px 0px 20px 0px;
width: 960px; // Sesuaikan dengan lebar blog Anda
batas: 0;
}
# lowerbar-wrapper {
latar belakang: # 333333;
float: kiri;
margin: 0px 5px otomatis;
padding-bottom: 20px;
lebar: 23%; // Sesuaikan
text-align: justify;
warna: #ddd;
font: bold 12px Arial, Tahoma, Verdana;
garis-tinggi: 1.6em;
kata-bungkus: kata break;
overflow: tersembunyi;
}
.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: kiri;
batas: 0;
warna: #ddd;
text-transform: huruf besar;
font: bold 14px Arial, Tahoma, Verdana;
}
.lowerbar ul {
warna: #fff;
margin: 0 otomatis;
padding: 0;
list-style-type: none;
}
.lowerbar li {
display: block;
warna: #fff;
garis-tinggi: 1.6em;
margin-left: 0! penting;
padding: 6px;
border-bottom: 1px solid # 222;
border-top: 1px solid # 444;
list-style-type: none;
}
.lowerbar li a {
teks-dekorasi: tidak ada; warna: #DBDBDB;
}
.lowerbar li a: hover {
text-decoration: garis bawah;
}
.lowerbar li: hover {
display: block;
latar belakang: # 222;
}


6. Cari kode </body>  Copas kode di bawah ini tepat di atasnya


<div id = 'lebih rendah'>
<div id = 'lower-wrapper'>
<div id = 'lowerbar-wrapper'>
<b: bagian kelas = 'lowerbar' id = 'lowerbar1' preferred = 'yes'>
</ b: bagian>
</ div>

<div id = 'lowerbar-wrapper'>
<b: bagian kelas = 'lowerbar' id = 'lowerbar2' preferred = 'yes'>
</ b: bagian>
</ div>

<div id = 'lowerbar-wrapper'>
<b: bagian kelas = 'lowerbar' id = 'lowerbar3' disukai = 'ya'>
</ b: bagian>
</ div>

<div id = 'lowerbar-wrapper'>
<b: bagian kelas = 'lowerbar' id = 'lowerbar4' preferred = 'yes'>
</ b: bagian>
</ div>

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


Terakhir klik SAVE.


NB: Untuk mengubah ukuran anda bisa ganti kode width: 960px sesuai keinginan anda 
Untuk mengurangi kolom menjadi 3 colom anda perlu hapus kode di bawah ini


<div id = 'lowerbar-wrapper'>
<b: bagian kelas = 'lowerbar' id = 'lowerbar4' preferred = 'yes'>
</ b: bagian>
</ div>


Sekian tutorial dari saya semga bermanfaat terimakasih..

Berlangganan update artikel terbaru via email:

0 Response to "Cara Mudah Membuat Widget Footer Empat Kolom di Blog"

Post a Comment

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel