Widget ile Çalışmak (RESİMLİ)

Widget Nedir?

Widget bir plaftorm üzerinde bütünleşik çalışarak o platforma ekstra özellik katan “küçük” araçlardır.

Bir web sitesini “widget” ile yeniden tasarlamak mümkün.

WordPress, “Widget“i Türkçeye “Görsel“olarak çevirmiş. 

Tüm hayal ettiğiniz, düşündüğünüz, planladığınız tasarımı widgetlerin yardımıyla gerçekleştirebilirsiniz.

Bunun için mümkün olduğu kadar internette dolaşıp, web sitelerine bloglara, özellikle de aldığınız blogtaki değişik türleri inceleyin. Başkalarının nasıl tasarımlar yaptığına bakın. Belki günlerdir düşündüğünüz ama nasıl olacağını bilemediğiniz bir özelliği bir başkası hayata geçirmiştir. İnceleyin, mutlaka çözümünü bulursunuz.

Artık pek çok tasarımda widgetler kullanılıyor.

Bir web sitesinde veya bloglarda pek çok widget kullanılarak, tasarım güzelleştiriliyor.

İşte WordPress’te Widtget kullanımı

Widget’ler WordPress’in sol tarafında Görünüm sekmesinin altında bulunuyor.

Buradan bileşenlere tıkladığınızda sağ tarafta pek çok seçenek önünüze gelecek. Bunlar arasında Görsel yazılı olan bizim işimizi yapacak.


Bu kutuyu mouse ile tutup sağ tarafa sürüklüyoruz. Widgetimiz sayfamızın neresinde olacak.


 Gördüğünüz gibi seçtiğimiz wordpress teması bunları bize sunuyor. Biz sadece nerede olacağına karar vermeliyiz.

Homepage Top Right’ı seçtik. Widgetimiz manşetimizin sağ tarafındaki boşlukta yer alacak.

Yukarıda bahsettiğim gibi sitemizde pek çok widget kullanabiliriz. Sağ tarafta gördüğünüz gibi 3 tane widget seçtim.

Seçtiğiniz widgetlerin ayarlamalarını yaptıktan sonra sayfanızda bakarsınız. Eğer beğenmezseniz, widgeti tutar bu defa da sol tarafa sürüklersiniz. Bu sizin yaratıcılığınızla sınırlı.

 

 İşte widgetimiz hazır.

Şimdi buradaki kutucukların nasıl doldurulduğuna bakalım. Ve ne işe yaradıklarını anlatalım.

Widget Title: Widget Başlığı, sayfamızda görünmesini istediğimiz başlıktır. Eğer resminizin amacınıza uygun olduğuna, anlatmak istediğinizi anlattığınıza inanıyorsanız buraya boş bırakabilirsiniz.

Widget Başlığı’na yazdığınız yazı şöyle görünecektir.

Gördüğünüz gibi 480p Filmler yazdık. Otomatik olarak büyük harfe çevirdi ve sayfamıza yerleşti.

Image URL: Peki sayfamızda görünen bu resmi nereden aldık? Bunu widgete anlatmamız gerekiyor. Bu internetteki herhangi bir yerden de olabilir, kendi hazırladığınız bir resim de olabilir. Widget bizden buraya yerleştireceğiniz resmin adresini istiyor.

Photoshopta birşeyler hazırladık ve “480pres.jpeg” adıyla kaydettik.


WordPress’te Medya kütüphanesine gidip Yeni ekle butonuna basıp bu resmi yüklüyoruz. 


 Tamam resmimiz yüklendi.

Bize gerekli olan Dosya adresi…


Bu dosya adresini seçip kopyalıyoruz. Dediğim gibi bu internetten de olabilir. Çünkü bunu sadece görsel olarak kullanacağız. Kopyaladık ve widgetimize döndük.

 
Hemen ikince sırada Image URL yazılı yerin altındaki kutucuğa kopyaladığımız linki yapıştırıyoruz.

Image Title: Şimdi bu resmimize bir başlık yazalım. Bu kutunun içine yazacaklarımız, sadece mouse bu resmin üzerine geldiğinde gözükecektir.


Image Title kutusuna “480p kalitesinde” yazdık. Gördüğünüz gibi sitemizde mouse bu resmin üzerine getirdiğimizde bu yazı gözüktü.

 
 

 

Caption: Bu sayfamızda gözükecek başlıktır. Yani buraya tıklayanların neler bulabileceğini anlatacağımız bir yerdir. “480p çözünürlüğündeki filmler için tıklayın” yazısını görüyorsunuz…

Burada şöyle bir özellik var. Eğer burayı boş bırakırsanız, resmimize çerçeve yapmıyor. Eğer bir şeyler yazmazsanız yukarıdaki gibi gözükmez. Resmimiz çerçevesiz olarak sayfamızda olur.

Image Alignment: Resmimiz widget alanının hangi kısmında gözükecek. Sağında solunda ortasında… Bunu seçebilirsiniz.

Resmimizin boyutlarını buradan ayarlayabiliriz. Eğer resmin boyutlarını girmezseniz, alanları boş bırakırsanız resminiz otomatik olarak mevcut alana yerleştirilecektir.

Link URL: Üzerine cliklendiğinde… Evet buraya kadar görsellik üzerine ayarlamalar yaptık. Peki bu resmin üzerine tıklandığında ne olacak? Widget ne yapacak? İşte şimdi bunu widgete anlatacağımız yer burası… Bu resmin üzerine tıklandığında ne yapılacaksa, nereye gidilecekse bunu yazmalıyız.

480p kategorisindeki filmleri göstermesini istiyoruz. Bu linki nereden bulacağız?

Web sitemizdeki kategorisi 480p olan bir bölüme geliyoruz. 480p kategorisinin üzerine sağ tıklıyoruz. Özellikleri seçiyoruz.

İşte 480p kategorisinin adresi… Burayı kopyalıyoruz.


Widgetimizin Link URL yazılı kutusuna yapıştırıyoruz.

Kaydet butonuna basıyoruz.

İşte hepsi bu kadar!

Bundan sonra sitemize gelenler bu resmin üzerine tıkladığında 480p kategorisindeki tüm filmleri göreceklerdir.

 

Görüşlerinizi paylaşabilirsiniz

Aşağıya bilgilerinizi girin veya oturum açmak için bir simgeye tıklayın:

WordPress.com Logosu

WordPress.com hesabınızı kullanarak yorum yapıyorsunuz. Çıkış  Yap /  Değiştir )

Google fotoğrafı

Google hesabınızı kullanarak yorum yapıyorsunuz. Çıkış  Yap /  Değiştir )

Twitter resmi

Twitter hesabınızı kullanarak yorum yapıyorsunuz. Çıkış  Yap /  Değiştir )

Facebook fotoğrafı

Facebook hesabınızı kullanarak yorum yapıyorsunuz. Çıkış  Yap /  Değiştir )

Connecting to %s

%d blogcu bunu beğendi: