AllaTurkaa

Değerli Allaturka üyeleri, yayıncılar ve web yöneticileri,
Radyo yayın akışınızı web sitenizin en görünür alanına, dikkat çekici ve modern bir formatta taşımak için özel olarak tasarlanmış bir çözüm sunuyoruz! Bu **900 piksel genişliğinde ve 60 piksel yüksekliğindeki** dinamik widget, DJ resimlerini, program isimlerini ve yayın saatlerini kayar bir akış halinde sergiler. Bu görsel araç sayesinde, dinleyicileriniz önemli yayın bilgilerine anında erişebilir.

Tasarım ve İşlevsellik:
Widget, modern CSS animasyonları ile sürekli olarak sola doğru kayar (klasik marquee efektine benzer, ancak daha modern). Bu özellik, sınırlı bir alanda çok sayıda DJ bilgisini sergilemenizi sağlar. En iyi yanı ise: Ziyaretçiler farenizi widget'ın üzerine getirdiğinde kaydırma işlemi durur ve program detaylarını rahatça okuma imkanı sunar.

KURULUM VE KİŞİSELLEŞTİRME KILAVUZU

Bu widget bir **iframe** olarak kolayca entegre edilebilir. Paylaştığımız kodu kullanarak kişiselleştirme yaparken şu noktalara dikkat edin:

- **Resim Ekleme:** DJ resimleri, her **<span class="dj-bilgi-karti">** bloğu içindeki **<img src="RESİM-URL-ADRESİ">** etiketleri arasına eklenir. Resimlerinizi internette barındırdığınız (host ettiğiniz) adresleri buradaki **RESİM-URL-ADRESİ** yerine yapıştırmanız yeterlidir.
- **DJ Güncelleme:** Kod içindeki DJ listesi, akıcı döngü için iki ayrı alana (**Kopya 1** ve **Kopya 2**) yerleştirilmiştir. Yeni bir DJ eklediğinizde veya bilgileri değiştirdiğinizde, **her iki kopyayı da aynı şekilde güncellemeyi unutmayın.**

Geliştirilebilirlik ve Notlar:
Kodlar ektedir ve tamamen açıktır; bu sayede widget'ı kendi ihtiyaçlarınıza göre geliştirebilirsiniz. Örneğin, CSS içindeki **`animation: kaydirma 30s linear infinite;`** satırındaki saniye değerini (30s) değiştirerek kaydırma hızını ayarlayabilirsiniz. Ayrıca renkleri (turuncu için `#FF8C00`, yeşil için `#2ecc71`) değiştirerek radyo temanıza uyarlamanız da mümkündür.

WİDGET'IN BOYUT VE GÖRSEL AYARLARI

- **Sayfa Boyutuna Genişleme (Responsive):** Eğer widget'ın sabit 900px yerine, bulunduğu alana tam yayılmasını isterseniz, CSS kodundaki **.kayan-dj-widget-wrapper** stili içinde yer alan **`width: 900px;`** satırını silin ve yerine **`width: 100%;`** yazın. Böylece widget, sayfa genişliğine uyum sağlayacaktır.
- **Yükseklik Ayarı:** Widget'ın yüksekliği (60px), CSS'teki **.kayan-dj-widget-wrapper** stili içindeki **`height: 60px;`** satırı ile ayarlanır. Bu değeri artırarak widget'ı daha kalın yapabilirsiniz (örn: `height: 80px;`).

Resimlerin Büyütülmesi:
Eğer yukarıda ayarladığınız yükseklik değerini artırırsanız ve DJ resimlerini de büyütmek isterseniz, CSS kodundaki **.dj-bilgi-karti img** stili içinde yer alan iki değeri birlikte değiştirmeniz gerekir:

- **`width: 40px;`** değerini (örn: `width: 50px;`)
- **`height: 40px;`** değerini (örn: `height: 50px;`)

Bu iki değeri, widget'ın yeni yüksekliğini aşmayacak şekilde oranlı olarak artırarak resimleri büyütebilirsiniz. Resimleriniz daire şeklinde olduğu için bu oranları korumak önemlidir.

Bu pratik widget'ı sitenizde kullanmaya hemen başlayabilirsiniz!
Başarılı Yayınlar Dileriz.