0 0,00 

Есть вопрос? Звоните!

+7 923 192-46-05

Своя кнопка в виджете геткурса

23.03.2023
1496
Своя кнопка в виджете геткурс

Кнопки в виджете геткурса, как и в Тильде,  ограничены в модификации. Как же подставить “дизайнерскую” кнопку в форму?

Содержание

Создание виджета Getcourse

Виджеты

Для создания перейдите Сайт —> Виджеты.

Нажмите кнопку Создать виджет.

Создать виджет

Введите название и нажмите Создать.

Создать виджет

Выберите Форму.

На экране появляется стандартная форма.

Для редактирования кнопки нажмите на шестеренку.

Настройка кнопки

Уберите название и сохраните.

Настройка кнопки

Редактирование стилей

Для дальнейшего редактирования перейдите в Стиль.

Форма

Далее Подробные настройки.

Форма. Стиль

Добавляем стиль с помощью кода:

				
					.btn.f-btn.button-md {
    background-image: url('https://адрес-картинки.svg');
    background-color: transparent;
    background-size: contain;
    width: 380px;
    height: 81px;
  }
				
			

где

background-image: url(”) — адрес изображения для кнопки;

background-color: transparent — свойство background-color устанавливает цвет фона элемента, а transparent  означает, что фонового цвета нет.

background-size: contain — свойство background-size задаёт размер фонового изображения, а  contain масштабирует картинку так, чтобы она максимально накрыла собой весь блок. Изображение при этом не обрезается, а вписывается в блок с сохранением пропорций.

width: 380px — ширина, я задала параметр своей картинки, у вас он может быть другой;
height: 81px — высота, аналогично с шириной;

Далее можно приступать к редактированию полей.

Читайте также

5 2 голоса
Рейтинг статьи
Подписаться
Уведомить о
guest
0 комментариев
Межтекстовые Отзывы
Посмотреть все комментарии
Авторизация
*
*
Регистрация
*
*
*
Пароль не введен
Генерация пароля
0
Оставьте комментарий! Напишите, что думаете по поводу статьи.x
0
    0
    Корзина
    Корзина пустаВернуться в магазин