Flat Window Blogger template specially for photo or gallery blog with custom code for image post to make full width in post area. Basically, this template need image size with minimal width is 700px.
I assume your image meet the criteria
but if not, this is an example post for
image less than 700px.
Please note the image code for each styles below (without link, with link, with position, with caption)
1. Only Image
Image code
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjebnGQlGmFAHunZ_OUXOUAwJuZYOVZ50danUCdsd5zu_v9YVSHcnkdZlmlRzPTjCO9PHWdqbPHAFWiTel-78a-BoFSpExyKjDenvSk9WsQRWqRC8ry81roDHEw2AeA3Eye_VdgfhzfW0g/s1600/image7.jpg" />
Image code
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQ4bPE-4IUx_GwtEPDpE2bhJJAbFo53CG2I5LWT-D48mvZusUrIEzhvztAVVN8Mhopin52cthCtmZ8S355GwN8iiHjQrez4eS1k_BMNC2XfufhSZmW902rOhmCN5p26w9Vvt0fGFbFVh0/s320/image15.jpg" />
Image code
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2LTK4aPkpKgyY2JPDD7AX1d3JsMxVTnecKscRbZ1uDo46gphUxfEWBSRKzFWyquM-VRDH1JEBdlI8_prVyFVpAdO5wGZUY1l7ufknmOmaKm7Y34pgALpIIcGKToOML5YSe0OC5T3ZM_0/s1600/img1.jpg" height="266" width="400" />
2. Image with Link
Image code
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivbsDXPEKnkTPGERAsMvoYhZ_CV56xVapKnmPZ7LkrdIY0-mvQW3xJhf05AKGXJ1GxNQTZZe9oPv8Zp5qSOCgUsjebhZKkpIRLnryS20_9IobBEh7O7O1EAE0hql4nt5rSYaLD5ZOgJ9c/s1600/image13.jpg" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivbsDXPEKnkTPGERAsMvoYhZ_CV56xVapKnmPZ7LkrdIY0-mvQW3xJhf05AKGXJ1GxNQTZZe9oPv8Zp5qSOCgUsjebhZKkpIRLnryS20_9IobBEh7O7O1EAE0hql4nt5rSYaLD5ZOgJ9c/s1600/image13.jpg" /></a>
Image code
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiy8pHoVVf8MAtgrpZ4FvqjW-rzsJf4mTsaCkkLrJhIK2u5UNRWj99aQ8Bj9a46rTK9HQM8aBv_62_QOa6Mk2RbvX4JGX-p7RZBMTBcbToM05xIRu5Yp0jUaNFrjHCxR-8lHeIaTFhXYII/s1600/img5.jpg" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiy8pHoVVf8MAtgrpZ4FvqjW-rzsJf4mTsaCkkLrJhIK2u5UNRWj99aQ8Bj9a46rTK9HQM8aBv_62_QOa6Mk2RbvX4JGX-p7RZBMTBcbToM05xIRu5Yp0jUaNFrjHCxR-8lHeIaTFhXYII/s400/img5.jpg" /></a>
3. Image with Position
3a. Center Position
Image code
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUPQ44puV4AG9GWMdJ91rhP7W3C96akk52Y0bRZ1NfBYPtAeCHfSVwZrMMNYF_-SDHowGISUhZKoLkC98IzA5TpOJIT6ERj0R9doCBzhNDqdtMBnrujwCHpEkWiEVRVfySdJ47T2kuk58/s1600/img3.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUPQ44puV4AG9GWMdJ91rhP7W3C96akk52Y0bRZ1NfBYPtAeCHfSVwZrMMNYF_-SDHowGISUhZKoLkC98IzA5TpOJIT6ERj0R9doCBzhNDqdtMBnrujwCHpEkWiEVRVfySdJ47T2kuk58/s1600/img3.jpg" /></a></div>
3b. Right Position
Image code
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDflNhVqMNUrZzmb8o8urX5LA9tkvsFlIvCfLGsG-oYvKpjN3ZqvYMOlFBy-syzLaSVa56tMhbfVOyIe_Pe_WD9887ta4DiElL91R5jnFFMlM71PqDSOX6TTz5NJry69SO1wXFsqrfcLc/s1600/img4.jpg" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDflNhVqMNUrZzmb8o8urX5LA9tkvsFlIvCfLGsG-oYvKpjN3ZqvYMOlFBy-syzLaSVa56tMhbfVOyIe_Pe_WD9887ta4DiElL91R5jnFFMlM71PqDSOX6TTz5NJry69SO1wXFsqrfcLc/s1600/img4.jpg" /></a></div>
3c. Left Position
Image code
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjPdxKQK9ZpsJBIod7XK7Bx_Z74Bpg8A2sGvnDphCylxK2N9fBS9AMrHc8PMNWmMVyoWQd-o5cXWv88PeDFzC80y37M_tbvRiR0s3MCUFMjvRQNssvhAknhkAgnii5jz_mH4KbI6obFjc/s1600/img34.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjPdxKQK9ZpsJBIod7XK7Bx_Z74Bpg8A2sGvnDphCylxK2N9fBS9AMrHc8PMNWmMVyoWQd-o5cXWv88PeDFzC80y37M_tbvRiR0s3MCUFMjvRQNssvhAknhkAgnii5jz_mH4KbI6obFjc/s400/img34.jpg" /></a></div>
4. Image with Caption
4a. Image Center Position
 |
| This is a caption image |
Image code
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheTrmcWZs7uorX92-BLWb7y-qZQMjIv1fRBL837Pm4v39UxFYNmMl50FGZK6M3pmnfVW53SR6A_tsV5Aen5_SNkvsSIhB-RLTnRn9Kcp8GrsyEVlGaH_7ytMWnjb1ku-BU_hDRz1thmKE/s1600/img19.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheTrmcWZs7uorX92-BLWb7y-qZQMjIv1fRBL837Pm4v39UxFYNmMl50FGZK6M3pmnfVW53SR6A_tsV5Aen5_SNkvsSIhB-RLTnRn9Kcp8GrsyEVlGaH_7ytMWnjb1ku-BU_hDRz1thmKE/s1600/img19.jpg" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">This is a caption image</td></tr>
</tbody></table>
4a. Image Right Position
 |
| Lorem ipsum dolor sit amet |
Image code
<table cellpadding="0" cellspacing="0" class="tr-caption-container" style="float: right; margin-left: 1em; text-align: right;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsuO6FlEQTXWvUsgB71cyhlwGjq1AqnQeJlQ2ropM8ZIQX6kNAoJRY87ro0CVANqtLmIhx_pu99DiYC4C4qjZ9bM9BySbYVJb0Pen_Kk7zMUtw3EtepYNOxv907JG-PD2vCo68uGyh6pQ/s1600/image4.jpg" imageanchor="1" style="clear: right; margin-bottom: 1em; margin-left: auto; margin-right: auto;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsuO6FlEQTXWvUsgB71cyhlwGjq1AqnQeJlQ2ropM8ZIQX6kNAoJRY87ro0CVANqtLmIhx_pu99DiYC4C4qjZ9bM9BySbYVJb0Pen_Kk7zMUtw3EtepYNOxv907JG-PD2vCo68uGyh6pQ/s1600/image4.jpg" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Lorem ipsum dolor sit amet</td></tr>
4a. Image Left Position
 |
| Omnis iisque voluptatum ad duo |
Image code
<table cellpadding="0" cellspacing="0" class="tr-caption-container" style="float: left; margin-right: 1em; text-align: left;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiBLxpa_8V6dgbmjofWe4RiR7t9BrnD4rrw4GaB8z1CKhGvL4R3vGZYrvJb9VCNAZg2uoDEKE0fOHfPeMw7X2EXuenrOyANX1PPZ-qtGUrotekpUnT14vBJBoPvZ60srCVol7nKO2HGt4/s1600/img12.jpg" imageanchor="1" style="clear: left; margin-bottom: 1em; margin-left: auto; margin-right: auto;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiBLxpa_8V6dgbmjofWe4RiR7t9BrnD4rrw4GaB8z1CKhGvL4R3vGZYrvJb9VCNAZg2uoDEKE0fOHfPeMw7X2EXuenrOyANX1PPZ-qtGUrotekpUnT14vBJBoPvZ60srCVol7nKO2HGt4/s1600/img12.jpg" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><span style="background-color: white; color: #80868a; font-family: Arimo; font-size: 14px; line-height: 24px; text-align: left;">Omnis iisque voluptatum ad duo</span></td></tr>
</tbody></table>
Note :
- Do you want a normal image post?? Let me know. I will help you
Post a Comment