Web5X - Готовые сайты

Блог о создании сайта, конструкторе сайтов и Elementor

аккордион виджет конструктор сайта

Аккордион — виджет Elementor

Наполняя свой сайт контентом мы всегда стараемся оформлять контент более удобным для чтения. Особенно часто это относится в такому виду содержимого как "Вопрос-Ответ", т.е есть некий вопрос, а на него есть ответ.  В классическом представлении (как раньше) это просто длинная текстовая информация на одной странице.

С развитием индустрии сайтостроения (создания и дизайн сайтов) в нашу жизнь вошли такие сайты как одностраничники, landing page, посадочные страницы и все перечисленные типы сайтов требуют компактного оформления  контента. Представьте, если бы на главной странице сайта мы отобразили список вопросов-ответов в виде простого текста. Все это было бы неудобно и выглядело бы не очень красиво.

Как же нам оформить данный контент? Давайте сгруппируем его в раскрывающие секции, т.е при нажатии на одну секцию, предыдущая закрывается, а текущая открывается.  И вот для такого поведения для этого придумано даже название "Аккордион", т.е раскрытие контента в виде движения частей музыкального инструмента Аккордин.

В конструкторе сайта для такого вида контента есть виджет "Аккордион", который и служит для раскрытия контента в виде аккордиона.

аккордион виджет конструктор сайта

На рисунке выше представлен стандартный вид виджета "Аккордион". У виджета всегда открыт первый элемент. В настройках можно выбрать html тег для заголовка и иконки открытого или закрытого состояния. Для стилевого оформления доступны на вклдки стили доступны все свойства для текста и границ. Рассмотрим подробнее ниже.

Содержимое

- Аккордеон

  • Элементы аккордеона - стандартный элемент настроек в котором можно изменить текст для заголовка и описания.
  • HTML-тег заголовка - изменения html тега для заголовка элемента виджета
  • Иконка - установка иконки для состояния по умолчанию, т.е для свернутого  (закрытого) состояния элемента.
  • Иконка активного - выбор иконки для активного состояния, т.е при открытом виде элемента аккордиона.

Стиль

- Аккордеон
в данной группе стилей возможно изменить стили для границ виджета, а именно ее толщину и цвет.

- Заголовок
Цвет, фон, цвет активного заголовка, ее типографику и отступы. Все это возможно изменить для заголовка элемента виджета.

- Иконка
Выравнивание иконки и ее цвет доступны в данной группе свойств. Так же доступно к изменению отступ текста от иконки, а так же цвет активного состояния иконки, т.е когда открыт аккордион.

- Содержимое
У содержимого меняются все стандартные свойства для текста, такие как цвет, типографика,  а также фон для всего содержимого и его внутренние отступы.

Список всех виджетов Elementor вы можете посмотреть на странице Виджеты

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Блог о создании сайта, конструкторе сайтов и Elementor.
Авторские права © 2017-2020 . Все права защищены.
Готовые сайты на web5x.ru
Политика конфиденциальности