Bir siteye widget nasıl eklenir?

Merhaba arkadaşlar,

Bir süredir yükseklisans kaydı, iş değiştirme telaşı yüzünden bloğa yazı atamadım. İşleri düzene sokup tekrar yazacağım yazının konusunu düşünmeye başladığımda ise aklıma hem yazılım hemde yeni girdiğim şirket ile ilgili bir blog yazısı yazmak geldi. Bu düşünce doğrultusunda en belirgin konu ise “bir siteye widget nasıl eklenir?” oldu.

Yeni girdiğim Broadage Sports firması Beinsport, NtvSpor, Tivibu Spor, bilyoner.com vb. gibi sitelere widget ve api aracılığı ile spor verisi sunmaktadır. Biz de bu örnek altında https://www.broadage.com/ adresinde yer alan deneme widget larından birisini sitemizin içerisine implement edeceğiz. Toplanın adım adım başlıyoruz…

Öncelikle https://www.broadage.com/signup/free adresine giderek free trial için bir kayıt oluşturalım. Mail üzerinden aktivasyon yapıldığı için geçerli bir mail adresi vermeyi ve password kısmında büyük-küçük harf, numara, sembol kullanmaya dikkat edelim. Ayrıca website kısmında geçerli bir web sitesi yazmalısınız. (Kayıt sonrası Account Settings altından değiştirilebilir). Ben bloğumun domainini yani www.enesaysan.com adresini yazdım.

Hesap Oluşturma
Hesap Oluşturma

Şimdi mail adresimize giderek gelen mail üzerinden aktivasyonu gerçekleştirelim ve sisteme giriş yapalım.

Hesap Aktivasyonu
Hesap Aktivasyonu

Dashboardumuza gidelim.

Dashboard Ekranı
Dashboard Ekranı

Şimdi üst menüden Widget Settings => Get Widgets seçeneğine tıklayarak sitemize eklemek istediğimiz widgetı seçeceğimiz ekrana ulaşalım. Burada size bir sürü farklı widget ve konfigurasyon seçeneği sunulmaktadır, ben bir Beşiktaş taraftarı olarak Beşiktaş kadrosunu görüntülemek istiyorum. Bu yüzden sol tarafta yer alan menüden Squad Stats seçerek, konfigurasyon kısmında General Options altındaki Select Tournament kısmında Turkish Super League ve Select Team kısmında Beşiktaş (Herkes kendi takımını seçebilir 😀 ) seçiyorum.

Squad Stats Widget
Squad Stats Widget

İşin zor kısmı bitti, şimdi sağ tarafta widgetın altına inerseniz sistem size yaptığınız seçime göre html ve script çıktıları üretmekte. Tek yapmanız gereken sitenizin ilgili alanına bunları yapıştırmak.

Squad Stats Script
Squad Stats Script

Ben hemen masaüstümde Visual Studio Code editörü ile WidgetTrial.html adıyla bir dosya oluşturdum. Şimdi sayfamızın içini widgetı ekleyecek şekilde düzenleyelim. Yapmamız gereken dashboard da bize üretilen html ve scripti bu sayfa içerisine yapıştırmak. (Widget ekleyip kullanmak bu kadar basit 😀 )

Sayfamız şuan hazır fakat domain kontrolü olduğu için,
bunu kayıt olurken belirttiğimiz (Sonradan da değiştirilebilir ) web site adresinin altına atmalıyız. Ben bunun için ftp kullanıyorum, bu hizmet için de FileZilla programından yararlanacağım.

Ftp FileZilla
Ftp FileZilla

Eğer bir hata yapmadıysak domainadresimiz/WidgetTrial.html
(Siz kendi domaininizi yazmalısınız) adresi altında beşiktaşın kadrosunu görmemiz gerekir.

Beşiktaş Kadrosu Widget
Beşiktaş Kadrosu Widget

Evet arkadaşlar başarılı bir şekilde kadromuzun widgetını sitemize ekledik. Sizde kontrol etmek isterseniz;
http://enesaysan.com/WidgetTrial.html
Not: Deneme sürümü olduğu için widget 15 gün aktif olacaktır.

Support dökümanı için adresi ziyaret edebilirsiniz.
https://www.broadage.com/account/support/tech-docs

Bir yazımın daha sonuna geldim, hepinize iyi hafta sonları dilerim. Kalın sağlıcakla 😀

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir