База знаний

Как установить нужный шрифт в блоке корзины на Тильде без изменения настроек сайта

Как установить нужный шрифт в блоке корзины на Тильде без изменения настроек сайта

В данном случае мы говорим про блок Тильды SТ100. В настройках блока есть возможность меня шрифты внутри корзины.
Но в этом случае шрифты меняются только в заголовках. На скрине ниже вы видите, что нужный нам шрифт отображается в заголовках "Выберите категорию обучения", "Выберите курс" и т.д. Нам же нужно, чтобы нужный шрифт отобразился и везде, в том числе внутри полей ввода данных.
В данном случае есть 2 способа решения данной проблемы:

✅ Способ 1: через настройки Tilda

  1. Перейдите в Настройки сайта → Шрифты и выбери нужный шрифт (например, Inter Tight).
  2. Применится ко всем текстовым элементам по умолчанию, в том числе к корзине, если не переопределён.
То есть при использовании данного варианта, у вас могут слететь шрифты в других текстовых элементах на сайте. Исправление этой ситуации, потребует от вас лишнего времени и нервов.

✅ Способ 2: через пользовательский CSS

  1. Откройте Настройки страницы → Доп. CSS и HTML (или вставьте в Zero Block через HTML-блок).
  2. Вставьте CSS для изменения шрифта в корзине:
То есть в данном случае вы решаете проблему точечно, изменяя шрифт в конкретном блоке корзины. Добавьте в редактор блок Т123 и добавьте туда следующий HTML-код.
<script>
document.addEventListener('DOMContentLoaded', function() {
var style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = `
/* Изменение шрифта для всех элементов в блоке корзины */
.uc-place {
font-family: 'Inter Tight', sans-serif !important;
font-size: 16px !important;
}

/* Изменение шрифта для заголовков */
.uc-place h2, .uc-place h3, .uc-place h4, .uc-place h5, .uc-place h6 {
font-family: 'Inter Tight', sans-serif !important;
font-size: 20px !important;
}

/* Изменение шрифта для кнопок */
.uc-place button {
font-family: 'Inter Tight', sans-serif !important;
font-size: 18px !important;
}
`;
document.head.appendChild(style);
});
</script>
После этого в корзине весь шрифт должен измениться на нужный, при этом не затронув другие текстовые элементы на Тильде.

2025-05-05 18:30 Тильда