Cara Membuat 3 Column Fotter With Style Keren Di Blog

Cara Membuat 3 Column Fotter With Style Keren Di Blog - Mungkin, Sobat Mempunyai 3 Kolom Fotter Di Blog Sobat. Dengan Untuk Mendapatkan Tampilan Yang Bagus, Sobat Harus Menambahkan Widget Yang Enak Di Pandang. Kadang-Kadang Colum Ini Dipakai Untuk Widget Pengikut Dan Yang Lainnya Seperti widget (Google Friend Connect), Recent posts, Recent comments,  Atau Iklan. Tetapi Sobat Bisa Menambahkan Beberapa Widget Lagi. Sekarang, Rizki Akan Memberitahukan Tentang Cara Membuat 3 Column Fotter With Style Di Blog Sobat, Ini Dia Turitorialnya Sob.


Turitorial Cara Membuat 3 Column Fotter With Style Di Blog

1. Log in Ke Akun Blogger Sobat
2. Pergi Design --> Edit HTML
3. Copas Kode Di Bawah Ini, Dan Simpan Sebelum Tag/Kode ]]></b:skin>

/* -----   LOWER SECTION   ----- */
#lower {
       margin:auto;
       padding: 0px 0px 10px 0px;
       width: 100%;
       background:#333434;
}
#lower-wrapper {
       margin:auto;
       padding: 20px 0px 20px 0px;
       width: 960px;
}
#lowerbar-wrapper {
     border:1px solid #DEDEDE;
       background:#fff;
       float: left;
       margin: 0px 5px auto;
       padding-bottom: 20px;
       width: 32%;
       text-align: justify;
       font-size:100%;
       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;
       color:#0084ce;
        text-transform:uppercase;
      font: bold 14px Arial, Tahoma, Verdana;
       border-bottom:3px solid #0084ce;
}
.lowerbar ul {
      margin: 0px 0px 0px 0px;
      padding: 0px 0px 0px 0px;
      list-style-type: none;
}
.lowerbar li {
      margin: 0px 0px 2px 0px;
      padding: 0px 0px 1px 0px;
      border-bottom: 1px dotted #ccc;
}

 

=> Ubah Yang Berwarna Merah Dengan Warna Backaground Yang Sobat Inginkan => Ubah Yang Berwarna Biru Dengan Lebar Widget Yang Sobat Inginka. => Ubah Yang Berwarna Hijau Warna Yang Sobat Inginka. => Ubah Yang Berwarna => Ubah Yang Berwarna Biru Langit Dengan Ukuran Text dan Font Yang Sobat Inginkan => Ubah Yang Berwarna Ungu Untuk Tampilan dan Warna Judul Border Yang Sobat Inginka
=> Ubah Yang Berwarna Pink Dengan Ukuran, Tampilam Dan Warna Links Border.

4. Kemudian copy code Dibawah ini, Dan Simpan Sebelum Tag/Kode </body>

<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 style='clear: both;'/>
</div> </div>

 

5. Kemudian Save Template. Check Di Design --> Page Elements


Semoga Berhasil : Cara Membuat 3 Column Fotter With Style Di Blog