Как добавить аудио на сайт Tilda по прямой ссылке

Сразу важное: в Tilda нет отдельного блока «аудио-плеер». Добавить звук на страницу можно через блок с HTML-кодом — обычным тегом <audio>. Для этого нужна одна вещь: прямая ссылка на ваш mp3-файл. Разберём по шагам.

Что нужно сделать

Логика простая: разместить mp3 так, чтобы получить постоянную прямую ссылку на файл, и вставить в Tilda небольшой код, который покажет плеер. Всё.

Шаг 1. Получите прямую ссылку на mp3

Браузерному плееру нужен прямой адрес самого файла, а не ссылка на страницу-обёртку (поэтому ссылки из облачных дисков обычно не подходят — они ведут на просмотрщик, а не на файл). Загрузите mp3 в LF Drive и скопируйте прямую ссылку вида https://lfdrive.ru/f/КОД.

Шаг 2. Добавьте блок с кодом в Tilda

На странице нажмите «+», выберите блок «Другое» → «HTML-код» (T123) и вставьте:

<audio controls src="https://lfdrive.ru/f/ВАШ_КОД">
  Ваш браузер не поддерживает аудио.
</audio>

Замените ВАШ_КОД на код из вашей ссылки. Атрибут controls показывает кнопки воспроизведения, перемотки и громкости.

Опубликуйте страницу — появится рабочий плеер. Вот как он выглядит (это стандартный плеер браузера):

Ограничения стандартного плеера

• Вид зависит от браузера. Нативный плеер выглядит по-разному в Chrome, Safari и Firefox — под дизайн сайта его почти не подогнать.
• Автозапуск со звуком заблокирован. Браузеры не дают включать звук сам по себе — только после действия пользователя. Это защита от назойливых сайтов, отключить нельзя.
• Нет обложки, названия трека, кастомных кнопок — только базовый набор.

Для простой задачи «дать послушать трек или подкаст» этого достаточно. Если же нужен красивый плеер под дизайн — с обложкой, своими кнопками и оформлением — это уже кастомное решение.

Красивый кастомный плеер

Стандартный <audio> не оформить под бренд. Для аккуратного плеера с дизайном есть готовая модификация — посмотрите в видео, как она выглядит и работает на реальной странице Tilda: