Как добавить кнопку в стандартный блок на Тильде
Как это работает
Инструкция
1. В настройках сайта проверьте, чтобы не был задан цвет кнопок. Если ранее задавали — удалите и оставьте пустую строчку.
2. В макете сайта добавьте стандартный блок и присвойте ему класс .uc-btn
3. В текстовом блоке пропишите текст кнопки и присвойте ему ссылку
Важно! Не задавайте цвет ссылке, оставьте поле незаполненным
4. Добавьте блок Т123 и вставьте код
Код для вставки в блок Т123
<style>
.uc-btn a {
font-size: 14px; /*высота шрифта */
border: 1px solid #929BFF; /*обводка: толщина,сплошная,цвет)*/
padding: 7px 30px; /*расстояние внутри кнопки от текста до края кнопки: сверху-снизу, слева-справа*/
border-radius: 50px; /*радиус кнопки*/
background-color: #DCDFFF; /*цвет фона*/
}
.uc-btn a:hover {
background-color: #929BFF; /*цвет фона при наведении на кнопку*/
border: 1px solid #929BFF; /*обводка при наведении на кнопку: толщина, сплошная, цвет*/
}
#allrecords a, .uc-btn .t-records a {
color: #424780; /*цвет текста кнопки*/
}
#allrecords a:hover, .t-records a:hover {
color: #ffffff; /*цвет текста кнопки при наведении на кнопку*/
}
@media (max-width: 640px) { /*если нужно, чтобы кнопка имела другие параметры в мобильной версии*/
.uc-btn a {
font-size: 12px; /*высота шрифта*/
padding: 5px 10px; /*расстояние внутри кнопки от текста до края кнопки: сверху-снизу, слева-справа*/
}
}
</style>
5. Отредактируйте код и задайте нужные параметры согласно подсказкам в коде.
И все готово! Опубликуйте страницу
Если было полезно — ставь лайк и сохраняй
Еще больше полезного контента в моем телеграм канале
Полезно!