Cara menambah 2 Element widget di bawah posting

       Sebelumnya apa kabarnya ni sobat-sobat blogger di seantero maya pada???.

Semoga masih tetep selalu dalam perlindunganNya yah yah. Pada kesempatan kali ini ane mo kasih sekelumit trik yang barang kali bisa bermanfaat bagi sobat-sobat semua yaitu cara menambah 2 element widget yang letaknya persis berada di bawahnya box posting. jika sobat bertanya, apa untung ato manfaatnya??? banyak sekali jawabnya, heheeeee,... diantaranya bisa kamu pasang disitu profil view kamu, label posting ato yang laennya. sbb di samping dekat dengan posting yang otomatis langsung terlihat oleh para pembaca artikel-artikel agan, Nahh... kan langsung ketemu tuh ma si empunya blog,heeee...

 Mungkin langsung saja ane bagi sedikit triknya. Tidak sesulit yang agan-agan bayangkan ko' asal sesuai dengan trik yang ane bahas di bawah nanti. Tapi mungkin butuh sedikit pelebaran area posting saja sih sebenarnya untuk menyesuaikan panjang lebarnya element widget yang mo kita tambahkan nanti. dan untuk membuatnya silahkan sobat ikuti langkah-langkah berikut ini :

1. Login : Login ke Blogger.

•  Tulis User Name atau Alamat Email.
•  Tulis Password/Kode Rahasia/Sandi.
•  KLIK "Login".

2. Dasboard/Dasbor : Di halaman selanjutnya setelah klik "Login" akan terlihat halaman Dasboard. Cari dan klik "Design/Rancangan".
3. Design/Rancangan : KLIK "Edit HTML".
4. Edit HTML : Lakukan Back-up Templates.

• KLIK "Download Template Lengkap/Full Download Templates.
• Simpan file template di folder PC. Berikan nama yang mudah dikenali disertai waktu penyimpanan (misal.Modifikasi-OKT22-10) agar setiap kali back-up kita punya data template dengan kronologis yang terdata rapi.
• Kembali ke Halaman Edit HTML.

5. Cari kodeCSS (nanti ane sertakan di bagian posting paling bawah), kemudian copy dan pastekan di atas kode ]]></b:skin>.
6. Lanjutkan dengan mencari kode 
<b:section class='main' id='main' showaddelement='no'>
Di bawah kode tersebut akan terdapat kode berikutnya dengan bentuk seperti ini :

 <b:widget id='Blog1' locked='true' title='Posting Blog' type='Blog'/>
</b:section>

7. Letakkan xHTML tepat di bawahnya.
8. KLIK "SAVE Templates/Simpan Template".
9. Lihat hasilnya dengan membuka Page Elements/Element Laman. Bila penambahan kode berhasil dengan baik, maka akan terlihat dua buah element baru tepat di bawah Post Widget.
10. Coba gunakan untuk menempatkan widget dan lihat hasilnya dengan membuka blog.
11. Untuk percobaan sampeyan bisa menggeser (drag) widget profile dan satu widget yang lain untuk ditempatkan di elemen yang baru selesai dibuat.

dan untuk tampilannya kurang lebih seperti gambar di bawah ini.

Lihat di bawah kolom komentar. Dua widget dalam elemen baru di bawah bok posting.

Kode CSS

#bawahpostingkiri, #bawahpostingkanan {
        word-wrap: break-word; 
        overflow: hidden;     
        padding: 0;
        margin: 0;
}
#bawahpostingkiri {
        float: left;
}
#bawahpostingkanan {
        float:right;
}
#bawahpostingL {
        margin:20px 5px 15px 0;
        padding:5px;
}
#bawahpostingR {
        margin:20px 0 15px 5px;
        padding:5px;
}
#bawahpostingL .widget, #bawahpostingR .widget {
        margin:0;
        padding:0
}
#bawahpostingL .widget {
        width:185px;
}
#bawahpostingR .widget {
        width:185px;
}

]]></b:skin>

xHTML

<div id='bawahpostingkiri'>
<b:section class='bawahpostingL' id='bawahpostingL' showaddelement='yes'/>
</div>
<div id='bawahpostingkanan'>
<b:section class='bawahpostingR' id='bawahpostingR' showaddelement='yes'/>
</div>

Contoh penempatan dan penyimpanan xHTMLxHTML

<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Posting Blog' type='Blog'/>
</b:section>

<div id='bawahpostingkiri'>
<b:section class='bawahpostingL' id='bawahpostingL' showaddelement='yes'/>
</div>
<div id='bawahpostingkanan'>
<b:section class='bawahpostingR' id='bawahpostingR' showaddelement='yes'/>
</div>

 
Keterangan :
jangan lupa untuk ukuran silahkan sobat sesuaikan dengan lebar area
posting milik sobat-sobat semua.
Dan alangkah lebih baiknya periksa setiap perubahan yang dilakukan dengan melihat hasilnya di Elemen Laman dan halaman blog.
Untuk memudah cek hasil perubahan, gunakan elemen baru untuk wadah widget profile dan satu widget yang laen.
Selamat Berkarya,.. ^_^'

Posting Komentar