Radio Manager
Powrót do przewodnika Guide

Player radiowy

Twój odtwarzacz, gotowy do osadzenia na dowolnej stronie

Do czego służy „Player radiowy"?

Ta strona tworzy Państwa „Odtwarzacz eksportowalny" : odtwarzacz w Państwa kolorach, który można osadzić na dowolnej stronie internetowej, udostępnić za pomocą linku lub otworzyć w ulubionym programie słuchaczy. Znajdą go Państwo w menu „Emisja w sieci" > „Player radiowy".

Warto wiedzieć: Wymagane jest aktywne i skonfigurowane radio. W przeciwnym razie strona wyświetli komunikat „Radio nieskonfigurowane" oraz przycisk „Skonfiguruj moje radio".
Podgląd po prawej stronie: odtwarzacz dokładnie tak, jak zobaczą go słuchacze
Podgląd po prawej stronie: odtwarzacz dokładnie tak, jak zobaczą go słuchacze Kliknij, aby powiększyć

„Format odtwarzacza": 4 układy

Pierwszy blok oferuje cztery formaty:

  • „Poziomy" — klasyczny pasek, u góry lub u dołu strony.
  • „Pionowy" — widget do bocznej kolumny.
  • „Mini" — kompaktowy pasek, do nagłówka lub pływającego przycisku.
  • „Pełna strona" — format pełnoekranowy, w którym wszystkie funkcje są wyświetlane bezpośrednio, bez konieczności otwierania dodatkowych paneli.
Przykład

Radio Horizon osadza swój odtwarzacz w trzech różnych miejscach. Format dobiera się według miejsca docelowego, a nie według upodobań.

  • Baner pod menu strony głównej → format „Poziomy".
  • Boczna kolumna bloga → format „Pionowy".
  • Strona „Słuchaj na żywo" → format „Pełna strona".
  • Nagłówek strony partnerskiej → format „Mini".

Dlaczego: w trybie „Pełna strona" dedykacje, historia i ranking wyświetlają się bezpośrednio, bez otwierania paneli — to jedyny format, który uzasadnia przeznaczenie mu całej strony. Z kolei „Mini" na dedykowanej stronie oferowałby jedynie przycisk odtwarzania.

Cztery formaty: Poziomy, Pionowy, Mini i Pełna strona
Cztery formaty: Poziomy, Pionowy, Mini i Pełna strona Kliknij, aby powiększyć

Zakładka „Kolory"

Punktem wyjścia jest jedna z „Szybkich palet" (domyślnie fioletowa, czerwono-pomarańczowa, szmaragdowa, intensywny róż, złota, błękitna, ciemna minimalistyczna, jasna minimalistyczna), a następnie można dostosować każdy odcień: „Kolor podstawowy", „Kolor dodatkowy", „Tło" i „Tekst". Każdy kolor ustawia się za pomocą próbnika lub wpisując kod szesnastkowy. Przycisk „Resetuj" przywraca oryginalną paletę.

Przykład

Radio Cactus ma czerwone logo i jasną stronę. Stylizuje swój odtwarzacz w dwóch krokach.

Paleta „Jasna minimalistyczna"→ Kolor podstawowy = czerwień z logo→ „Zapisz konfigurację"

Czerwień wpisuje się bezpośrednio w pole kodu szesnastkowego, pozostałe trzy kolory zachowują wartości z palety.

Dlaczego: palety dostarczają gotowe, czytelne zestawienia „Tło" / „Tekst". Zmieniając tylko kolor podstawowy, zachowują Państwo swoją identyfikację wizualną bez ryzyka, że jasny szary tekst zleje się z białym tłem.

Szybkie palety, a następnie cztery kolory do indywidualnego ustawienia
Szybkie palety, a następnie cztery kolory do indywidualnego ustawienia Kliknij, aby powiększyć

Zakładka „Funkcje": 5 opcji do włączenia

  • „Głosowanie na aktualny utwór" — słuchacze mogą polubić lub odrzucić aktualnie grający utwór.
  • „Dedykacje" — mogą wysyłać wiadomości z dedykacjami bezpośrednio z odtwarzacza.
  • „Historia emisji" — 20 ostatnich utworów nadanych na antenie.
  • „Ranking utworów" — zestawienie najczęściej granych utworów z ostatnich 30 dni, wraz z liczbą polubień.
  • „Nadchodzące utwory" — 2 kolejne utwory, ich czas trwania oraz godzina rozpoczęcia aktualnie grającego. Dostępne wyłącznie dla radia w trybie programowania dynamicznego.
