[x] Tutup Iklan


Membuat / Menambahkan Sidebar Sendiri di Ujung Blog

//Ditulis oleh : Puji Antoro | 2012-07-04T04:42:00-07:00

Selamat datang kembali,anda sedang membuka halaman Membuat / Menambahkan Sidebar Sendiri di Ujung Blog yang telah kami publikasikan di blog sederhana berkonsep Tutorial Blog dan Seo Blogspot ini.Kami menyampaikan terima kasih atas kunjungan anda,dan kami ucapkan selamat membaca!


Cara Menciptakan Gadget / Element Baru Sidebar di Sebelah Kanan Atas Blog

Bismillah - yang akan kita ciptakan ini sob,hanyalah sekedar kreasi bagi kamu yang kesulitan membuat sidebar sendiri disebelah kanan blogger template satu kolom.
Seperti posting beberapa minggu lalu gan,kami pernah share dan mereferensikan blogger template satu kolom,yang mana template ini tidak memiliki sidebar (namanya jg satu kolom beg* pent-)

Masih ingat ga sob saat beberapa waktu lalu di blog ini memposting tentang cara menambah element baru dan membuat sidebar berada dikanan dan kiri posting? Nah,teknik yang kita gunakan kali ini kira-kira akan mirip seperti itu.

Langkah dan Cara Membuat Sidebar Blog Sendiri


Sebagai ilustrasi,sengaja kami share dengan media gambar,biar ga jlimet geto :D

Saat template satu kolom yang saya miliki dilihat dari view 'Rancangan / Design' maka akan tampil seperti ini:

trik cara membuat sidebar blogspot.
Lihat Gambar Lebih Besar Klik disini


Sekarang,sobat klik 'EDIT HTML' seperti yang diyunjukkan pada gambar dibawah ini:

cara membuat sidebar blogger sendiri.
Lihat Gambar Lebih Besar Klik disini


Setelah itu,sobat cari kode / barisan css berikut (gunakan Ctrl+F di keyboard untuk mempermudah pencarian)

#outer-wrapper {

Nah,nanti barisan kode css ditemplate sobat akan tampak seperti ini,yah meskipun ga persis (meskipun satu kolom khan beda template :D) :

membuat sidebar sendiri.
Lihat Gambar Lebih Besar Klik disini


**dalam gambar ada 3 kode angka yang saya beri tanda lingkaran,dari ketiga angka tersebut harus sama,#header ,#outer-wrapper dan untuk #footer.

Nah,lanjut ya,tepat dibawah barisan kode #outer-wrapper { misal template milik saya barisan #outer-wrapper { tampil seperti ini:

#outer-wrapper {
margin: 0px auto;
width:500px;
background:white url() top left repeat-y;
}


letakkan kode barisan css sidebar baru kita berikut setelah barisan kode tadi:

#sidebar-wrapper {
width: 220px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}


Nah,ingat meletakkannya juga harus benar ya gan,kurang lebih nanti akan tampil seperti ini:

membuat sendiri sidebar.
Lihat Gambar Lebih Besar Klik disini


Setelah itu,cobat cari kode <body> (gunakan Ctrl+F di keyboard untuk mempermudah pencarian)

membuat sidebar blogger.
Lihat Gambar Lebih Besar Klik disini


Setelah sobat menemukan kode <body> letakkan persis dibawahnya kode ini:

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' maxwidget='2' showaddelement='yes' preferred='yes'/>
</div>

Jika sobat meletakkannya benar maka akan tampak seperti ini:

blogger sidebar.
Lihat Gambar Lebih Besar Klik disini

Kode inilah yang akan tampil dimana saja kita inginkan keberadaannya,jika sobat ingin meletakkan widget ini difooter,header dan lain sebagainya,sobat cari sendiri tempatnya ya (Insya Allah kita akan bahas nanti)

Lanjut ya,setelah sobat terapkan langkah-langkah diatas,simpan template sobat dan lihat pada tab 'Rancangan / Design' dan TADA!!!!! maka nanti akan tampil seperti ini:

sidebar blogger.
Lihat Gambar Lebih Besar Klik disini

Sekarang dari template sobat satu kolom,sobat sudah bisa ciptakan sidebar sendiri khan? Selamat berkreasi dan semoga berhasil ya gan! see you:D

★ ★ ★ ★ : 4.0 99 reviews




Close/Tutup Referensi Hasil Pencarian [x]



Untuk menjelajahi kata kunci ini di situs pencarian Google,silakan anda klik di:

SINI (RECOMMENDED)
Untuk link alternativ silakan klik di:
Membuat / Menambahkan Sidebar Sendiri di Ujung Blog
Dan klik di :
SINI (RECOMMENDED)
Atau klik di:
Membuat / Menambahkan Sidebar Sendiri di Ujung Blog
Judul : Membuat / Menambahkan Sidebar Sendiri di Ujung Blog
Written by : Pelajaran Blog
4.0 stars based on 99 reviews

Note : Tutorial Membuat / Menambahkan Sidebar Sendiri di Ujung Blog ini sengaja kami dedikasikan untuk blogger pemula,review artikel tentang Membuat / Menambahkan Sidebar Sendiri di Ujung Blog ini juga hanya kami publikasikan untuk garis besarnya saja.Semoga bermanfaat.

 Search
(c) 2014 - Pelajaran Tutorial Panduan Tips Trik Blog dan Teknik Cara Belajar Seo Blogspot untuk Blogger Pemula