Красивые чекбоксы для форм Elementor PRO

Шаг 1. Создайте форму с помощью Elementor PRO. Шаг 2. Добавьте поле Acceptance. Сделайте его обязательным, если нужно. Добавьте текст. Шаг 3. Добавьте пользовательский CSS код в настройках страницы. В коде в классе .elementor-field-type-acceptance input:checked:before в свойстве background-image вставьте ссылку на картинку «галочки» со своего…

Красивые чекбоксы для форм Elementor PRO

Шаг 1.

Создайте форму с помощью Elementor PRO.

Красивые чекбоксы для форм Elementor PRO

Шаг 2.

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

Красивые чекбоксы для форм Elementor PRO

Шаг 3.

Добавьте пользовательский CSS код в настройках страницы.

В коде в классе .elementor-field-type-acceptance input:checked:before в свойстве background-image вставьте ссылку на картинку «галочки» со своего сайта.

Отредактируйте CSS код на своё усмотрение.

.elementor-field-option {
    display: flex;
    column-gap: 10px;
}
.elementor-field-type-acceptance input {
    width: 17px;
    height: 0px;
    margin-right: 6px;
}
.elementor-field-type-acceptance input:before {
    content: "";
    width: 17px;
    height: 17px;
    border: 1px solid #929292;
    border-radius: 3px;
    position: absolute;
    top: 7px;
    left: auto;
    background: #ffffff;
}
.elementor-field-type-acceptance input:checked:before {
    background-image: url(https://vladimir-kozlov.ru/wp-content/uploads/2025/02/check.svg) !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}
Нужен сайт для бизнеса?

Обсудим задачу
и найдём решение

Бесплатно оценю объём работ, предложу структуру и отвечу на вопросы.

Обсудить проект ↗

Готовы обсудить
ваш проект?

Напишите мне — обсудим задачу, сроки и бюджет. Первая консультация бесплатна.

Бесплатно оценю задачу и предложу структуру сайта · Отвечу в течение 30 минут