Yapay zekadan makale özeti
- Kısa
- Ayrıntılı
- Bu video, bir eğitmen tarafından sunulan Zenfor forum yazılımında kullanıcı bannerlarına grafik ekleme konulu bir eğitim içeriğidir.
- Video, kullanıcıların "PNG ranklarımın görüntüsünü büyütemiyorum" sorusuna cevap vermek amacıyla hazırlanmıştır. İçerikte, Zenfor'da kullanıcı bannerlarının grafik destekli olmadığı, CSS ile hazırlanmış hazır bannerlar olduğu ve bunları biçimlendirmek için özel CSS sınıfına girilmesi gerektiği anlatılmaktadır. Eğitmen, SVG formatında grafik kullanarak kullanıcı sıralaması oluşturma sürecini adım adım göstermekte, mod rank ve kullanıcı rank gibi farklı sıralamaları nasıl oluşturacağınızı açıklamaktadır.
- Videoda ayrıca PNG ve SVG formatları arasındaki farklar, SVG'nin ölçeklendirilebilir vektör grafik olduğu ve bu nedenle daha avantajlı olduğu vurgulanmaktadır. Mobil uyumluluğu sağlamak için medya sorgularının kullanımı, banner sınıflarının kullanımı ve kodun daha az ve etkili hale getirilmesi için pratik yöntemler de paylaşılmaktadır.
- 00:09Zenfor'da Kullanıcı Bannerları ve Grafik Sorunu
- Kullanıcılar Zenfor'da PNG rankların görüntüsünü büyütemediği konuda soru soruyor.
- Zenfor yazılımında kullanıcı bannerları grafik destekli değil, CSS ile hazırlanmış hazır bannerlar var veya özel CSS sınıfına girerek bannerları biçimlendirmek gerekiyor.
- Kullanıcılar eski forum yazılımındaki alışkanlıkları devam ettirmek istiyor ve rank eklemek istiyor.
- 01:19PNG ve SVG Formatı Karşılaştırması
- Çalışma yapacağınız grafiğin formatı önemli: PNG mi yoksa SVG mi kullanacaksınız?
- PNG formatında grafik kullanırken ölçeklendirmeyi kendiniz yapmanız gerekiyor, örneğin 160 piksel genişliğinde bir alan için 160 piksellik grafik hazırlamanız gerekiyor.
- PNG formatında grafik kullanmak işi uzatıyor, daha fazla kod yazmak ve grafik üretmek zorunda kalıyorsunuz.
- 03:12SVG Formatının Avantajları
- SVG formatı (scalable vector graphics - ölçeklendirilebilir vektör grafiği) önerilen yöntemdir.
- SVG'de bir tane formatta vektörel bir grafik ayarlıyorsunuz ve heryerden çağırıyorsunuz, istediğin kadar küçültüp büyütüyorsunuz.
- SVG formatında grafikte herhangi bir bozulma olmuyor, PNG formatında ise grafik ölçüsünde hazırlanması gerekiyor.
- 04:27Kullanıcı Gruplarına Rank Ekleme
- Zenfor'da kullanıcı gruplarına rank eklemek için özel CSS sınıfı kullanılıyor.
- Admin kullanıcı grubuna "advan rank" olarak SVG dosyası ekleniyor.
- Sıklıkla yapılan hata, kullanıcı rank metnini boş bırakmak, bu nedenle metin boş bırakılmamalı.
- 06:14Rank Görünümünü Düzenleme
- Rank için maksimum genişlik (145 piksel) ve minimum yükseklik (32 piksel) değerleri belirleniyor.
- "Background-size" özelliği kullanıldığında grafik bozulabilir, bu nedenle kullanılmamalı.
- Content alanı alanına göre kendini atar, bu nedenle padding değerleri dikkate alınmalı.
- 08:28Kullanıcı Rankları Ekleme
- Mod rank, moderatör ve kullanıcı rank gibi kullanıcı rolleri ekleniyor.
- Eklenen roller sayfada görünmeye başlıyor.
- Zanforun grafik kullanıcı banner desteği olmadığı için girdiğimiz değerler grafiğin üzerine yazılıyor.
- 09:54Grafik Sorunlarını Çözme
- User banner sınıfına display: none ekleyerek grafik sorunlarını çözmeye başlanıyor.
- Yönetici ibaresi de gittiği için user'ın banner step ve strong alanları ayarlanıyor.
- Mobil versiyonda grafiklerin büyük olması sorunu ortaya çıkıyor.
- 11:16Mobil Görünümü Düzenleme
- Medya sorgusu oluşturarak maksimum 650 piksel için ayarlar yapılıyor.
- SVG formatı kullanıldığı için ölçüler ayarlanabiliyor: genişlik 85 piksel, yükseklik 17 piksel olarak ayarlanıyor.
- Tüm ranklar için aynı değerler kullanılarak kod tekrarı azaltılıyor.
- 13:19Yönetici Grafiği Ekleme
- Yönetici için grafik hazırlanıp ekleniyor.
- Yönetici alanındaki arka plan ve border özellikleri ezilerek grafik görüntüleniyor.
- Kod tekrarını azaltmak için kodlar düzenleniyor.
- 16:02Sonuç ve Öneriler
- Basit bir kodlama yaklaşımı tercih edilmiş, karmaşık kodlar kullanılmamış.
- SVG formatının vektörel olması sayesinde ölçülendirme kolaylığı sağlanmış.
- PNG yerine SVG formatının avantajları vurgulanıyor.