Warto wiedzieć: Włączenie funkcji zwiększa efektywną wysokość odtwarzacza: w trybie „Poziomy" podgląd przechodzi z 80 do 180 pikseli, gdy tylko zaznaczona zostanie jakakolwiek opcja. Należy pamiętać o dostosowaniu wysokości elementu iframe.
Przykład

Ambiance FM uruchamia poziomy odtwarzacz i włącza tylko dwie z pięciu opcji.

„Głosowanie na aktualny utwór"→ „Dedykacje"→ Wysokość 80 → 180 px→ „Zapisz konfigurację"

„Historia emisji" i „Ranking utworów" pozostają odznaczone, dopóki antena nie popracuje kilku tygodni. „Nadchodzące utwory" nie jest dostępne: stacja nie korzysta z programowania dynamicznego.

Dlaczego: głosowanie zasila ranking z ostatnich 30 dni oraz Tygodniowy Top 10 — bez niego obie te strony pozostają puste. Dedykacje natomiast trafiają do sekcji „Narzędzia > Dedykacje" tylko wtedy, gdy ta opcja jest tu zaznaczona.

Pięć przełączników, każdy z opisem tego, co dodaje do odtwarzacza
Pięć przełączników, każdy z opisem tego, co dodaje do odtwarzacza Kliknij, aby powiększyć

Zakładka „Mapa słuchaczy"

Mapa świata na żywo pokazuje przybliżoną lokalizację (do poziomu miasta) słuchaczy aktualnie podłączonych, wraz z plakietką „NA ŻYWO" i liczbą połączonych. Mapa aktualizuje się automatycznie co 25 sekund, a przycisk umożliwia ręczne odświeżenie.

Warto wiedzieć: Komunikat „Brak możliwych do zlokalizowania słuchaczy podłączonych w tej chwili" jest normalny, gdy nikt nie słucha — lub gdy obecni słuchacze nie mogą być zlokalizowani. Jeśli radio jest offline, mapa również to sygnalizuje.
Mapa na żywo: liczba połączonych i przybliżona lokalizacja
Mapa na żywo: liczba połączonych i przybliżona lokalizacja Kliknij, aby powiększyć

„Podgląd" i zapisywanie

Prawa kolumna wyświetla odtwarzacz dokładnie tak, jak zobaczą go słuchacze, i aktualizuje się przy każdej zmianie. Przycisk „Otwórz w oknie podręcznym" uruchamia go w oknie dopasowanym do wybranego formatu.

Wskazówka: Podgląd odzwierciedla bieżące ustawienia na żywo, jednak opublikowany odtwarzacz korzysta z zapisanej konfiguracji. Zawsze kończ pracę kliknięciem „Zapisz konfigurację", w przeciwnym razie słuchacze nie zobaczą wprowadzonych zmian.
Przycisk „Zapisz konfigurację
Przycisk „Zapisz konfigurację" pod kolumną ustawień Kliknij, aby powiększyć

Zakładka „Kod osadzania" i krótki link

Dwa sposoby na udostępnienie odtwarzacza:

  • „Kod iframe (skopiuj i wklej na swojej stronie)": jedno kliknięcie ikony kopiowania, wklejenie do strony i gotowe.
  • „Krótki link (do udostępnienia)", w postaci /play/TwojeRadio, uzupełniony o format, gdy nie jest to poziomy (/play/TwojeRadio/vertical, /mini, /full). Otwiera odtwarzacz z zapisanymi kolorami i od razu uruchamia odtwarzanie.
Warto wiedzieć: Kod iframe nie utrwala wybranych funkcji: są one nadal sterowane przez zapisaną konfigurację radia. Można więc włączyć dedykacje lub ranking później bez konieczności ponownego wklejania kodu na stronie.
Przykład

Studio Nova udostępnia swój odtwarzacz w dwóch miejscach, korzystając z dwóch różnych narzędzi.

  • Na swojej stronie: kopiuje kod iframe i wkleja go na stronie głównej. Nic więcej nie trzeba robić.
  • W mediach społecznościowych: udostępnia krótki link /play/StudioNova/full, który otwiera odtwarzacz pełnoekranowy w jej kolorach i od razu uruchamia odtwarzanie.

Trzy tygodnie później zaznacza „Dedykacje" w zakładce „Funkcje" i zapisuje konfigurację: odtwarzacz już osadzony na stronie wyświetla nowość bez konieczności zmiany jakiejkolwiek linii kodu.

Dlaczego: kod iframe wskazuje na zapisaną konfigurację, a nie ją kopiuje. Krótki link nigdy się nie dezaktualizuje: wystarczy dodać /vertical, /mini lub /full, aby zmienić format.

Kod iframe do skopiowania i wklejenia oraz krótki link do udostępnienia
Kod iframe do skopiowania i wklejenia oraz krótki link do udostępnienia Kliknij, aby powiększyć

Zakładka „Strumień audio & oprogramowanie"

Ta zakładka jest przeznaczona dla każdego, kto chce słuchać radia poza stroną internetową.

  • „Link do strumienia audio (Icecast)": bezpośredni adres URL anteny.
  • Przycisk dla każdego zastosowania, z gotowym formatem: „VLC Media Player" (.m3u), „Winamp" (.pls), „foobar2000" (.pls), „iTunes / Apple Music" (.m3u), „Windows Media Player" (.asx), „Sonos · Alexa · Google Home" (bezpośredni URL), „Katalogi (TuneIn, Radio Garden…)" oraz „Aplikacje mobilne" (.pls).
  • „Link JSON (aktualny utwór)": metadane na żywo — tytuł, artysta, okładka, liczba słuchaczy — do zasilania zewnętrznej strony lub własnego wyświetlacza.
Warto wiedzieć: Pliki playlist są generowane dynamicznie: strumień jest do nich wstrzykiwany w momencie pobierania. Udostępniane linki pozostają więc ważne nawet w przypadku zmiany naszego serwera emisji.
Przykład

Radio Horizon otrzymuje trzy prośby w ciągu jednego tygodnia. Każda ma swój przycisk w tej zakładce.

  • Słuchacz słucha na komputerze przez VLC → przycisk „VLC Media Player", plik .m3u.
  • Słuchaczka chce uruchomić radio głosem na głośniku → przycisk „Sonos · Alexa · Google Home", który podaje bezpośredni URL.
  • Strona partnerska chce wyświetlać aktualnie grający utwór → „Link JSON (aktualny utwór)", który zwraca tytuł, artystę, okładkę i liczbę słuchaczy.

Dlaczego: każde oprogramowanie oczekuje swojego formatu. Podanie surowego adresu URL Icecast komuś, kto używa Winampa, to trzy niepotrzebne wymiany wiadomości.

Adres URL strumienia Icecast i skróty do programów do słuchania
Adres URL strumienia Icecast i skróty do programów do słuchania Kliknij, aby powiększyć

Zakładka „Zalecane rozmiary"

Zalecane wymiary elementu iframe dla każdego formatu:

  • „Poziomy" — szerokość 400–800 px, wysokość 80–200 px: pasek u dołu lub u góry strony.
  • „Pionowy" — szerokość 280–360 px, wysokość 400–550 px: pasek boczny, widget lateralny.
  • „Mini" — szerokość 250–350 px, wysokość 56 px: pływający przycisk, nagłówek.
  • „Pełna strona" — szerokość 100%, wysokość 700–900 px: dedykowana strona, pełnoekranowa zakładka radia.
Wskazówka: Proponowany kod stosuje już właściwy rozmiar. Jeśli zmienią go Państwo ręcznie, zachowajcie zapas wysokości: zbyt niski odtwarzacz obetnie dedykacje i historię.
Przykład

Radio Horizon sprawdza wartości faktycznie wpisane w skopiowanym kodzie dla swoich trzech integracji.

  • Baner strony głównej, „Poziomy" bez opcji: width="100%", height="96px". Po zaznaczeniu głosowania i dedykacji wysokość wzrasta do 196px.
  • Boczna kolumna, „Pionowy": width="360px", height="496px" — w zalecanym przedziale szerokości 280–360 px.
  • Dedykowana strona, „Pełna strona": width="100%", height="776px".

„Mini" generuje wymiary 320px na 72px: pasek ma 56 px, do których kod dodaje 16 px marginesu.

Dlaczego: te 16 px marginesu zapobiega pojawieniu się nieestetycznego paska przewijania w elemencie iframe. Wymuszenie dokładnej wysokości odtwarzacza spowoduje wyświetlenie paska przewijania o szerokości kilku pikseli.

Zalecane wymiary dla każdego formatu
Zalecane wymiary dla każdego formatu Kliknij, aby powiększyć