Kendi web sitenize SidewaysData widget'larını doğrudan yerleştirerek erişiminizi genişletin. Etkinliklerinizi ve canlı sonuçlarınızı kitlenizin zaten ziyaret ettiği yerlerde gösterin — sadece tek bir kod satırıyla.

Neden Widget'ları Kullanmalısınız?

• Tek satır kod - Web sitenize bir script etiketi yapıştırın
• Her zaman güncel - Etkinlikler ve sonuçlar SidewaysData'dan otomatik olarak senkronize edilir
• Bakım gerektirmez - Tüm güncellemeleri ve iyileştirmeleri biz yönetiriz
• Profesyonel görünüm - Her cihazda çalışan, özenli ve duyarlı tasarım
• Ücretsiz - Ek ücret olmadan SidewaysData ile dahildir

Mevcut Widget'lar

Etkinlik Bulma Widget'ı

Etkinliklerinizin filtrelenebilir bir listesini görüntüleyin. Ziyaretçiler yıl, kayıt durumu, etkinlik türü ve daha fazlasına göre göz atabilir. Etkinlik sayfanız veya ana sayfanız için idealdir.

Etkinlik Bulma widget'ı hakkında daha fazla bilgi edinin

Canlı Sonuçlar Widget'ı

Etkinlikleriniz sırasında gerçek zamanlı yarış sonuçlarını gösterin. İzleyiciler için canlı sohbet içerir ve etkinlik zamanlamasına göre otomatik olarak "Live Results" ve "Final Results" arasında geçiş yapar.

Canlı Sonuçlar widget'ı hakkında daha fazla bilgi edinin

Başlarken

1. Organizatör ID'nizi veya etkinlik ID'lerinizi bulun (bkz. ID'lerinizi Alma)
2. Hangi widget'a ihtiyacınız olduğuna karar verin
3. Embed kodunu kopyalayın ve web sitenize yapıştırın
4. İsteğe bağlı yapılandırma öznitelikleriyle özelleştirin

Gereksinimler

Widget'lar JavaScript'i destekleyen herhangi bir web sitesinde çalışır. Buna WordPress, Squarespace, Wix, özel HTML siteleri ve çoğu web site oluşturucu dahildir. Sayfalarınıza özel HTML veya script etiketleri ekleyebilme yeteneğine sahip olmanız gerekir.

Widget'ları yapılandırmak için organizer kimliğinize ve isteğe bağlı olarak belirli etkinlik kimliklerine ihtiyacınız olacak. İşte bunları nasıl bulacağınız.

Organizer Kimliğinizi Bulma

Organizer kimliğiniz SidewaysData'daki organizer sayfanızı görüntülerken URL'de görünür.

1. sidewaysdata.com adresine gidin
2. Organizer sayfanıza gidin
3. URL'ye bakın — şu formatta olacaktır: sidewaysdata.com/organizer/YOUR_ORGANIZER_ID

Örneğin, URL'niz sidewaysdata.com/organizer/example-motorsports ise, organizer kimliğiniz example-motorsports'tır.

Etkinlik Kimliklerini Bulma

Etkinlik kimlikleri etkinlik URL'lerinde ve organizer kontrol panelinizde görünür.

Etkinlik URL'sinden

1. SidewaysData'da herhangi bir etkinliğinize gidin
2. URL'ye bakın — event ID /events/ sonrasında yer alır

Örneğin: sidewaysdata.com/events/12345 etkinlik kimliğinin 12345 olduğu anlamına gelir.

Kontrol Panelinizden

1. SidewaysData'a giriş yapın
2. Etkinlikler sayfanıza gidin
3. Etkinlik kimliği etkinlik listesinde görüntülenir veya bağlantılarda görünür

Tarayıcı Geliştirici Araçlarını Kullanma

ID'leri bulmakta sorun yaşıyorsanız:

1. Organizer veya etkinlik sayfanıza sağ tıklayın
2. "İncele" veya "Öğeyi İncele" öğesini seçin
3. ID'yi içeren veri özniteliklerini (data attributes) veya URL'leri arayın

Yardıma mı ihtiyacınız var?

ID'lerinizi bulamıyorsanız, SidewaysData desteği ile iletişime geçin; size bulmanızda yardımcı olacağız.

Find Events widget'ı web sitenizde filtrelenebilir bir etkinlik listesi görüntüler. Ziyaretçiler yaklaşan etkinliklere göz atabilir, çeşitli kriterlere göre filtreleyebilir ve SidewaysData'da kaydolmak veya ayrıntıları görüntülemek için tıklayabilir.

Ne Gösterir

• Etkinlik kartları — ad, tarih, konum ve kayıt durumu
• Yıl, etkinlik türü, kayıt durumu ve gönüllü fırsatları için filtre açılır menüleri
• SidewaysData'daki etkinlik sayfalarına doğrudan bağlantılar
• Her ekran boyutuna uyum sağlayan duyarlı düzen

Temel Gömme Kodu

Add this script tag to your website where you want the events to appear:

<script
  src="https://sidewaysdata.com/static/js/sideways-data-find-events-embed.js"
  data-organizer-ids="your-organizer-id">
</script>

Gerçek organizer ID'nizle your-organizer-id öğesini değiştirin (bkz. ID'lerinizi Alma).

