Widget (Bileşen) Kavramı ve Protein'de Widget kullanımı


Widgetler; Protein sayfa tasarımlarında kullanılan, özel işlevlere sahip bileşenlerdir. Sayfalar üzerinde widget kullanıma ilişkin detaylar aşağıda sıralanmıştır. 


  1. Widget (Bileşen) nedir?: Widget, kullanıcı arayüzü üzerinde yer alan, herhangi bir veri yada bilgiyi kullanıcıya aktaran küçük bir katman veya programların tümü olarak genel bir tanımı yapılabilir. Wigetler, Kullanıcı arayüzünü yani sayfaları daha zengin bir görünüme sokmak ve kullanıcılara ilave işlevler sunma amacındadır. Örneğin, Proteinde kullanılan İçerik detay widgeti, Workcube İçerik Yönetim sistemi üzerinden oluşturulan içeriklerin sayfa üzerinde sergilenmesini sağlar.

  2. Widget nerelerde kullanılır?: Widgetler çoğunlukla sayfa tasarımda kullanılmaktadır. Bunun yanı sıra "Templates" kutusu içinde, template ve layout ekleme bölümünde de kullanılır. Sayfa tasarımlarında, sayfa ihtiyacına göre widgetler seçilerek istenilen sırada ve boyutlarda widget kullanılabilir. Örneğin;
    Sayfamızın eğitim ile ilgili bir sayfa olduğunu düşünürsek, Widget listesinden "Eğitim" başlığı altındaki widgetler kullanılabilir. Ayrıca bir sayfada birden fazla başlık altında widgetler de kullanılabilir.


  3. Widget oluşturma: Widgetler, Workcube üzerinden oluşturulurlar. Workcube üzerinden System > DEV Tools > Widgets yolları takip edilir. Açılan sayfada Workcube üzerinden tanımlı widgetler listelenebilir ve yeni widget kayıt edilebilir. Görsel de "İlişkili İçerikler" isimli widget bilgileri yer almaktadır. Yeni oluşturulacak widget için benzer şekilde ilgili alanlar doldurulmalıdır. Burada önemli bir nokta "File Path" kısımıdır. Widget'in yapısını, şeklini ve işlevselliğini içeren widget tasarım kodları workcube üzerinden yazılır, kodun yer aldığı sayfa ise "File Path" kısmına eklenir. 

  4. Widget Parametreleri: Sayfa tasarımına eklenen her bir widgetin sağında "çark" simgesi ile ulaşılabilecek widget ayarları mevcuttur. Widget ayarları kutusunda "Params" başlığı altında widget parametreli mevcuttur. Bu parametreler ile widget içinde bir çok ayar yapılabilir. Örneğin; içeriklerin listelendiği bir widgette, widgette kaç adet içerik yer alacağı, son eklenen sırasına göre içeriğin gelmesi, seçili dilde içeriklerin gelmesi, içerik içinde yer alan imajların boyutlarının belirlenmesi gibi ..  bir çok seçenek sunan parametreler yer alır. Bununla birlikte her widgetin ihtiyacı olan özellikler farklı olduğu için, parametreleri de değişkenlik gösterebilir. Widget parametleri, kod dosyasında yer alan "widgetismi.xml" dosyası üzerinde yer almaktadır. Parametreler buradan eklenip, düzenlenebilir.


  5. Widget Box ayarları ve Ek Css kullanımı: Box ayarları ile widgete başlık eklenebilir, farklı widget tipleri için class kısmındaki seçenekler kullanılabilir. 

  6. Widget Extend File ve Seo ayarı: "Extend Css" ve "Extend File" widgete özgü css tanımları yapılabilir, widget'e ilave kod eklenebilir. Seo kısmında ise "Schema Markup" seçeneği altında yer alan şema tipleri seçilebilir.

Geri Bildirim

Bu içeriği faydalı buldunuz mu?
İlişkili İçerikler