Cara Membuat Tiga Kolom di Bawah Postingan

Cara Membuat Tiga Kolom di Bawah Postingan. hai sobat-sobat My Information, kembali lagi dengan saya. nah, pada tutorial kali ini saya akan menjelaskan cara membuat tiga kolom di bawah postingan blog. dengan membuat kolom tersebut, kita dapat menyimpan sebuah widget yang telah kita buat. oh iya, cara ini sudah sangat teruji dan terbukti berhasil. lihat screen short dari menu rancangan blog saya. bagaimana? tertarik juga? kalau tertarik silahkan ikuti tutorialnya di bawah ini  :

• login dulu ke blog
• lalu pilih rancangan/design
• klik edit HTML, jangan lupa EXPAND WIDGET TEMPLATE
• cari kode ]]></b:skin>, dan copas kode di bawah ini di atas kode yang dicari

• /* bottom

  ---------------------------- */ #bottom {

  width: 660px;

  position: relative;

  clear:both;

  margin: 0 auto;

  color:#fff;

  float: left;

  background:#BDBABD;

  padding: 15px 0 15px 0;

  }

  #bottom h2 {

  padding: 5px 0 2px 0;

  margin: 0 0 10px 0;

  color:#ff5a00;

  font-size: 24px;

  letter-spacing: -1px;

  border-bottom: 1px solid #fff;

  }

  
  

  #bottom ul {

  padding: 0;

  margin: 0;

  }

  #bottom ul li {

  line-height: 26px;

  list-style-type: none;

  border-bottom: 1px dashed #031c5d;

  }

  #bottom ul li a {

  display: block;

  padding: 0 10px;

  color:#0701FD;

  text-decoration: none;

  }

  #bottom ul li a:hover {

  background: #B1ACB1;

  }

  
  

  #left-bottom { /* yang ini nih kode kolom kiri */

  width: 205px;

  float: left;

  padding-left:10px;

  }

  #center-bottom { /* kalo yg ini kode kolom tengah */

  width: 205px;

  float: left;

  padding-left:10px;

  }

  #right-bottom { /* kalo yg ini kode kolom kanan */

  width: 205px;

  float: left;

  padding: 0 5px 0 10px;

  }

• kemudian lihat pada kode </body>, dan cari kode yang mirip seperti ini 

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

• copas kode berikut di atas kode yang mirip tadi

• <div id='bottom'> <b:section class='bottom' id='left-bottom'/>

  <b:section class='bottom' id='center-bottom'/>

  <b:section class='bottom' id='right-bottom'/>

  </div>

• masih ada lho kawann, yaitu simpan templatenya hahaha

Baca Juga Cara Menambahkan Empat Kolom di Atas Footer