Varsayılan Davranış

Without additional configuration, the widget will:

• Belirtilen organizatör(ler)den tüm etkinlikleri gösterir
• Yıl, etkinlik türü, kayıt durumu ve gönüllüler için filtre açılır menülerini gösterir
• Etkinlikleri tarihe göre sıralar (en eskiler önce)
• Herhangi bir kayıt durumuna sahip etkinlikleri içerir

Nasıl Çalışır

Widget, SidewaysData'dan içerik yükleyen duyarlı bir iframe oluşturur. Iframe içeriğe uyacak şekilde yüksekliğini otomatik olarak ayarlar, bu yüzden widget içinde kaydırma olmaz. Etkinlikler SidewaysData hesabınızla senkronize kalır—yaptığınız herhangi bir değişiklik otomatik olarak yansıtılır.

Sonraki Adımlar

• Widget'ı yapılandırın — isteğe bağlı özniteliklerle
• Farklı kullanım durumları için yaygın örneklere bakın

Script etiketindeki veri özniteliklerini kullanarak Find Events widget'ını özelleştirin. Tüm öznitelikler isteğe bağlıdır, hangi etkinliklerin gösterileceğini belirtmek hariç.

Etkinlikleri Belirleme

Hangi etkinliklerin görüntüleneceğini belirtmek için bu özniteliklerden en az birini eklemelisiniz:

data-organizer-ids

Belirli organizatörlerden tüm etkinlikleri gösterin. Birden fazla organizatör için virgülle ayrılmış değerler kullanın.

<script
  src="https://sidewaysdata.com/static/js/sideways-data-find-events-embed.js"
  data-organizer-ids="example-motorsports">
</script>

Birden fazla organizatör:

<script
  src="https://sidewaysdata.com/static/js/sideways-data-find-events-embed.js"
  data-organizer-ids="org-one,org-two,org-three">
</script>

data-event-ids

Sadece belirli etkinlikleri ID'leri ile gösterin. Birden fazla etkinlik için virgülle ayrılmış değerler kullanın.

<script
  src="https://sidewaysdata.com/static/js/sideways-data-find-events-embed.js"
  data-event-ids="12345,67890">
</script>

Filtering Options

data-event-status

Etkinlikleri kayıt durumuna göre filtreleyin. Değerler: open, closed, veya any.

data-event-status="open"

data-default-reg-status

Kayıt durumu açılır menüsü için varsayılan değeri ayarlayın. Bu, bir filtre seçeneğini önceden seçer ancak ziyaretçilerin bunu değiştirmesine yine de izin verir.

data-default-reg-status="open"

data-limit-organizer-event-types

true olarak ayarlandığında, açılır menüdeki tüm mevcut etkinlik türleri yerine organizatörün gerçekten kullandığı etkinlik türlerini gösterir.

data-limit-organizer-event-types="true"

data-hide-volunteers-dropdown

true olarak ayarlandığında, gönüllü fırsatları filtre açılır menüsünü gizler.

data-hide-volunteers-dropdown="true"

Display Options

data-is-results-mode

true olarak ayarlandığında, yaklaşan etkinlikler yerine sonuçları bulunan etkinlikleri gösterir. "Past Results" sayfası için kullanışlıdır.

data-is-results-mode="true"

data-newest-first

true olarak ayarlandığında, etkinlikleri varsayılan en eski ilk sıralama yerine en yeni ilk olacak şekilde sıralar.

data-newest-first="true"

Advanced Options

data-origin

Varsayılan sidewaysdata.com yerine özel bir alan adı kullanın. Yalnızca SidewaysData ile yapılandırılmış özel bir alan adınız varsa gereklidir.

data-origin="https://events.yourdomain.com"

Complete Example

Aşağıda birden fazla yapılandırma seçeneği kullanan bir örnek verilmiştir:

<script
  src="https://sidewaysdata.com/static/js/sideways-data-find-events-embed.js"
  data-organizer-ids="example-motorsports"
  data-event-status="open"
  data-limit-organizer-event-types="true"
  data-hide-volunteers-dropdown="true"
  data-newest-first="true">
</script>

Bu, "example-motorsports" organizasyonundan açık kayıtlı etkinlikleri gösterir, filtrede yalnızca ilgili etkinlik türlerini gösterir, gönüllü açılır menüsünü gizler ve etkinlikleri en yeni ilk olacak şekilde sıralar.

Ortak yapılandırmalar, Find Events widget'ını farklı kullanım durumlarına uyacak şekilde ayarlar.

Tüm Etkinliklerinizi Göster

Kuruluşunuzdaki tüm etkinlikleri, tüm filtre seçenekleriyle birlikte göster:

<script
  src="https://sidewaysdata.com/static/js/sideways-data-find-events-embed.js"
  data-organizer-ids="your-organizer-id">
</script>

Sadece Kayıt Açık Olanları Göster

Şu anda kayıt kabul eden etkinlikleri göster:

<script
  src="https://sidewaysdata.com/static/js/sideways-data-find-events-embed.js"
  data-organizer-ids="your-organizer-id"
  data-event-status="open">
</script>

Sonuçları Olan Etkinlikleri Göster

Zaman sonuçları olan etkinlikleri gösteren bir "Geçmiş Sonuçlar" sayfası oluştur:

<script
  src="https://sidewaysdata.com/static/js/sideways-data-find-events-embed.js"
  data-organizer-ids="your-organizer-id"
  data-is-results-mode="true"
  data-newest-first="true">
</script>

Belirli Etkinlikleri Göster

Sadece belirli etkinlikleri göster, örneğin bir şampiyona serisi:

<script
  src="https://sidewaysdata.com/static/js/sideways-data-find-events-embed.js"
  data-event-ids="12345,12346,12347,12348">
</script>

Birden Fazla Organizasyondan Etkinlikleri Göster

Bölgesel veya seri sayfasında birkaç organizasyondan etkinlikleri göster:

<script
  src="https://sidewaysdata.com/static/js/sideways-data-find-events-embed.js"
  data-organizer-ids="org-one,org-two,org-three">
</script>

Basitleştirilmiş Görünüm (Minimum Filtreler)

Daha az kullanılan filtreleri gizleyerek daha sade bir arayüzle etkinlikleri göster:

<script
  src="https://sidewaysdata.com/static/js/sideways-data-find-events-embed.js"
  data-organizer-ids="your-organizer-id"
  data-limit-organizer-event-types="true"
  data-hide-volunteers-dropdown="true">
</script>

Ana Sayfa Widget'ı (Açık Etkinlikler, En Yeniler Önde)

Web sitenizin ana sayfası için yaygın bir yapılandırma:

<script
  src="https://sidewaysdata.com/static/js/sideways-data-find-events-embed.js"
  data-organizer-ids="your-organizer-id"
  data-event-status="open"
  data-newest-first="true"
  data-limit-organizer-event-types="true"
  data-hide-volunteers-dropdown="true">
</script>

Kayıt Durumu Filtresini Varsayılan Olarak "Open" Yap

Tüm etkinlikleri göster, ancak kayıt filtresini varsayılan olarak "open" yap:

