Как показывать блоки в заданное время и день недели на Tilda
С помощью этой модификации можно настроить расписание для показа блоков на сайте Тильда. Можно указать время и день недели в который нужно показывать блок. Дополнительно можно выводить popup и полностью скрывать блоки после указанной даты.
Этот генератор кода доступен только тем кто оплатил подписку
<!--TICODE--><!-- Библиотека модификаций для Тильда https://ticode.dev -->
<!--TCD081--><style>
.ticode-hidden {
position: absolute;
left: -5000px;
}
</style>
<script>
document.addEventListener('DOMContentLoaded', function() {
var ids = '#rec770454345';
var blockIds = ids.split(',').map(id => id.trim());
var TCDstartTime = "20:00";
var TCDendTime = "22:00";
var TCDstartHour = parseInt(TCDstartTime.split(':')[0], 10);
var TCDstartMinute = parseInt(TCDstartTime.split(':')[1], 10);
var TCDendHour = parseInt(TCDendTime.split(':')[0], 10);
var TCDendMinute = parseInt(TCDendTime.split(':')[1], 10);
var tidisableAfterDate = false;
var tidisableDateTime = "20.07.2024 01:20";
var TCDSblocksShown = false;
var TCDSpopupInterval = 0;
function reloadAnimation(blockId) {
var $current = $(blockId);
blockIds.forEach(function(id) {
$(id).find('.t396__elem').each(function() {
$(this).removeClass('t-sbs-anim_started t-animate_started');
});
});
$current.find('.t396__elem').each(function() {
$(this).addClass('t-sbs-anim_started t-animate_started');
});
blockIds.forEach(function(id) {
$(id).find('.t396__elem[data-animate-style]').each(function() {
$(this).removeClass('t-animate_started');
});
});
setTimeout(function() {
$current.find('.t396__elem[data-animate-style]').each(function() {
$(this).addClass('t-animate_started');
});
}, 100);
}
function showBlocks() {
blockIds.forEach(function(id) {
var block = document.querySelector(id);
if (block) {
block.classList.remove('ticode-hidden');
reloadAnimation(id);
}
});
}
function hideBlocks() {
blockIds.forEach(function(id) {
var block = document.querySelector(id);
if (block) {
block.classList.add('ticode-hidden');
}
});
}
function canShowPopup() {
if (TCDSpopupInterval === 0) return true;
var lastPopupDate = localStorage.getItem('lastPopupDate');
if (!lastPopupDate) return true;
var lastDate = new Date(lastPopupDate);
var now = new Date();
var daysPassed = (now - lastDate) / (1000 * 60 * 60 * 24);
return daysPassed >= TCDSpopupInterval;
}
function updateLastPopupDate() {
var now = new Date();
localStorage.setItem('lastPopupDate', now.toISOString());
}
function checkSchedule() {
var now = new Date();
var currentHour = now.getHours();
var currentMinute = now.getMinutes();
var currentDay = now.getDay();
var currentTotalMinutes = currentHour * 60 + currentMinute;
var startTotalMinutes = TCDstartHour * 60 + TCDstartMinute;
var endTotalMinutes = TCDendHour * 60 + TCDendMinute;
var isInTimeRange = false;
if (startTotalMinutes < endTotalMinutes) {
isInTimeRange = currentTotalMinutes >= startTotalMinutes && currentTotalMinutes <= endTotalMinutes;
} else {
isInTimeRange = currentTotalMinutes >= startTotalMinutes || currentTotalMinutes <= endTotalMinutes;
}
var disableDate = new Date(tidisableDateTime.split(" ")[0].split('.').reverse().join('-') + 'T' + tidisableDateTime.split(" ")[1] + ':00');
var isAfterDisableDate = now >= disableDate;
if (tidisableAfterDate && isAfterDisableDate) {
hideBlocks();
TCDSblocksShown = false;
} else if (
(currentDay === 9 || currentDay === 9 || currentDay === 9 || currentDay === 9 || currentDay === 9 || currentDay === 9 || currentDay === 9) &&
isInTimeRange
) {
if (!TCDSblocksShown) {
showBlocks();
TCDSblocksShown = true;
if (canShowPopup()) {
var popupLink = document.createElement('a');
popupLink.id = 'zeropopup';
popupLink.href = '';
document.body.appendChild(popupLink);
setTimeout(function() {
if (popupLink.href && popupLink.href !== '' && popupLink.href !== window.location.href) {
popupLink.click();
updateLastPopupDate();
}
}, 5000);
}
}
} else if (TCDSblocksShown) {
hideBlocks();
TCDSblocksShown = false;
}
}
hideBlocks();
setInterval(checkSchedule, 30000);
checkSchedule();
});
</script>
КОПИРОВАТЬ КОД
Для нормальной работы модификации необходимо включить библиотеку jQuery. Как включить: Настройки сайта -> Еще -> Подключить jQuery на страницах сайта
1. Создаем Zero Block или стандартный блок, копируем ид блока и вставляем в генератор в поле "ID блока". Можно указывать несколько блоков через запятую и пробел. Например: #rec770454345, #rec770454346
2. Указываем время показа блоков в полях "показать блок с" и "Показать блок до". В этом временном промежутке будут показываться наши блоки;
3. Указываем дни в которые нужно показывать наш блок. Для этого отмечаем чекбоксы;
4. При необходимости указываем дополнительные настройки в генераторе: Скрыть блок навсегда после даты - если включено, то можно указать дополнительную дату и время после которой блоки будут скрыты навсегда; Показывать Popup по расписанию - если включено, то вместе с показом блоков можно будет показывать свое всплывающее окно. Это может быть любой стандартный блок popup или popup созданный на блоке T1093; Ссылка на popup - указываем ссылку на popup; Дней до повторного показа - указываем дни до повторного показа. Если нужно показывать при каждом заходе, то указываем 0; Задержка перед показом - указываем время перед показом popup. Минимальное значение 1 секунда.
5. Копируем готовый код и вставляем в HTML блок Т123. Блок T123 должен быть расположен ниже блоков которые скрываем.