Menambah Image Caption.

Tujuan menambah Image Caption supaya image / gambar lebih mudah di fahami dan kelihatan lebih menarik.

1. SIGN IN akaun blogger anda.

2. Pilih LAYOUT --> EDIT HTML.

3. BACKUP TEMPLATE anda dahulu untuk mengelakkan sebarang masalah.

4. Klik pada EXPAND WIDGET TEMPLATE seperti screenshot di bawah ini.

5. Cari kod ini.

]]></b:skin>

6. Copy kod di bawah dan letakkan di atas kod tadi.

.imgcontainer {
position:relative;
float:left;
}
.caption {
font: normal 1em/1.3em arial;
background:#fff;
color:#000;
position:absolute;
bottom:0;
left:0;
margin-bottom:20px;
text-align:center;
width:100%;
opacity:.75;
filter:alpha(opacity=85);
}

7. SAVE TEMPLATE.

8. Pilih POSTING --> NEW POST --> EDIT HTML

9. UPLOAD IMAGE dan tambahkan dengan kod di bawah gantikan Url / text berwarna merah.

<div class="imgcontainer">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJkM3xS9HMcGVJoZWm_FoDLrGa8ngcH7793fb_e5b89BdfwAXjR5-X09_zCVSQlIEf0P0n2mDYChAlH969lTAlWVSZin-1tGFu356JcBcRQgp1TaWIVqiaxP_hLsjrUyuZkJN7xsK4qB4/s1600-r/syamzonebannerexchange.png"/>
<div class="caption">Tricks Untuk Blogspot</div>
</div>

10. Setelah selesai PUBLISH POST.