Pasang widget pesanan disetiap posting

'Pasang widget pesanan disetiap posting' itulah tajuk yang penulis rasa sesuai untuk tutorial blog kali ini.Mungkin juga boleh dinamakan sebagai 'Tulis teks ringkas dibawah posting'.Hentam sajelah mengenai tajuknya, yang penting jika anda berminat untuk pelajarinya, ikuti tutorial ini...

1.Login ke blogger anda.

2.Klik Layout-->Edit html, dan beri tanda pada Expand Template Widget

3.Sebelum itu jangan lupa backup dulu template anda.

4.Cari dulu kod ini ]]></b:skin>

5.Kemudian copy kod dibawah ini dan pastekan/letakkan di atas kod tadi ]]></b:skin>

#kotak {
background: #fff;
width: 200px;
color: #000000;
font-size: 12px;
font-family: Arial, Tahoma, Verdana;
font-weight: normal;
margin: 10px 0px 0px 0px;
padding: 3px;
border-top: 1px solid #666666;
border-right: 1px solid #ddd;
border-left: 1px solid #666666;
border-bottom: 1px solid #ddd;
display: inline;
}
#tombol {
background: #2B74B4;
color: #FFFFFF;
font-size: 11px;
font-family: Arial, Tahoma, Verdana;
margin: 0px 0px 0px 5px;
padding: 2px;
border: 1px solid #234B69;
font-weight: bold;
}
#email{
background: #FFFFFF;
color: #000000;
font-size: 12px;
font-family: Arial, Tahoma, Verdana;
margin: 0px;
padding: 4px;
border-top: 1px solid #666666;
border-right: 1px solid #DDDDDD;
border-left: 1px solid #666666;
border-bottom: 1px solid #DDDDDD;
}
#submit {
background: #2B74B4;
color: #FFFFFF;
font-size: 12px;
font-family: Arial, Tahoma, Verdana;
padding: 4px;
margin: 0px;
border: 1px solid #234B69;
}

6.Anda boleh klik preview dulu, jika tiada sebarang error..terus ke langkah berikutnya.

7.Cari kod ini <p><data:post.body/> (ingat setiap template mungkin berbeza sedikit kodnya,jika template anda telah ada fungsi'Read more..' maka kodnya seperti dibawah..

<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/>
<a expr:href='data:post.url'><strong>Read more...</strong></a></p>
</b:if>

8.Copy kod dibawah ini dan pastekan dibawah kod <p><data:post.body/> yang berwarna merah diatas.

<div style='padding:10px;margin:10px 0px 10px 0px;background:#eee;text-align:left;border:1px solid #ddd'>
<p>Pecah kaca pecah gelas, sudah baca harap balas.</p>
</div>

Maka kod selengkapnya akan jadi sepert ini

<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>

<div style='padding:10px;margin:10px 0px 10px 0px;background:#eee;text-align:left;border:1px solid #ddd'>
<p>Pecah kaca pecah gelas, sudah baca harap balas.</p>

</div>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/>
<a expr:href='data:post.url'><strong>Read more...</strong></a></p>
</b:if>

9.Klik preview dulu, jika tiada sebarang error, anda telah berjaya menjalani tutorial ini.Klik save.

P.s. Text "Pecah kaca pecah gelas, sudah baca harap balas" boleh diubah.Anda boleh tulis text lain,masukan gambar,letak email dan sebagainya ikut kesesuaian sendiri.Demo

Mungkin artikel dibawah yang sedang anda cari