Proširite svoj domet ugrađivanjem SidewaysData widgeta direktno na vaš sajt. Prikažite svoje događaje i rezultate uživo tamo gde vaša publika već posećuje — sa samo jednom linijom koda.

Zašto koristiti widgete?

• Jedna linija koda - Jednostavno nalepite script tag u vaš sajt
• Uvek ažurirano - Događaji i rezultati se automatski sinhronizuju sa SidewaysData
• Bez održavanja - Mi se brinemo o svim ažuriranjima i poboljšanjima
• Profesionalan izgled - Doteran, responzivan dizajn koji radi na svakom uređaju
• Besplatno - Uključeno u SidewaysData bez dodatnih troškova

Dostupni widgeti

Widget za pronalaženje događaja

Prikažite listu vaših događaja koja se može filtrirati. Posetioci mogu pretraživati po godini, statusu registracije, vrsti događaja i još mnogo toga. Savršeno za vašu stranicu događaja ili početnu stranicu.

Saznajte više o widgetu za pronalaženje događaja

Widget za rezultate uživo

Prikažite rezultate trke u realnom vremenu tokom vaših događaja. Uključuje live chat za posmatrače i automatski se prebacuje između "Rezultati uživo" i "Konačni rezultati" na osnovu vremena događaja.

Saznajte više o widgetu za rezultate uživo

Početak

1. Pronađite svoj organizer ID ili event IDs (pogledajte Dobijanje vaših ID-eva)
2. Izaberite koji widget vam treba
3. Kopirajte embed code i nalepite ga na vaš sajt
4. Prilagodite pomoću opcionih konfiguracionih atributa

Zahtevi

Widgeti rade na bilo kom sajtu koji podržava JavaScript. To uključuje WordPress, Squarespace, Wix, prilagođene HTML sajtove i većinu alata za pravljenje sajtova. Biće vam potrebna mogućnost dodavanja prilagođenog HTML-a ili script tagova na vaše stranice.

Da biste konfigurisali widgete, biće vam potreban ID organizatora i opciono određeni ID-jevi događaja. Evo kako da ih pronađete.

Kako pronaći ID organizatora

Vaš ID organizatora pojavljuje se u URL-u kada gledate stranicu organizatora na SidewaysData.

1. Idite na sidewaysdata.com
2. Otvorite stranicu vašeg organizatora
3. Pogledajte URL — biće u formatu: sidewaysdata.com/organizer/YOUR_ORGANIZER_ID

Na primer, ako je vaš URL sidewaysdata.com/organizer/example-motorsports, vaš ID organizatora je example-motorsports.

Kako pronaći ID događaja

ID-jevi događaja pojavljuju se u URL-ovima događaja i na vašoj stranici organizatora.

Iz URL-a događaja

1. Otvorite bilo koji od vaših događaja na SidewaysData
2. Pogledajte URL — sadržaće ID događaja posle /events/

Na primer: sidewaysdata.com/events/12345 znači da je ID događaja 12345.

Iz vaše kontrolne table

1. Prijavite se na SidewaysData
2. Idite na vašu Stranicu događaja
3. ID događaja je prikazan u listi događaja ili je vidljiv u linkovima

Korišćenje alata za programere u pregledaču

Ako imate problema sa pronalaženjem ID-jeva:

1. Kliknite desnim tasterom na stranicu organizatora ili događaja
2. Izaberite "Inspect" ili "Inspect Element"
3. Potražite data atribute ili URL-ove koji sadrže ID

Treba pomoć?

Ako ne možete da pronađete svoje ID-jeve, kontaktirajte podršku SidewaysData i pomoći ćemo vam da ih pronađete.

The Find Events vidžet prikazuje listu događaja na vašem sajtu koja se može filtrirati. Posetioci mogu pregledati predstojeće događaje, filtrirati po raznim kriterijumima i kliknuti da se registruju ili pogledaju detalje na SidewaysData.

Šta prikazuje

• Kartice događaja sa imenom, datumom, lokacijom i statusom registracije
• Padajući filteri za godinu, tip događaja, status registracije i mogućnosti volontiranja
• Direktni linkovi ka stranicama događaja na SidewaysData
• Responsive raspored koji se prilagođava svakom ekranu

Osnovni kod za ugrađivanje

Dodajte ovaj script tag na vaš sajt gde želite da se prikažu događaji:

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

Zamenite your-organizer-id sa vašim stvarnim organizer ID-jem (pogledajte Dobijanje vaših ID-jeva).

Podrazumevano ponašanje

Bez dodatne konfiguracije, vidžet će:

• Prikazati sve događaje od navedenih organizatora
• Prikazati padajuće filtere za godinu, tip događaja, status registracije i mogućnosti volontiranja
• Sortirati događaje po datumu (počev od najstarijih)
• Uključiti događaje sa bilo kojim statusom registracije

Kako radi

Vidžet kreira responsive iframe koji učitava sadržaj sa SidewaysData. Iframe automatski prilagođava visinu da odgovara sadržaju, tako da nema skrolovanja unutar samog vidžeta. Događaji ostaju sinhronizovani sa vašim SidewaysData nalogom—bilo kakve izmene koje napravite se automatski reflektuju.

Sledeći koraci

• Konfigurišite vidžet sa opcionalnim atributima
• Pogledajte Uobičajene primere za različite slučajeve upotrebe

Prilagodite Find Events vidžet pomoću data atributa na script tagu. Svi atributi su opcioni osim onih kojima se navode koje događaje prikazati.

Navođenje događaja

Morate uključiti bar jedan od ovih atributa da biste odredili koje događaje prikazati:

data-organizer-ids

Prikaži sve događaje od određenih organizatora. Koristite vrednosti razdvojene zarezom za više organizatora.

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

Više organizatora:

<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

Prikaži samo određene događaje po njihovim ID-jevima. Koristite vrednosti razdvojene zarezom za više događaja.

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

Opcije filtriranja

data-event-status

Filtriraj događaje po statusu registracije. Vrednosti: open, closed ili any.

data-event-status="open"

data-default-reg-status

Postavite podrazumevanu vrednost za padajući meni statusa registracije. Ovo unapred bira opciju filtera ali i dalje omogućava posetiocima da je promene.

data-default-reg-status="open"

data-limit-organizer-event-types

Kada je postavljeno na true, prikazuju se samo tipovi događaja koje organizator zaista koristi, umesto svih dostupnih tipova događaja u padajućem meniju.

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

data-hide-volunteers-dropdown

Kada je postavljeno na true, sakrij padajući meni filtera za volonterske prilike.

data-hide-volunteers-dropdown="true"

Opcije prikaza

data-is-results-mode

Kada je postavljeno na true, prikaži događaje za koje su dostupni rezultati umesto nadolazećih događaja. Korisno za stranicu "Past Results".

data-is-results-mode="true"

data-newest-first

Kada je postavljeno na true, sortiraj događaje tako da budu najnoviji prvi umesto podrazumevanog sortiranja od najstarijih.

data-newest-first="true"

Napredne opcije

data-origin

Koristite prilagođeni domen umesto podrazumevanog sidewaysdata.com. Potrebno samo ako imate prilagođeni domen konfigurisan sa SidewaysData.

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

Kompletan primer

Here's an example using multiple configuration options:

<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>

Ovo prikazuje događaje sa otvorenom registracijom od "example-motorsports", prikazuje samo relevantne tipove događaja u filteru, skriva padajući meni za volontere i sortira događaje tako da najnoviji budu prvi.

Uobičajene konfiguracije za widget Find Events koje odgovaraju različitim slučajevima upotrebe.

Prikaži sve vaše događaje

Prikaz svih događaja iz vaše organizacije sa svim dostupnim opcijama filtera:

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

Prikaži samo događaje sa otvorenom registracijom

Prikaži događaje koji trenutno prihvataju registracije:

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

Prikaži događaje sa rezultatima

Kreirajte stranicu „Rezultati iz prošlosti“ koja prikazuje događaje koji imaju vremenske rezultate:

<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>

Prikaži određene događaje

Prikažite samo određene događaje, na primer seriju prvenstava:

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

Prikaži događaje od više organizatora

Prikažite događaje iz više organizacija na regionalnoj stranici ili stranici serije:

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

Pojednostavljeni prikaz (minimalni filteri)

Prikaz događaja sa čišćim interfejsom skrivajući manje korišćene filtere:

<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>

Widget za početnu stranicu (otvoreni događaji, najnoviji prvi)

Uobičajena konfiguracija za početnu stranicu vašeg sajta:

<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>

Podrazumevano na filter otvorene registracije

Prikažite sve događaje, ali postavite filter registracije da bude podrazumevano na "open":

<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>

Ovo se razlikuje od data-event-status="open" zato što posetioci i dalje mogu promeniti filter da bi videli zatvorene događaje.

The Live Results widget prikazuje rezultate trka u realnom vremenu na vašem veb-sajtu. Gledaoci mogu pratiti tok događaja uživo i pregledati konačne rezultate kasnije—sve bez napuštanja vašeg sajta.

What It Displays

• Rezultati merenja u realnom vremenu tokom živih događaja
• Indikator "Live Results" ili "Final Results" zasnovan na vremenu događaja
• Ugrađeni chat uživo koji pokreće FastComments za interakciju gledalaca
• Automatska ažuriranja kako se nova vremena beleže

Basic Embed Code

Dodajte ovaj script tag na vaš veb-sajt tamo gde želite da se rezultati pojave:

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

Zamenite your-organizer-id sa vašim stvarnim organizer ID-jem (pogledajte Getting Your IDs).

Napomena: Live Results widget zahteva atribut data-organizer-id. Widget se neće učitati bez njega.

How It Works

Widget kreira responzivni iframe koji se povezuje sa SidewaysData-ovim sistemom za vremensko merenje u realnom vremenu. Tokom aktivnog događaja:

• Rezultati se ažuriraju u realnom vremenu kako se vremena beleže
• Widget prikazuje "Live Results" da označi da merenje traje
• Chat uživo omogućava gledaocima da komentarišu događaj

Nakon završetka događaja:

• Rezultati ostaju dostupni za pregled
• Widget prelazi na indikator "Final Results"
• Istorija chata se čuva

Use Cases

• Event day - Ugradite na vašu početnu stranicu kako bi gledaoci mogli pratiti uživo
• Dedicated results page - Napravite stalnu stranicu sa rezultatima na vašem sajtu
• Social media landing page - Podelite link ka stranici sa rezultatima tokom događaja

Next Steps

• Configure the widget sa opcionim atributima

The Live Results widget ima minimalnu konfiguraciju—potreban je samo vaš organizer ID.

Required Attribute

data-organizer-id

Vaš SidewaysData organizer ID. Ovo je obavezno da bi vidžet funkcionisao.

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

Pogledajte Kako pronaći svoje ID-jeve za pomoć pri pronalaženju vašeg organizer ID.

Optional Attribute

data-origin

Koristite prilagođeni domen umesto podrazumevanog sidewaysdata.com. Potrebno samo ako ste konfigurisali prilagođeni domen u SidewaysData.

<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>

Complete Example

Tipičan Live Results embed:

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

Error Handling

Ako atribut data-organizer-id nedostaje, vidžet će zabeležiti grešku u konzoli pregledača i neće se prikazati. Obavezno uključite ovaj obavezni atribut.

Placement Tips

• Postavite vidžet u kontejner sa odgovarajućom širinom (preporučeno najmanje 320px)
• Vidžet automatski prilagođava svoju visinu tako da odgovara sadržaju
• Razmislite o postavljanju iznad pregiba na dane događaja radi maksimalne vidljivosti
• Dobro funkcioniše kao glavni sadržaj posvećene stranice "Live Results"

SidewaysData widgeti su ugrađeni kao iframe-ovi, što ograničava direktno stilizovanje putem CSS-a. Međutim, možete kontrolisati kako se widgeti uklapaju u raspored vaše stranice.

Stil kontejnera

Postavite widget u kontejner element da biste kontrolisali njegovo postavljanje i maksimalnu širinu:

<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>

Kontrola širine

Widgeti se automatski šire na 100% širine kontejnera. Kontrolišite širinu stilizovanjem roditeljskog elementa:

<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>

Ponašanje visine

Visina widgeta se automatski prilagođava sadržaju. Iframe koristi postMessage da saopšti potrebnu visinu vašoj stranici, čime se eliminišu trake za pomeranje unutar widgeta.

Responzivni dizajn

Widgeti su dizajnirani da budu responzivni i da dobro funkcionišu na mobilnim uređajima. Automatski se prilagođavaju užim ekranima. Za najbolje rezultate:

• Koristite procentualne ili fleksibilne širine kontejnera
• Izbegavajte postavljanje fiksnih širina u pikselima koje mogu izazvati horizontalno skrolovanje na mobilnim uređajima
• Testirajte na različitim veličinama ekrana

Kompatibilnost pozadine

Widgeti imaju svetlu pozadinu i dizajnirani su da dobro izgledaju na stranicama svetlih boja. Ako vaša stranica ima tamnu pozadinu, razmislite o postavljanju widgeta u kontejner svetle boje:

<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>

Ograničenja stilizovanja iframe-a

Pošto widgeti koriste iframe-ove, ne možete direktno stilizovati sadržaj unutar njih (npr. fontove, boje ili stilove dugmadi). Sadržaj widgeta koristi standardnu stilizaciju SidewaysData-a kako bi se obezbedio konzistentan, profesionalan izgled.

Ako imate specifične zahteve u pogledu brendiranja, kontaktirajte podršku SidewaysData-a da biste razgovarali o opcijama.

Dodavanje margina i razmaka

Dodajte razmak oko widgeta koristeći standardni CSS na kontejneru:

<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>

Uobičajeni problemi i rešenja pri korišćenju SidewaysData widgeta.

Widget se ne pojavljuje

Proverite URL skripte

Proverite da src atribut skripte ukazuje na ispravan URL:

• 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

Proverite obavezne atribute

• Find Events widget zahteva ili data-organizer-ids ili data-event-ids
• Live Results widget zahteva data-organizer-id

Proverite JavaScript greške

Otvorite konzolu za razvojne programere u pregledaču (obično F12 ili desni klik → Inspect → Console) i potražite poruke o greškama. Live Results widget prijavljuje grešku ako nedostaje data-organizer-id.

Proverite da su vaši ID-jevi tačni

Dvostruko proverite da li se organizer i event ID-jevi poklapaju sa onim što je prikazano na SidewaysData. Pogledajte Getting Your IDs.

Prikazuju se pogrešni događaji

Proverite kako je napisan organizer ID

Organizer ID-jevi razlikuju velika i mala slova. Uverite se da ID tačno odgovara onome što se pojavljuje u SidewaysData URL-u.

Proverite podešavanja filtera

Ako koristite data-event-status="open" ali ne vidite događaje, moguće je da nemate nijedan događaj sa otvorenom registracijom. Pokušajte ukloniti ovaj filter da vidite sve događaje.

Proverite režim rezultata

Ako je postavljeno data-is-results-mode="true", widget prikazuje događaje sa rezultatima, a ne predstojeće događaje. Uklonite ovaj atribut da biste videli predstojeće događaje.

Problemi sa visinom widgeta

Widget izgleda isečen

Widget bi trebao automatski prilagoditi svoju visinu. Ako sadržaj izgleda isečen:

1. Proverite da nijedan roditeljski element nema podešeno overflow: hidden
2. Uverite se da nijedan CSS ne postavlja fiksnu visinu na iframe
3. Proverite da li je JavaScript omogućen u vašem pregledaču

Previše praznog prostora

Ako ispod widgeta ima previše praznog prostora, automatsko podešavanje visine bi to trebalo rešiti. Ako nije, moguće je da se widget učitava ali nema događaja za prikaz.

Sadržaj se ne osvežava

Događaji ne prikazuju najnovije izmene

Widgeti učitavaju svež sadržaj sa SidewaysData pri svakom učitavanju stranice. Ako se izmene ne pojavljuju:

1. Uradite hard refresh stranice (Ctrl+F5 ili Cmd+Shift+R)
2. Očistite keš pregledača
3. Sačekajte nekoliko minuta — neke izmene mogu potrajati dok se ne propagiraju

Live rezultati se ne osvežavaju

Tokom live tajminga, rezultati bi trebalo da se automatski osvežavaju. Ako se ne osvežavaju:

1. Proverite da li se događaj aktivno meri na SidewaysData
2. Osvežite stranicu
3. Proverite vašu internet konekciju

Problemi sa graditeljima sajtova

WordPress

Ako koristite WordPress, možda ćete morati da:

• Koristite "Custom HTML" blok ili widget
• Privremeno onemogućite bilo koji plugin koji blokira skripte
• Proverite da li vaš tema uklanja script tagove iz sadržaja

Squarespace

Koristite "Code Block" ili "Embed" element i nalepite script tag direktno.

Wix

Koristite opciju "HTML iframe" ili "Custom Element" da dodate skriptu.

Cross-Origin problemi

Widgeti učitavaju sadržaj sa SidewaysData servera. Ako vidite cross-origin greške:

1. Uverite se da koristite https:// (ne http://) za URL skripte
2. Ako koristite data-origin, proverite da li je domen pravilno konfigurisан

Još uvek imate problema?

Ako ste probali ova rešenja i widget i dalje ne radi ispravno, kontaktirajte SidewaysData podršku sa:

• URL stranice na kojoj ugrađujete widget
• Potpunim script tagom koji koristite
• Bilo kojim porukama o grešci iz konzole pregledača
• Opisom šta očekujete naspram onoga što se dešava