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 на страницах сайта
Как включить: Настройки сайта -> Еще -> Подключить 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.
2. Указываем в поле "Даты перезапуска" дату и время когда нужно перезапустить таймер, в формате 2024-04-18 23:41, 2024-04-20 16:02
3. При необходимости указываем другие настройки:
Ссылка для таймера - можно указать свою уникальную ссылку для таймера вместо #ti-datatimer. Если делаете несколько таймеров на одной странице с разными настройками, то ссылка всегда должна быть уникальная при генерации нового кода. Если таймеров на странице много и все они одинаковые, то можно указывать одинаковую ссылку всем элементам и использовать один код.
Тип разделителя - указываем тип разделителя. Это может быть символ, слово или пробел. Если указали новый разделитель вместо : то не забываем тексте таймера его обновить. Например указали в качестве разделителя / Тогда в тексте таймера указываем 00/00/00/00
4. Копируем готовый код и вставляем в HTML блок Т123.
