/
Редагування зовнішнього вигляду LGT за допомогою CSS стилів

Редагування зовнішнього вигляду LGT за допомогою CSS стилів

 

RU

 

UA

US

RU

 

 

Якщо вам не вистачає вбудованих можливостей редактора для зміни зовнішнього вигляду вбудованих форм, віджетів і спливаючих вікон LGT на вашому сайті і вам потрібна повна інтеграція з дизайном вашого сайту, ви можете наслідувати кілька простих кроків:

  1. CSS стилі редагуються з налаштувань LGT у вкладці "Traffic" у вікні "Скрипт для тега HEAD".

  

  1. Для того, щоб змінити стилі, потрібно написати наступний код
    <style>
    // Місце для вставлення ваших стилів
    </style>

  1. Розглянемо ситуацію, в якій ми хочемо усунути тінь від форми, для кращої інтеграції в загальний дизайн вашого сайту: 

Приклад коду, який потрібно вставити в "Скрипт для тега HEAD", як прибрати тінь з LGT:

<style>
#leadgentool-card .adaptive-container {

    box-shadow: none !important;

}
</style>

Розшифрування коду:
#leadgentool-card - Унікальний ідентифікатор для нашої LGT не є класом.

adaptive-container - Клас LGT контейнера

box-shadow – Стиль визначальний тінь для компонента, його параметр none – відключає тінь. (Докладніше про стилі див. Довідку в кінці документа)
!important - Додається в кінці параметра, вказує на те, що цій установці надається пріоритет і що завжди буде використовуватися саме цей параметр. Не обов'язковий, але якщо при додаванні стилю стиль не застосовується, краще все-таки вказати.

 

 

Інші класи компонентів LGT:

.video - Клас для відео

 

.top-image - Клас для картинки

.text-block - Клас для тексту

.social-button - Клас соціальних кнопок

 

 

Основні стилі це:

background - зміна тла
color - зміна кольору тексту
box-shadow - додавання тіні
padding або margin - додавання відступів елемента

width - ширина елемента
height - висота елемента
font-size - розмір тексту

Основні параметри для стилів:

Колір в hex - #FF0000 або rbg - rgb(255,0,0)
Розміри в пікселях, наприклад 16px

Довідник за CSS (стилями): CSS Справочник и примеры элементы