- Home>
- Blogger ayarlar , eklentiler , şablon , Web Araçları >
- İçerik Resmini Otomatik Boyutlandır
Posted by : Unknown
22 Aralık 2013 Pazar
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.
3. Resminize kenar çizgisi eklemek isterseniz aşağıdaki kodu kullanabilirsiniz.
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.
3. Resminize kenar çizgisi eklemek isterseniz aşağıdaki kodu kullanabilirsiniz.
Konu hakkında bilgilerinizi sizde paylaşın.