16 Haziran 2014

Blogger Resim Kalitesi Yükseltmek


Blogger alt yapısı ile hazırlanmış bloglarda bazen görüntü kalitesi sorunu ortaya çıkabiliyor. Bloggerın bizlere sunduğu bir imkan olarak yazılarımıza resim yükleme işlemi oldukça hızlı bir şekilde gerçekleşebiliyor. Fakat blogger yazılarımız için yüklediğimiz resimlerin kalitesini biraz düşürebilmekte. Bu durum resim blogları için oldukça kötü bir durum.

Blogger resim kalitesini arttırabilmenin yolları:
  • Çözünürlüğü yüksek olan ve iyi bir fotoğraf makinesi ile çekilmiş resimleri kullandığınızdan emin olun. Bulanık görüntüler kullanmaktan kaçının.
  • Herhangi bir resim düzenleme programı kullanarak resimlerinizin boyutlarını değiştirin ve yazılarınıza resimlerinizi öyle yükleyin. Bu sayede resimlerinizin kalitesini de değiştirmemiş olursunuz.
  • JPEG formatındaki görüntüler genellikle sıkıştırılmış görüntüler olduğu için resimlerinizi PNG formatında yazılarınıza yüklemeye hayret edin

Blogger yazılarınıza eklediğiniz görüntülerin kalitesini arttırmak için kullanabileceğiniz bir diğer yöntem ise basit bir kod yapısı ile blogger üzerinde yayınladığınız tüm resimlerin kalitesini yüksek seviyede tutabilirsiniz.
Bunu sağlayabilmek için; Blogger Kontrol Paneli > Şablon > HTML'yi Düzenle diyerek karşımıza çıkan kod sayfasında CTRL+F tuşları ile </head> kodunu aratıp buluyoruz. Bulduğumuz </head> kodunun hemen üzerine aşağıdaki kodları yerleştiriyoruz.

<script type='text/javascript'>//<![CDATA[
$(document).ready(function() {
  // Resimlerinizin Piksel boyutu
  var dimension = 90;
  // #PopularPsot1 Div'i gibi istediğiniz hangi alanlar ise belirleyebileceğiniz kodlar
  $('#PopularPosts1, #somethinghere, #related-posts').find('img').each(function(n, image){
    var image = $(image);
    image.attr({src : image.attr('src').replace(/s\B\d{2,4}/,'s' + dimension)});
    image.attr('width',dimension);
    image.attr('height',dimension);
  });
});
//]]></script>

Kodlar arasında değiştirebileceğiniz yerler
Kırmızı ile belirtilen yerin hemen altındaki kodlarda resimlerinizin piksel boyutunu değiştirebilirsiniz.
Mavi ile belirtilen yerin hemen altındaki kodlarda ise #popularPost1 div'i içindeki görüntüleri algılayarak kalitesini yükselteceğinden istediğiniz div yada class etiketinin adını yazarak istediğiniz alandaki görüntülerin kalitesini yükseltebilirsiniz.

Tüm işlemleri bitirdikten sonra kaydet butonuna basarak şablonunuzu kaydedin. Blogunuzda bulunan resimler artık yüksek kalitede gösterilmeye başlayacaktır.

1 yorum:

  1. Bu kod ile blog logosu daha net gözükebilir mi? Ayrıca pixel boyutunu girerken hangi değeri yazacağım?

    YanıtlaSil

© 2013 iPRESS. All rights resevered. Designed by Templateism