Cara Memposting Gambar Berkualitas Tinggi di Blog

Biasanya ketika kita mengupload gambar ke blogger (dengan ukuran yang besar yang dipilih) gambar tersebut secara otomatis akan di resize atau diatur ukurannya. Efeknya yaitu kualitas gambar yang dihasilkan lebih jelek. Jadi untuk membuat gambar menjadi lebih jelas dan tajam trik ini dapat bermanfaat.

Pertama-tama hitunglah berapa ukuran gambar yang anda ingin tampilkan (biasanya lebih sedikit kecil dari tubuh posting). Seumpamanya ambil blog ini sebagai contoh. Body utamanya yaitu 570 px. Jadi ukuran maksimum untuk memposting gambar yang besar yaitu 570 px. Tetapi untuk membuat gambar terlihat lebih menarik kita harus memberikan padding, jadi pilihlah ukuran yang agak kecil dari tubuh posting.

1. Sekarang masuk ke Rancangan, klik Edit HTML
2. Cari ini ]]></b:skin>
3. Tambahkan ini sebelum kode diatas

img {
max-width: 560px;
width: expression(this.width > 560 ? 560: true);
}

Lihat angka berwarna merah itu adalah lebar gambar

4. Simpan perubahannya.
5. Selanjutnya jika sobat sedang memposting ...maka upload image seperti biasa. Masuk ke tab Eidt HTML pada posting dan kode gambar akan terlihat mirip seperti ini:

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaDSQk2jkzfeex3bVvLg2FWjOGBgMNAuXxZx8BGqyACPCuFYw5WL2YNsxpoWk_Q0iXDdkteYn0NNUmlxLFBkYfWTME3cAGO7ogZlpjJBS8CDkdZuqrrBIFTnnLJGUD_qRNWQyq1f8LsIuC/s1600-h/megan+fox.jpg"><img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer; width: 280px; height: 400px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaDSQk2jkzfeex3bVvLg2FWjOGBgMNAuXxZx8BGqyACPCuFYw5WL2YNsxpoWk_Q0iXDdkteYn0NNUmlxLFBkYfWTME3cAGO7ogZlpjJBS8CDkdZuqrrBIFTnnLJGUD_qRNWQyq1f8LsIuC/s400/megan+fox.jpg" alt="Normal Picture without the hack" id="BLOGGER_PHOTO_ID_5350218059319919970" border="0" /></a>

6. Yang perlu dilakukan selanjutnya yaitu menghilangkan teks yang berwarna biru dan gantikan dengan s400 dengan s800 sehingga kode terlihat seperti ini:

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaDSQk2jkzfeex3bVvLg2FWjOGBgMNAuXxZx8BGqyACPCuFYw5WL2YNsxpoWk_Q0iXDdkteYn0NNUmlxLFBkYfWTME3cAGO7ogZlpjJBS8CDkdZuqrrBIFTnnLJGUD_qRNWQyq1f8LsIuC/s1600-h/megan+fox.jpg"><img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaDSQk2jkzfeex3bVvLg2FWjOGBgMNAuXxZx8BGqyACPCuFYw5WL2YNsxpoWk_Q0iXDdkteYn0NNUmlxLFBkYfWTME3cAGO7ogZlpjJBS8CDkdZuqrrBIFTnnLJGUD_qRNWQyq1f8LsIuC/s800/megan+fox.jpg" alt="Normal Picture without the hack" id="BLOGGER_PHOTO_ID_5350218059319919970" border="0" /></a>

Lihat hasilnya, image atau gambar yang anda upload akan terlihat lebih besar pada blog!!!!