Как сделать свою кнопку «Загрузить еще» в блоках магазина Тильда

При помощи данной модификации можно создать свою кастомную кнопку "Загрузить еще" при клике на которую будут подгружаться товары в блоках магазина. Работает с блоками ST300, ST305N, ST310N, ST315N, ST320N и ST300

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

Модификация работает только со стандартными блоками

Номер модификации в библиотеке TiCode

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

поделиться модификацией

Id блока магазина

Класс кнопки

войти

Войдите в аккаунт чтобы получить доступ к генератору кода

регистрация

оплатить

Этот генератор кода доступен только тем кто оплатил подписку

<style> #rec699637362 .t-store__load-more-btn-wrap { height: 0px !important; visibility: hidden; } .ti-loadbtn { cursor: pointer; } </style> <script> function TCDmorebtnshop() { $('#rec699637362 .js-store-load-more-btn').click(); setTimeout(function(){ if ($('#rec699637362 .js-store-load-more-btn').css('display') === 'none') { $('.ti-loadbtn').closest('.r').hide(); } }, 500); } $('.ti-loadbtn').click(TCDmorebtnshop); </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. Создаем блок магазина (ST300, ST305N, ST310N, ST315N, ST320N или ST300), копируем id блока и вставляем в генератор кода. Товары загружаем в каталог тильда (при загрузке товаров в блок работать не будет);

2. Создаем Zero Block в котором создаем кнопку (можно также использовать текст, шейп или картинку) и присваиваем ей класс ti-loadbtn
Чтобы добавить класс, нажимаем на элемент правой кнопкой мыши и выбираем из списка "Add CSS Class Name" и далее, справа в настройках указываем класс

3. Копируем готовый код и вставляем в HTML блок Т123.

Загрузить еще товары