Как вставить плеер Tunio

Зачем нужен Tunio Player

Tunio Player — это веб-компонент, который позволяет добавить ваш эфир на любой сайт или в внутренние панели. Он быстро подключается, подстраивается под бренд и показывает текущий трек, обложку и статус воспроизведения.

Установка

Выберите удобный пакетный менеджер и установите tunio-player:

BASH

npm install tunio-player
# или
yarn add tunio-player
# или
pnpm add tunio-player

Использование

После установки импортируйте плеер и передайте id станции. Это UUID, который можно посмотреть в разделе «Основные настройки» нужной станции в панели управления Tunio.

TSX

import { TunioPlayer } from "tunio-player";
 
function App() {
  return (
    <TunioPlayer id="uuid-вашей-станции" theme="dark" />
  );
}

Если ваш проект использует SSR или Next.js App Router, подключайте компонент в клиентском модуле и избегайте рендера на сервере.

Возможности плеера

Отображение текущего трека, обложки и статуса эфира.
Поддержка автозапуска и управления громкостью через параметры.
Адаптивная вёрстка и готовые темы оформления.
Интеграция с кастомными кнопками Play/Pause через событие playState.

Подробности и дополнительные параметры — в репозитории tunio-player.