URL скопирован в буфер обмена!

Как сделать таймер с перезапуском по расписанию на Тильда

При помощи данной модификации можно сделать таймер в Zero Block который будет перезапускаться в указанные дни с автоматическим расчетом времени к новой дате. При достижении последней даты из списка, таймер останавливается.

Модификация работает с включенным Autoscale в блоках
Модификация работает только с Zero Block
Номер модификации в библиотеке TiCode

Генератор кода

Ссылка для таймера
Даты перезапуска
Тип разделителя
Войдите в аккаунт чтобы получить доступ к генератору кода
Этот генератор кода доступен только тем кто оплатил подписку
<!--TICODE--><!-- Библиотека модификаций для Тильда https://ticode.dev --> <!--TCD085--><script> document.addEventListener("DOMContentLoaded", function() { (function TiCode() { var TiCodeTimer = document.querySelectorAll('a[href="#ti-datatimer"]'); TiCodeTimer.forEach(function (timerElement) { timerElement.removeAttribute('href'); }); var TiShowDays = true; var TiShowHours = true; var TiShowMinutes = true; var TiShowSeconds = true; var TiLoop = true; var TiLocalStorage = false; var TiTimerStopped = false; var TCdateStrings = "2024-11-18 23:40, 2025-04-12 16:00"; var TCdateArray = TCdateStrings.split(',').map(function(dateString) { var Tiparts = dateString.trim().split(' '); var TidateParts = Tiparts[0].split('-'); var TitimeParts = Tiparts[1].split(':'); return new Date(TidateParts[0], TidateParts[1] - 1, TidateParts[2], TitimeParts[0], TitimeParts[1]); }); var TicurrentEndDateIndex = 0; var TiCodeTime; var Titimer; function updateTimer() { var Tinow = new Date().getTime(); var timeLeft = TiCodeTime - Tinow; if ((Tinow >= TCdateArray[TicurrentEndDateIndex].getTime()) && !TiTimerStopped) { clearInterval(Titimer); TicurrentEndDateIndex++; if (TicurrentEndDateIndex >= TCdateArray.length) { TicurrentEndDateIndex = 0; if (!TiLoop) { TiTimerStopped = true; return; } } resetTimer(); } else { var TiRemainingDays = Math.floor(timeLeft / (1000 * 60 * 60 * 24)); var TiRemainingHours = Math.floor((timeLeft % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); var TiRemainingMinutes = Math.floor((timeLeft % (1000 * 60 * 60)) / (1000 * 60)); var TiRemainingSeconds = Math.floor((timeLeft % (1000 * 60)) / 1000); var TCTimer = []; if (TiShowDays) TCTimer.push(padNumber(TiRemainingDays)); if (TiShowHours) TCTimer.push(padNumber(TiRemainingHours)); if (TiShowMinutes) TCTimer.push(padNumber(TiRemainingMinutes)); if (TiShowSeconds) TCTimer.push(padNumber(TiRemainingSeconds)); var TCformattedTimer = TCTimer.join(' : '); TiCodeTimer.forEach(function (timerElement) { timerElement.textContent = TCformattedTimer; }); } } function padNumber(number) { return number < 10 ? '0' + number : number; } function resetTimer() { var TCendDate = TCdateArray[TicurrentEndDateIndex]; TiCodeTime = TCendDate.getTime(); if (TiLocalStorage) { localStorage.setItem('TiCodeEnd', TiCodeTime); } Titimer = setInterval(updateTimer, 50); } resetTimer(); })(); }); </script> <script> (function TCDupdType() { const TildahtmlBclok = document.currentScript; if (TildahtmlBclok) { const recordElement = TildahtmlBclok.closest('.r[data-record-type]'); if (recordElement) { recordElement.setAttribute('data-record-type', Math.random().toString(36).substring(2, 12)); }}})(); </script>
КОПИРОВАТЬ КОД
Для нормальной работы модификации необходимо включить библиотеку jQuery.
Как включить: Настройки сайта -> Еще -> Подключить jQuery на страницах сайта
1. Создаем в Zero Block текстовый элемент. Вместо заглушки пишем 00:00:00:00 и назначаем ему ссылку #ti-datatimer

2. Указываем в поле "Даты перезапуска" дату и время когда нужно перезапустить таймер, в формате 2024-04-18 23:41, 2024-04-20 16:02

3. При необходимости указываем другие настройки:
Ссылка для таймера - можно указать свою уникальную ссылку для таймера вместо #ti-datatimer. Если делаете несколько таймеров на одной странице с разными настройками, то ссылка всегда должна быть уникальная при генерации нового кода. Если таймеров на странице много и все они одинаковые, то можно указывать одинаковую ссылку всем элементам и использовать один код.
Тип разделителя - указываем тип разделителя. Это может быть символ, слово или пробел. Если указали новый разделитель вместо : то не забываем тексте таймера его обновить. Например указали в качестве разделителя / Тогда в тексте таймера указываем 00/00/00/00

4. Копируем готовый код и вставляем в HTML блок Т123.
Этот таймер считает время до Нового года и перезапускается каждый год
Made on
Tilda