<script
  src="https://sidewaysdata.com/static/js/sideways-data-find-events-embed.js"
  data-organizer-ids="your-organizer-id"
  data-default-reg-status="open">
</script>

Bu, data-event-status="open"'den farklıdır çünkü ziyaretçiler yine de kapalı etkinlikleri görmek için filtreyi değiştirebilir.

Live Results widget'ı web sitenizde gerçek zamanlı yarış sonuçlarını gösterir. Seyirciler etkinlikler sırasında takip edebilir ve sonrasında nihai sonuçları görüntüleyebilir — hepsi sitenizden ayrılmadan.

Ne Gösterir

• Canlı etkinlikler sırasında gerçek zamanlı zamanlama sonuçları
• Etkinlik zamanlamasına bağlı olarak "Live Results" veya "Final Results" göstergesi
• Seyirci etkileşimi için FastComments tarafından sağlanan yerleşik canlı sohbet
• Yeni zamanlar kaydedildikçe otomatik güncellemeler

Temel Gömme Kodu

Sonuçların görünmesini istediğiniz yere web sitenize bu script etiketini ekleyin:

<script
  src="https://sidewaysdata.com/static/js/sideways-data-live-results-embed.js"
  data-organizer-id="your-organizer-id">
</script>

Gerçek organizatör kimliğinizle your-organizer-id öğesini değiştirin (bkz. Kimliklerinizi Alma).

Not: Live Results widget'ı data-organizer-id özniteliğini gerektirir. Öznitelik olmadan widget yüklenmez.

Nasıl Çalışır

Widget, SidewaysData'ın canlı zamanlama sistemine bağlanan duyarlı bir iframe oluşturur. Aktif bir etkinlik sırasında:

• Sonuçlar zamanlar kaydedildikçe gerçek zamanlı güncellenir
• Zamanlamanın devam ettiğini göstermek için widget "Live Results" gösterir
• Canlı sohbet, seyircilerin etkinliği tartışmasına olanak tanır

Etkinlik sona erdikten sonra:

• Sonuçlar görüntüleme için erişilebilir kalır
• Widget "Final Results" göstergesini gösterir
• Sohbet geçmişi korunur

Kullanım Örnekleri

• Etkinlik günü - Seyircilerin canlı olarak takip edebilmesi için ana sayfanıza gömün
• Özel sonuç sayfası - Web sitenizde kalıcı bir sonuç sayfası oluşturun
• Sosyal medya açılış sayfası - Etkinlikler sırasında sonuç sayfanıza bir bağlantı paylaşın

Sonraki Adımlar

• Widget'i yapılandırın isteğe bağlı özniteliklerle

Live Results bileşeni minimum yapılandırmaya sahiptir—sadece organizer ID'niz gereklidir.

Gerekli Öznitelik

data-organizer-id

Sizin SidewaysData organizer ID'niz. Bileşenin çalışması için bu gereklidir.

<script
  src="https://sidewaysdata.com/static/js/sideways-data-live-results-embed.js"
  data-organizer-id="example-motorsports">
</script>

Yönetici ID'nizi bulma konusunda yardım için ID'lerinizi Bulma bölümüne bakın.

İsteğe Bağlı Öznitelik

data-origin

Varsayılan sidewaysdata.com yerine özel bir alan adı kullanın. Yalnızca SidewaysData ile yapılandırılmış özel bir alan adınız varsa gereklidir.

<script
  src="https://sidewaysdata.com/static/js/sideways-data-live-results-embed.js"
  data-organizer-id="example-motorsports"
  data-origin="https://events.yourdomain.com">
</script>

Tam Örnek

Tipik bir Live Results gömme (embed):

<script
  src="https://sidewaysdata.com/static/js/sideways-data-live-results-embed.js"
  data-organizer-id="example-motorsports">
</script>

Hata Yönetimi

Eğer data-organizer-id özniteliği eksikse, bileşen tarayıcı konsoluna bir hata kaydeder ve görüntülenmez. Bu gerekli özniteliği eklediğinizden emin olun.

Yerleştirme İpuçları

