Cara Menambah 2 Kolom dibawah Sidebar Blog

Cara Menambah 2 Kolom dibawah Sidebar Blog - Sebelum membahas ulasan mengenai cara membuat 2 (dua) kolom yang terletak di sidebar blog, si...

Cara Menambah 2 Kolom dibawah Sidebar Blog - Sebelum membahas ulasan mengenai cara membuat 2 (dua) kolom yang terletak di sidebar blog, simak dahulu postingan sebelumnya mengenai cara menambah footer blog multi kolom dan anda juga dapat simak cara menambah 1 kolom, 2 kolom, 3 kolom berada dibawah header blog. Bagaiamana cara membuat / menambah 2 elemen baru yang di bawah sidebar blog? Caranya tidaklah terlalu sulit, anda tinggal ikuti petunjuk yang akan saya sajikan dibawah ini. Kita mulai saja bagaimana cara membuat 2 kolom dibawah sidebar blogspot.

Cara Menambah 2 Kolom dibawah Sidebar Blog

Cara Membuat 2 Kolom dibawah Sidebar Blog
1. Login ke blogger
2. Pada dasbor, pilih Template => Edit HTML
3. Backup dulu template anda
4. Centang Expand Widget Template
5. Tekan F3, cari kode yang mirip seperti dibawah ini

#sidebar-wrapper{width:310px;float:right;word-wrap:break-word;overflow:hidden}

6. Untuk menambah 2 kolom dibawah sidebar, silahkan tambahkan kode seperti berikut dan letakkan dibawahnya

#left-col{width:130px;float:left;word-wrap:break-word;overflow:hidden}
#right-col{width:174px;float:right;word-wrap:break-word;overflow:hidden}

Maka penerapannya seperti dibawah ini :

#sidebar-wrapper{width:310px;float:right;word-wrap:break-word;overflow:hidden}
#left-col{width:130px;float:left;word-wrap:break-word;overflow:hidden}
#right-col{width:174px;float:right;word-wrap:break-word;overflow:hidden}

7. Simpan Template

8. Lalu hilangkan tanda Centang pada Expand Widget Template dan cari kode seperti dibawah ini :

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='HTML5' locked='false' title='' type='HTML'/>
</b:section>
</div>

9. Lalu tambahkan kode berikut dibawah kode </b:section>

<b:section class='sidebar' id='left-col' preferred='yes'>
<b:section class='sidebar' id='right-col' preferred='yes'>

Sehingga penerapannya seperti dibawah ini :

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='HTML5' locked='false' title='' type='HTML'/>
</b:section>
<b:section class='sidebar' id='left-col' preferred='yes'>
<b:section class='sidebar' id='right-col' preferred='yes'>
</div>

10. Selesai dan Simpan lagi template anda

Nah demikianlah Cara Menambah 2 Kolom dibawah Sidebar Blog, silahkan dicoba dan semoga bermanfaat untuk anda semua, happy blogging.

COMMENTS

Name

Activator,3,Adobe,1,aneka resep,35,AntiVairus,1,coreldraw,22,Data Recovery,1,Driver,3,education,6,IDM,1,kesehatan,21,komputer,22,Multimedia,1,news,7,photoshop,42,relegius,19,seo,27,Serial Key,4,tips wanita,10,tutorial blog,117,
ltr
item
Full Version Download: Cara Menambah 2 Kolom dibawah Sidebar Blog
Cara Menambah 2 Kolom dibawah Sidebar Blog
http://1.bp.blogspot.com/-IAoK5zITvdQ/UUFy3wer4GI/AAAAAAAAAs8/VpCsdjc8N4c/s1600/2+kolom+bawah+sidebar.jpg
http://1.bp.blogspot.com/-IAoK5zITvdQ/UUFy3wer4GI/AAAAAAAAAs8/VpCsdjc8N4c/s72-c/2+kolom+bawah+sidebar.jpg
Full Version Download
https://bloggerbondowoso24.blogspot.com/2013/03/cara-menambah-2-kolom-dibawah-sidebar.html
https://bloggerbondowoso24.blogspot.com/
https://bloggerbondowoso24.blogspot.com/
https://bloggerbondowoso24.blogspot.com/2013/03/cara-menambah-2-kolom-dibawah-sidebar.html
true
7143853511036504925
UTF-8
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS CONTENT IS PREMIUM Please share to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy