Pro
Setup
Info
Info
Включено в подписку
Настройки
[
Написать в поддержку
Telegram: @sonneto_support
Кастомизация
]
Setup
Info
Info
<style>
.sonneto-cart-wrapper {
text-align: center;
margin-bottom: 20px;
}

.sonneto-catalog-button {
display: inline-block;
padding: 10px 20px;
background: #F4F4F5; /* цвет фона кнопки каталога */
color: #09090b !important; /* цвет текста кнопки каталога */
border-radius: 10px; /* радиус углов закругления кнопки */
text-decoration: none !important;
border: 1px solid #E4E4E7; /* цвет обводки кнопки */
font-size: inherit;
font-family: inherit;
transition: background 0.3s;
margin-top: 10px;
display: none; /* кнопка скрыта */
}

.sonneto-catalog-button:hover {
background: ;
color: !important;
border-color: ;
/* толщина обводки задаётся выше: border: 1px solid ... */
}
</style>

<script>
document.addEventListener('DOMContentLoaded', function () {
const SNCartShop = new MutationObserver(() => {
const SNNewtext = document.querySelector('.t706__cartpage-products_empty');
if (SNNewtext && !SNNewtext.classList.contains('sonneto-cart-applied')) {
SNNewtext.innerHTML = '<div class="sonneto-cart-wrapper t-name tn-name_xs">Вы не добавили товар в корзину! <!-- ТЕКСТ В ПУСТОЙ КОРЗИНЕ --><a href="#" class="sonneto-catalog-button">Перейти к покупкам</a><!-- ТЕКСТ КНОПКИ КАТАЛОГА --></div>';
SNNewtext.classList.add('sonneto-cart-applied');
}
});
SNCartShop.observe(document.body, { childList: true, subtree: true });
});
</script>

<script>
(function SNupdType() {
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>
Настройки модификации

  • Добавляем корзину ST100

  • Далее добавляем блок T123 и вставляем в него подготовленный код.

Теги

Модификация

#

CSS

#

Кнопки

#

Интернет-магазин

#

  • В коде прописываем все необходимые значения (текст, цвет фона кнопки каталога если хотите добавить)

Модификатор заменяет стандартный текст пустой корзины на свой.

Текст в пустой корзине

не доступно
id:
Скопировано!
Скопировать код
Подключение скриптов
Базовые настройки
  • Модификатор заменяет стандартный текст пустой корзины на свой через JS, поэтому HTML родительского блока пустой корзины не должен содержать вложенных элементов, которые могут конфликтовать с вставкой модифицированного блока.

  • Текст и кнопка (если включена) добавляются автоматически при загрузке страницы.

  • Цвета, фон, радиус и обводку кнопки можно менять в CSS-классах .sonneto-catalog-button и .sonneto-cart-wrapper.

  • Модификатор корректно работает на страницах с классом .t706__cartpage-products_empty.

  • Для правильного отображения важно, чтобы родительский блок имел достаточную ширину и padding для размещения текста и кнопки.
Технические советы
  • Если включена кнопка каталога, её можно скрывать через display: none или отображать через display: block.

  • Для изменения текста пустой корзины или текста кнопки достаточно редактировать innerHTML в скрипте.

  • Если текст длинный, проверяйте корректность переноса строк, чтобы кнопка не «съезжала».

  • Для работы модификатора необходим JS (MutationObserver), поэтому страницы без JS не покажут изменённый текст.

  • При большом количестве подобных модификаторов на странице может быть небольшая нагрузка на рендеринг → оптимально использовать на ключевых блоках.

  • Для адаптивного отображения на мобильных устройствах проверьте, чтобы родительский блок позволял кнопке и тексту корректно переноситься.

Для корректной работы модификации необходимо, чтобы на странице была подключена библиотека jQuery, так как скрипт использует $(document).ready() и .each().

Информация о кастомизации кода доступна только в веб-версии сайта.

Сделать это можно в разделе: Настройки сайта - Ещё - Подключить jQuery на страницах сайта.
В Zero Block скрипты рекомендуется вставлять только после полной загрузки контента страницы, чтобы все элементы блока были доступны для обработки.
Текст скопирован в буфер обмена!
Текст скопирован в буфер обмена!