Nulisku Desain Blog Cara Membuat Kolom Widget di Bawah Posting Artikel Home Page

Cara Membuat Kolom Widget di Bawah Posting Artikel Home Page

Sobat. Jika rekan-rekan ingin memodifikasi template, khususnya ada tambahan kolom widget di bawah posting artikel pada bagian home pages (halaman depan), akan ane berikan ulasanya sore ini.

Kolom Widget di Bawah Posting Artikel Home Pages


Caranya tidak terlalu susah kok, cuma butuh energi dan kemauan aja. Tips desain kali ini saya sampaikan, karena untuk menambah cukup ruang bagi tampilan blog Sobat. Fungsi penambahan kolom widget ini nantinya akan menambah link internal dan eksternal, dan tentu bisa meningkatkan SEO blog.

Berikut langkah-langkahnya:
1. Baca do’a dulu njeh
2. Masuk akun blogger
3. Pilih template > edit HTML
4. Copas kode di bawah ini tepat di atas kode ]]</b:skin>

#post-kiri{padding-left: 5px;width: 290px;float: left;word-wrap: break-word;overflow: hidden;margin:0 8px 15px 8px;}.post-kiri a, post-kanan a {color:#555;font-size:13px}.post-kiri ul {list-style: none;color: #EAE9E8;margin: 0;padding: 0;}.post-kiri li {background: url(http://2.bp.blogspot.com/-EcBIblBtYTQ/TqALuRS_IzI/AAAAAAAAAx0/E-vzWTTOgXs/s1600/bullet-list.gif) no-repeat 0 10px;text-indent: 0;line-height: 1.2em;border-bottom: 1px dotted #ddd;margin: 0;padding: 3px 0 3px 12px;}.post-kiri h2 {font-size: 15px;font-family: Oswald;}
#post-kanan{padding-left: 5px;width: 290px;float: left;word-wrap: break-word;overflow: hidden;margin:0 8px 15px 8px;}.post-kanan a, post-kanan a {color:#555;font-size:13px}.post-kanan ul {list-style: none;color: #EAE9E8;margin: 0;padding: 0;}.post-kanan li {background: url(http://2.bp.blogspot.com/-EcBIblBtYTQ/TqALuRS_IzI/AAAAAAAAAx0/E-vzWTTOgXs/s1600/bullet-list.gif) no-repeat 0 10px;text-indent: 0;line-height: 1.2em;border-bottom: 1px dotted #ddd;margin: 0;padding: 3px 0 3px 12px;}.post-kanan h2 {font-size: 15px;font-family: Oswald;}


5. Cari (Ctrl+F) kode <div id=’main-wrapper’> dan biasanya seperti di bawah ini:

<div id=’main-wrapper’><b:section class=’main’ id=’main’ showaddelement=’no’><b:widget id=’Blog1′ locked=’true’ title=’Blog Posts’ type=’Blog’/></b:section></div>


6. Copas kode di bawah ini tepat di bawah kode </b:section> atau sebelum kode </div>

<b:if cond=’data:blog.url == data:blog.homepageUrl’>
<b:section class=’post-kiri’ id=’post-kiri’ preferred=’yes’/>
<b:section class=’post-kanan’ id=’post-kanan’ preferred=’yes’/>
</b:if>

7. Save template

Setelah melakukan langkah di atas, silakan buka layout (tata letak), akan muncul dua buat kolom widget di bawah home page (halaman utama) seperti ilustrasi di bawah ini:
dua buah kolom widget di bawah home page
Untuk menggunakan dua kolom widget tersebut, sama persis dengan menambahkan widget baru kok. Berikut live demonya.

Keren kan?

Demikian tips SEO kali ini. Semoga menambah wawasan dan ilmu tentang ngeblog, aamiin.
Salam.(http://forumblogindo.blogspot.com/).*
Sumber:
http://contohblognih.blogspot.com/2015/02/menambah-dua-kolom-widget-di-bawah-blog-posts.html
4 Likes

Author: admin

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *