Widget z wynikami Lotto na własną stronę — jak go osadzić

Najczęstsze zastosowanie widgetu to pasek boczny bloga albo stopka strony tematycznej, gdzie ma się pojawiać aktualny wynik ostatniego losowania bez ręcznej aktualizacji. Dane pochodzą wprost z naszego serwisu, więc po każdym losowaniu odświeżają się same. Poniżej opisujemy kod, parametry, wymiary i ograniczenia.

Kod do skopiowania

Poniższy znacznik wystarczy wkleić w miejsce, w którym widget ma się pojawić. Atrybuty width i height ustaw według własnego układu — poniżej podajemy wartości, które sprawdzają się w typowej kolumnie bocznej.

<iframe src="https://pewniaki.pl/widgets/results" width="300" height="420" frameborder="0" scrolling="no" title="Wyniki losowań Lotto" loading="lazy"></iframe>

Atrybut title jest obowiązkowy ze względu na dostępność — czytniki ekranu odczytują go jako opis ramki. Atrybut loading="lazy" odracza wczytanie widgetu do momentu, w którym użytkownik dojedzie do niego wzrokiem; bez niego ramka ładuje się razem z resztą strony i podnosi czas pierwszego wyświetlenia. Ustawienie scrolling="no" ma sens tylko wtedy, gdy wysokość ramki mieści całą zawartość — przy zbyt niskiej wartości treść zostanie ucięta bez możliwości przewinięcia.

Parametry adresu

Zachowanie widgetu zmienia się przez parametry dopisane do adresu po znaku zapytania. Kolejne parametry rozdziela się znakiem ampersand. Wartości spoza dozwolonego zakresu są ignorowane — widget wraca wtedy do ustawienia domyślnego, zamiast zwracać błąd.

Parametr	Dozwolone wartości	Domyślnie	Co zmienia
gra	lotto, lotto-plus, eurojackpot, mini-lotto, multi-multi, kaskada	wszystkie	ogranicza widget do jednej gry
limit	1–10	1	liczba pokazanych losowań
motyw	jasny, ciemny	jasny	kolor tła i tekstu

Przykład adresu z dwoma parametrami: /widgets/results?gra=eurojackpot&limit=3 — widget pokaże wtedy trzy ostatnie losowania Eurojackpot i nic więcej. Pełne wyniki wszystkich gier zawsze znajdziesz na stronie głównej serwisu.

Jakie wymiary ustawić

Widget skaluje się do szerokości ramki, ale poniżej 260 pikseli kule z liczbami zaczynają się zawijać w drugą linię i układ przestaje być czytelny. Wysokość zależy od liczby wyświetlanych losowań — poniższe wartości są punktem wyjścia, a nie sztywną regułą.

• jedno losowanie, kolumna boczna: 300 × 420 pikseli
• trzy losowania, kolumna boczna: 300 × 760 pikseli
• pasek nad stopką, pełna szerokość: 100% × 300 pikseli

Jeśli ustawiasz szerokość na 100 procent, pamiętaj o nadaniu ramce stałej wysokości w pikselach. Iframe bez zadeklarowanej wysokości domyślnie dostaje 150 pikseli i zawartość zostaje ucięta. Zarezerwowanie wysokości z góry zapobiega też przeskokowi układu w chwili, gdy ramka się doczyta.

Czego widget nie wysyła

Ramka osadzona z innej domeny podlega regule tego samego pochodzenia, wbudowanej w każdą przeglądarkę. W praktyce oznacza to trzy rzeczy: widget nie odczyta treści Twojej strony, nie odczyta jej ciasteczek i nie wykona na niej żadnego skryptu. Zależność działa też w drugą stronę — Twoja strona nie ma wglądu we wnętrze ramki.

Sam widget nie ustawia ciasteczek ani nie zapisuje niczego w pamięci lokalnej przeglądarki. Nie wczytuje skryptów reklamowych ani narzędzi analitycznych. Serwer odnotowuje standardowe dane wywołania — adres IP, nagłówek przeglądarki i adres strony odsyłającej — tak samo jak przy każdym innym żądaniu HTTP, i nie łączy ich z żadnym profilem użytkownika. Szczegóły opisuje nasza polityka prywatności.

Ponieważ widget nie zapisuje ciasteczek, jego osadzenie nie wymaga od Ciebie rozszerzania własnego banera zgód. Jeśli jednak Twoja strona korzysta z narzędzia blokującego ramki zewnętrzne do momentu udzielenia zgody, widget zostanie objęty tą blokadą razem z pozostałymi — to ustawienie po Twojej stronie, nie po naszej.

Aktualizacja danych i co robić przy braku wyniku

Dane w widgecie pochodzą z tego samego źródła, co reszta serwisu, i odświeżają się po każdym losowaniu. Ramka nie odpytuje serwera w tle — pokazuje stan z chwili wczytania strony. Jeśli odwiedzający zostawi Twoją witrynę otwartą przez kilka godzin i w tym czasie odbędzie się losowanie, zobaczy nowy wynik dopiero po odświeżeniu.

Gdy widget wyświetla pustą ramkę, zacznij od otwarcia jego adresu bezpośrednio w nowej karcie. Jeżeli strona działa tam poprawnie, przyczyna leży po stronie osadzenia — najczęściej jest to nagłówek Content-Security-Policy Twojego serwera, ograniczający listę domen dozwolonych w dyrektywie frame-src. Drugą częstą przyczyną jest rozszerzenie blokujące reklamy, które wycina ramki z obcych domen niezależnie od ich zawartości.

Alternatywy dla ramki

Jeśli iframe nie wchodzi w grę — na przykład w newsletterze albo w systemie, który wycina obce ramki — zostają dwie ścieżki. Pierwsza to zwykły odsyłacz do strony z wynikami Lotto, który zawsze prowadzi do aktualnego losowania. Druga to kanał RSS z wynikami, który da się wciągnąć do własnego systemu i wyrenderować po swojemu.

Kanał RSS jest dostępny osobno dla każdej gry pod adresem /wyniki/{gra}/rss.xml — na przykład /wyniki/eurojackpot/rss.xml. Zwraca standardowy dokument XML z datą losowania i wylosowanymi liczbami w opisie pozycji, więc odczyta go każdy czytnik i większość systemów zarządzania treścią. To rozwiązanie wymaga po Twojej stronie kodu, ale daje pełną kontrolę nad wyglądem.