İçerik Resmini Otomatik Boyutlandır

Otomatik içerik resmi boyutlandırma nasıl yapılır
Klasik Blogger kullanıcılarının, yazılarına ekledikleri resimleri otomatik olarak boyutlandıran CSS kod eklentisi.Blogger klasik şablon kullanan blog yazarlarının yazılarına ekledikleri muhtelif ebatlardaki resim genişliklerini sabit tutarak resimlerin alt alta düzgün ve aynı ebatlarda çıkmasına sağlayabilirsiniz.Tek yapmanız gereken işlem, resim genişlik ebadını belirlemenizdir. Aşağıda verdiğim CSS kod’unun size ne faydası olur ?

1. Akıllı mobil teknolojisinin hızla ilerlemesi sonucu blog’unuza eklediğiniz resimler mobil telefonlarda daha güzel görülür.
2. Yazılarınıza eklediğiniz resimleri optimize edeceği için, resimleri okumaya çalışan mobil telefon hatalarını asgariye düşürür. Dolayısı ile Web yönetici araçlarında bulunan akıllı telefon sekmesindeki hata oranınız azalır.
3. Blog ana sayfanızdaki yayın sayınıza göre hiyararşik alt alta görülen resim genişlikleri düzgün görülür.
4. Ekleyeceğiniz CSS kod’u ile eski yazı resimleriniz de aynı genişlikte görülmeye başlar.
5. Hem genişlik, hemde yükseklik ayarlarınızı değiştirmeniz mümkündür.
Ancak Yükseklik ayarlarınızı değiştirmeniz px ölçülerinde değişim yapabileceğinden pek kullanmamanızı tavsiye ederim. şablon kısmında önzileme yaparak px değerlerinde değişim olmadığına kanat getirirseniz yükseklik ayarını değiştirebilirsiniz. Uygulamayı deneme yanılma metodu ile yapabilirsiniz.Bu size tecrübe kazandıracaktır.
İçerik resimlerinizin Akıllı Mobil telefonlar tarafından görülmesi için genişlik ayarının 300 px olarak belirlenmesini öneririm. Ancak siz 500 px, 640 px vs gibi değerler ile özelleştirme yapabilirsiniz.
Genişlik ayarı    : width: 300
Yükseklik ayarı : height: auto
Auto yazan kısma sayısal bir değer verirseniz otomatik olarak yükseklik değerleri değişecektir.
Aşağıdaki kodu iki şekilde ekleyebilirsiniz.


1. “ ]]></b:skin> “ kodunu şablonunuzda bulup hemen üstüne ekleyerek.

2. Yerleşim → Şablon → Özelleştir → Gelişmiş → Css ekle tıklayın ve en altta ekleyin.

Genişlik ve yükseklilk rakamları üzerinde denemeler yaparak önizleme yapın ve kendi ölçünüzü 
belirleyin.
.post-body img {
width: 300px !important;
height: auto !important; 
}

3. Resminize kenar çizgisi eklemek isterseniz aşağıdaki kodu kullanabilirsiniz.
border: 1px solid #d2d2d2

Konu hakkında bilgilerinizi sizde paylaşın. Dinamik blog resim kenarlarında görülen resim sınır çizgilerini kaldırmak için bağlantıya tıklayın.

Klasik blog resim kenarlarında görülen resim sınır çizgilerini kaldırmak için bağlantıya tıklayın.

Bu blogdaki popüler yayınlar

Paint Net ile Resim arka plan Görüntüyü Şeffaf Yapma

Paint ile Resim Boyutlandırma Seo

Windows 10 Denetim Masası Komutlarına Kısa Yoldan Ulaşma

Blogger Açılır Menü Oluşturma

D-Smart Web İnternet Bağlantı Sorun ve Çözüm Ayarları

Windows İşletim Sistemi 32 Bit ve 64 Bit Arasındaki Fark

Blogger Blogspot meta tag eklemek

Blog'a Video Nasıl Eklenir Resimli Anlatım

Windows 10 İşletim Sisteminde Modem Şifresini Bulma

Blogger Dikey Ve Yatay Üç Kategorili Açılır Menü Gezinme Çubuğu Eklentisi