Cara Menambah Dua [2] Kolom Dibawah Posting Blog

Next topik sob, kali ini saya akan membahas bagaimana cara membuat dua (2) kolom di bawah posting blog, lihat contoh gambar dibawah sob, kiranya seperti itulah yang kali ini akan saya buat.
Sebelum kita praktek, saya jelaskan terlebih dahulu apa kiranya fungsi dari kotak box dibawah posting itu. pertama, dengan kotak box tersebut, kita bisa menambahkan elemen-elemen penting agar pengunjung blog bisa lebih mudah menemukan apa yang mereka cari, bisa juga kita menaruh artikel-artikel penting didalamnya. tapi tentunya semua itu tergantung sama kreatifitas kita masing-masing. intinya mempermudah.

Oke, seperti yang sobat lihat pada gambar dibawah, kolom kiri berisi "langganan RSS FEED" sedangkan kotak ke dua berisi "artikel terkait/related post.

Demo

Cara membuatnya sebagai berikut:

• Login ke akun blogger sobat
• Masuk Rancangan/Layout
• Edit HTML
• Klik "Download Template Lengkap" (ini untuk memBackUp template sobat)
• Beri tanda centang "Expand Template Widget"
• Carilah Kode: ]]></b:skin>
• Lalu taruh kode dibawah ini, di atas kode: ]]></b:skin>

#related{background:#eee url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqTxa8skeoatnQVTHzxHHpbq4_vU96LRVT4pXerDaAkV8Jk2oI-vbS8_CRZmODshW0fBYGsubIDQYmWRl-0s__5O_PEBYvpizuqtLoPk3S3EeUo7e8IH4VmEP5gdWdTXMfLV-rEcx5f-w/) 45% 0 repeat-y;border:1px solid #ddd;color:#000;margin:0 0 10px;padding:15px}
#related .related-posts{font-weight:400;width:53%;float:right}
#related .related-posts p{margin:0}
#related .related-posts h3,#related .related-posts h2,#related .related-posts h1{font-size:12pt;letter-spacing:0;margin:0}
#related .related-posts ol{font-weight:400;margin:2px 0 0}
#related .subscribe{width:43%;float:left;color:#000}
#related .subscribe p.intro{font-weight:400}
#related .subscribe p.feed{margin-bottom:10px;font-weight:700;padding-left:21px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh95o3C-CNZS8lxzYmRb0xcB8-ZwTePxCEHD84oOp6_gvU6AGoW08v56RjhZCksSVnyFs14-l9cqC0k2DQdpHHTUEp_qNlSBTp2-uoJx6y0OIsMKADsYZhDEKsZcUQ7gwRodTIlJEs2BfE/) 0 50% no-repeat;vertical-align:middle}
#related .subscribe form{margin:0;padding:0}
.clearfix:after{content:".";display:block;
height:0;clear:both;visibility:hidden}
.clearfix{display:inline-block}

• Kemudian cari kode beririkut:

<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/> </b:if>

• Letakkan kode di bawah ini diantara kode: <b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/> dan kode: </b:if>
  

<div class='clearfix' id='related'>
<div class='subscribe'>
<p class='feed'>
<a href='http://disini letakkan Link Feed Sobat/feeds/posts/default'>Berlangganan via RSS Feed</a></p><p class='intro'>disini letakkan kode Form Berlangganan Sobat</p></div>
<div class='related-posts'>disini letakan kode Related Post Sobat</div></div>

• Perhatikan text berwarna biru, gantilah dengan alamat feed sobat, dan untuk text warna merah ganti dengan kode script form berlangganan sobat, dan untuk warna hijau, ganti dengan kode script related post sobat. Buat tambahan, kode di atas di template saya, saya taruh di bawah kode:

<div class='post-footer'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>

Penting!!
Karena setiap template mempunyai kode script yang berbeda-beda, Bila sobat mendapat kesulitan menaruh kode di atas, sobat bisa tinggalkan komentar disini, sebisa mungkin insya4JJL, saya akan bantu.
Cukup sekian dari saya, semoga bermanfaat.