• Bileşeni yeterli genişliğe sahip bir kapsayıcıya yerleştirin (en az 320px önerilir)
• Bileşen yüksekliğini içeriğe uyacak şekilde otomatik olarak ayarlar
• Maksimum görünürlük için etkinlik günlerinde sayfanın üst kısmına yerleştirmeyi düşünün
• Özel bir "Live Results" sayfasının ana içeriği olarak iyi çalışır

SidewaysData widget'ları iframe olarak gömülür, bu da doğrudan CSS stil uygulamasını sınırlar. Ancak, widget'ların sayfa düzeninize nasıl uyduğunu kontrol edebilirsiniz.

Container Styling

Widget'ı konumunu ve maksimum genişliğini kontrol etmek için bir konteyner öğesiyle sarın:

<div style="max-width: 1200px; margin: 0 auto;">
  <script
    src="https://sidewaysdata.com/static/js/sideways-data-find-events-embed.js"
    data-organizer-ids="your-organizer-id">
  </script>
</div>

Width Control

Widget'lar otomatik olarak kapsayıcının genişliğinin %100'üne genişler. Genişliği üst öğeyi stillendirerek kontrol edin:

<div style="width: 100%; max-width: 800px;">
  <script
    src="https://sidewaysdata.com/static/js/sideways-data-find-events-embed.js"
    data-organizer-ids="your-organizer-id">
  </script>
</div>

Height Behavior

Widget yüksekliği içeriğe göre otomatik olarak ayarlanır. Iframe, gerekli yüksekliği sayfanıza iletmek için postMessage kullanır; bu da widget içinde kaydırma çubuklarını ortadan kaldırır.

Responsive Design

Widget'lar duyarlı olacak şekilde tasarlanmıştır ve mobil cihazlarda iyi çalışır. Daha dar ekranlara otomatik olarak uyum sağlar. En iyi sonuçlar için:

• Yüzde tabanlı veya esnek kapsayıcı genişlikleri kullanın
• Mobilde yatay kaydırmaya neden olabilecek sabit piksel genişlikleri ayarlamaktan kaçının
• Farklı ekran boyutlarında test edin

Background Compatibility

Widget'lar açık renkli bir arka plana sahiptir ve açık renkli sayfalarda iyi çalışacak şekilde tasarlanmıştır. Sitenizin arka planı koyu renkliyse, widget'ı açık renkli bir konteyner içine yerleştirmeyi düşünün:

<div style="background: #ffffff; padding: 20px; border-radius: 8px;">
  <script
    src="https://sidewaysdata.com/static/js/sideways-data-find-events-embed.js"
    data-organizer-ids="your-organizer-id">
  </script>
</div>

Iframe Styling Limitations

Widget'lar iframe kullandığı için içlerindeki içeriği (yazı tipleri, renkler veya buton stilleri gibi) doğrudan stilize edemezsiniz. Widget içeriği, tutarlı ve profesyonel bir görünüm sağlamak için SidewaysData'nın standart stilini kullanır.

Özel markalama gereksinimleriniz varsa, seçenekleri görüşmek için SidewaysData destek ekibiyle iletişime geçin.

Adding Margins and Spacing

Konteyner üzerinde standart CSS kullanarak widget etrafına boşluk ekleyin:

<div style="margin: 40px 0;">
  <script
    src="https://sidewaysdata.com/static/js/sideways-data-find-events-embed.js"
    data-organizer-ids="your-organizer-id">
  </script>
</div>

SidewaysData widget'lerini kullanırken sık karşılaşılan sorunlar ve çözümleri.

Widget Görünmüyor

Script URL'sini kontrol edin

Script src özniteliğinin doğru URL'ye işaret ettiğinden emin olun:

• Find Events: https://sidewaysdata.com/static/js/sideways-data-find-events-embed.js
• Live Results: https://sidewaysdata.com/static/js/sideways-data-live-results-embed.js

Gerekli öznitelikleri kontrol edin

• Find Events widget ya data-organizer-ids ya da data-event-ids gerektirir
• Live Results widget data-organizer-id gerektirir

JavaScript hatalarını kontrol edin

Tarayıcınızın geliştirici konsolunu açın (genellikle F12 veya sağ tık → İncele → Console) ve hata mesajlarına bakın. Live Results widget data-organizer-id eksikse bir hata kaydeder.

ID'lerinizin doğru olduğunu doğrulayın

Organizatör ve etkinlik ID'lerinin SidewaysData'da gösterilenlerle eşleştiğinden emin olmak için tekrar kontrol edin. Bakınız ID'lerinizi Alma.

Yanlış Etkinlikler Görünüyor

Organizatör ID'si yazımını kontrol edin

Organizatör ID'leri büyük/küçük harfe duyarlıdır. ID'nin SidewaysData URL'sinde görünenle tam olarak eşleştiğinden emin olun.

Filtre ayarlarını kontrol edin

Eğer data-event-status="open" kullanıyorsanız fakat hiçbir etkinlik görmüyorsanız, açık kayıtlı etkinliğiniz olmayabilir. Tüm etkinlikleri görmek için bu filtreyi kaldırmayı deneyin.

Sonuç modu ayarını kontrol edin

Eğer data-is-results-mode="true" ayarlanmışsa, widget gelecek etkinlikler yerine sonuçları olan etkinlikleri gösterir. Gelecek etkinlikleri görmek için bu özniteliği kaldırın.

Widget Yükseklik Sorunları

Widget kesilmiş gibi görünüyor

Widget yüksekliğini otomatik olarak ayarlamalıdır. İçerik kesik görünüyorsa:

1. Hiçbir üst öğenin overflow: hidden ayarlı olmadığını kontrol edin
2. İframe üzerinde sabit bir yükseklik uygulayan CSS olmadığından emin olun
3. Tarayıcınızda JavaScript'in etkin olduğunu doğrulayın

Aşırı boş alan

Widget'ın altında çok fazla boş alan varsa, otomatik yükseklik ayarı bununla başa çıkmalıdır. Eğer yapmıyorsa, widget yükleniyor olabilir ancak gösterilecek etkinlik yoktur.

İçerik Güncellenmiyor

Etkinlikler son değişiklikleri göstermiyor

Widget'lar her sayfa yüklemesinde SidewaysData'dan taze içerik yükler. Değişiklikler görünmüyorsa:

1. Sayfayı sert yenileyin (Ctrl+F5 veya Cmd+Shift+R)
2. Tarayıcı önbelleğinizi temizleyin
3. Birkaç dakika bekleyin—bazı değişikliklerin yayılması biraz zaman alabilir

Canlı sonuçlar güncellenmiyor

Canlı zamanlama sırasında sonuçlar otomatik olarak güncellenmelidir. Güncellenmiyorsa:

1. Etkinliğin SidewaysData'da aktif olarak zamanlandığını doğrulayın
2. Sayfayı yenileyin
3. İnternet bağlantınızı kontrol edin

Web Site Oluşturucu Sorunları

WordPress

WordPress kullanıyorsanız şunlar gerekebilir:

• "Custom HTML" bloğu veya widget'ı kullanın
• Script engelleyen eklentileri geçici olarak devre dışı bırakın
• Temanızın içerikten script etiketlerini kaldırıp kaldırmadığını kontrol edin

Squarespace

"Code Block" veya "Embed" öğesini kullanın ve script etiketini doğrudan yapıştırın.

Wix

Script'i eklemek için "HTML iframe" veya "Custom Element" özelliğini kullanın.

Çapraz Kaynak Sorunları

Widget'lar içeriği SidewaysData sunucularından yükler. Çapraz-kaynak hataları görüyorsanız:

1. Script URL'si için https:// kullandığınızdan emin olun (http:// değil)
2. Eğer data-origin kullanıyorsanız, alan adının doğru yapılandırıldığını doğrulayın

Hâlâ Sorun Yaşıyor musunuz?

Bu çözümleri denediyseniz ve widget hâlâ düzgün çalışmıyorsa, SidewaysData desteği ile iletişime geçin ve şu bilgileri paylaşın:

• Widget'i yerleştirdiğiniz sayfanın URL'si
• Kullandığınız tam script etiketi
• Tarayıcı konsolundaki herhangi bir hata mesajı
• Beklediğiniz ile gerçekleşen durum arasındaki açıklama