Cara Mengatasi Gambar Thumbnail Buram / Blur (Blogger)
Tutorial ini tidak memakai script / javascript untuk mengubah resolusi standar url thumbnail Blogger, sebagaimana tutorial-tutorial lain yang sudah banyak bertebaran. Apa yang ingin aku bagikan kali ini bergotong-royong sudah diajarkan oleh Blogger. Prinsip kerjanya hampir sama ibarat gambar thumbnail di dalam widget popular posts. Dengan cara tersebut, cita-cita aku tutorial ini sanggup dipakai untuk semua jenis template Blogger, dan mudah-mudahan tidak akan lama alias kadaluarsa.
Penyebab gambar thumbnail buram
2. Hapus isyarat di atas, kemudian ganti dengan isyarat di bawah ini.
Dengan memakai isyarat di atas, secara otomatis akan mengubah isyarat s72-c menjadi w300-h225-p-k-no-nu dan menciptakan resolusi gambar thumbnail berubah dari 72px × 72px menjadi 300px × 225px. Dengan demikian gambar thumbnail akan terlihat terang meskipun ukurannya diperbesar.
Catatan:
Perlu Anda ketahui, bahwa resolusi standar untuk gambar thumbnail yang disediakan pihak Blogger hanya sebesar 72pixel, sanggup dilihat pada url gambar thumbnail tercantum isyarat s72-c. Jika kita memaksakan untuk menampilkan gambar thumbnail dengan ukuran yang lebih besar, imbas yang paling dirasakan yaitu tampilan gambar thumbnail menjadi buram, blur, brecek, bureng, pecah-pecah, dan pastinya hal ini sanggup menciptakan sakit mata, alasannya tampilan blog khususnya pada halaman utama menjadi tidak lezat dipandang.
Cara atasi nya
Sebagaimana yang tertulis pada judul artikel di atas. Berikut ini cara mengatasi gambar thumbnail blog yang buram.
1. Silahkan masuk ke Edit HTML, kemudian cari isyarat ibarat di bawah ini. Letaknya sanggup di post var='post' atau mobile-index-post, tergantung versi yang Anda gunakan.
Cara atasi nya
Sebagaimana yang tertulis pada judul artikel di atas. Berikut ini cara mengatasi gambar thumbnail blog yang buram.
1. Silahkan masuk ke Edit HTML, kemudian cari isyarat ibarat di bawah ini. Letaknya sanggup di post var='post' atau mobile-index-post, tergantung versi yang Anda gunakan.
<img expr:alt='data:post.title' expr:src='data:post.thumbnailUrl'/>
2. Hapus isyarat di atas, kemudian ganti dengan isyarat di bawah ini.
<b:with value='data:post.thumbnailUrl ? resizeImage(data:post.thumbnailUrl, 300, "4:3") : data:post.thumbnail' var='image_bro'>
<img expr:alt='data:post.title' expr:src='data:image_bro'/>
</b:with>
<img expr:alt='data:post.title' expr:src='data:image_bro'/>
</b:with>
Dengan memakai isyarat di atas, secara otomatis akan mengubah isyarat s72-c menjadi w300-h225-p-k-no-nu dan menciptakan resolusi gambar thumbnail berubah dari 72px × 72px menjadi 300px × 225px. Dengan demikian gambar thumbnail akan terlihat terang meskipun ukurannya diperbesar.
Catatan:
Silahkan ganti angka 300 sesuai dengan kebutuhan. Jika lebar maksimal untuk gambar thumbnail blog Anda hanya 200px, sebaiknya turunkan angkanya menjadi 200 saja. Karena bila terlalu tinggi angkanya, itu sanggup menjadi beban bagi pengguna atau sanggup dikatakan terjadi pemborosan data, kasihan pengunjung blog Anda.
Pada isyarat HTML di atas, aku memakai rasio 4:3. Silahkan diubah sesuai kebutuhan Anda.
Pada isyarat HTML di atas, aku memakai rasio 4:3. Silahkan diubah sesuai kebutuhan Anda.
Komentar
Posting Komentar