1/22/17

Kostumisasi Sidebar Default Blogger

Kostumisasi Sidebar Default Blogger

Untuk mempercantik template default blogger tentunya kita memerlukan beberapa perubahan kecil pada beberapa bagian seperti misalnya pada Sidebar. Sidebar sendiri berisi widget-widget seperti Populer Post, Recent Post, Label, Recent Comment, dan lain-lain.

Keberadaan sidebar pada sebuah blog atau website sangatlah penting, karena merupakan alat navigasi yang akan memudahkan pengunjung untuk mengakses blog kita. .

Karena pada template default blogger tampilan judul sidebarnya sangatlah sederhana dan mungkin kurang srek sobat, untuk itulah pada artikel ini saya akan memandu kamu langkah demi langkah bagaimana cara meng-kustomisasi Judul sidebar blog kamu, kemudian silahkan sobat kreasikan lagi untuk mendapatkan tampilan sesuai dengan keinginan sobat. Kostumisasi ini hanya menggunakan kode CSS.

1. Login terlebih dahulu ke akun blog Anda.
2. Masuk ke bagian Edit HTML. Caranya klik Template - Edit HTML.
3. Pastekan Kode CSS di bawah ini sebelum  ]]></b:skin>. Gunakan Ctrl + F untuk memudahkan pencariannya.
.sidebar .widget {
  clear: both;
  margin-bottom: 40px;
}
.sidebar .widget:last-child {
  margin:0!important;
}
.sidebar .widget-content {
  font-size: 90% !important;
}
.sidebar .widget-content:after {
  visibility: hidden;
  display: block;
  content: "";
  clear: both;
  height: 0;

}
.sidebar h2 {
  position:relative;
  background: #222222;
  text-transform: uppercase;
  text-align: center;
  display:block;
  margin-bottom: 20px;
  letter-spacing: 1px;
  padding: 10px;
}
.sidebar h2 span {
}
.sidebar h2:after {
  content: "";
  border-top: 5px solid #222222;
  border-right:5px solid transparent;
  border-left: 5px solid transparent;
  display: block;
  position: absolute;
  bottom: -5px;
  left: 50%;
  width: 0px;
  height: 0px;
  margin-left: -5px;
}

4. Klik Simpan/Save.

Keterangan :
  1.  Jika ingin mengganti warna backgroundnya silahkan ganti tulisan ini #222222 .
  2.  Jika ingin mengganti font dan warnanya silahkan masuk ke editor template default Blogger.  Caranya klik Template - Sesuaikan - Tingkat Lanjut - Gadget.
Jika mengikuti langkah demi langkah di atas saya yakin Anda akan dengan mudah menerapkannya.

Gimana pendapat sobat tentang perubahan pada tampilan sidebar default blogger dengan tampilan ini? Apakah Anda mempunyai desain tampilan sidebar sendiri? bagikan pendapat Anda di kolom komentar di bawah.

Happy Blogging Bro !

You might also enjoy reading

Subscribe

Daftarkan email Anda untuk mendapatkan Artikel terbaru pilihan dari Andito Blog

Blogger
Disqus
Pilih Sistem Komentar Yang Anda Sukai

No comments

Silahkan berkomentar sesuai dengan topik.