Elementor Table

Виджет Таблица позволяет создавать и выводить удивительные структурированные данные в табличном виде.

Купить от 3.90$

Создавайте Таблицы в Elementor в пару кликов!

Сортировка

Пользователи могут сортировать любые данные в таблице.

Просто включите эту опцию в настройках.

Сортировать можно по алфавиту, а также по возрастанию или уменьшению значений.

Добавляйте иконки и изображения

Размещайте иконки в верхней, нижней частях таблицы, а также в контексте таблицы.

Каждой иконке можно задать свой цвет, впрочем как любому отдельному полю в таблице.

Диапазон строк и столбцов в таблице

Объединение строк и столбцов в таблице может вызвать затруднения при написании кода. Но это легко сделать с виджетом ElemBlock Table.

А также, полный контроль над каждым элементом в таблице:

каждой иконке свой цвет
отдельному полю свой фон и цвет
регулируйте ширину столбцов

Десятки различных настроек для таблицы

Ссылки в ячейках

Любому элементу в таблице можно назначить ссылку. Таким образом, благодаря добавления фона, можно создать элемент-кнопку

Поиск по таблице

Для больших таблиц активируйте поиск по таблице. При вводе слов в поле поиска, данные будут автоматически фильтроваться.

Полная адаптивность

Можно активировать настройку и на мобильном телефоне можно прокручивать по горизонтали контент. Предварительно можно задать ширину для мобильных.

Как создать таблицу в Elementor

Итак перед нами стоит задача создать таблицу в elementor.

Давайте начнем. Как известно , при редактировании страницы в elementor в левой части экрана нам доступна панель управления елементор. Находим там виджет «Таблица» от нашего плагина Elemblock и перетягивает виджет в необходимое нам место.

Как мы видим таблица уже частично заполена. Это сделано для того, что вы имели уже какое-либо представление как она работает.

В настройках таблицы (раздел «Содержимое») есть основные подразделы:

заголовок таблицы
тело таблицы
настройки

Давайте разберем все подробнее.

Заголовок таблицы в Elementor

Заголовок таблицы в elementor представляет собой так называемую шапку таблицы. Обычно её каким-либо образом выделяют для удобства восприятия самой таблицы в целом:

фоном
цветом текста
жирностью
размером текста

Итак, в разделе мы имеем 3 элемента. Количество элементов не ограниченно и вы можете их добавлять, нажав кнопку «Добавить элемент».

Элементы имеют свои собственные вкладки с настройками:

контент
расширенные
стиль

Разберем настройку элемента таблицы в elementor.

Вкладка контент.

В поле шапка, мы указываем непосредственно заголовок столбца таблицы elementor.

Под ним есть поле «Описание». Тут мы можем добавить описание заголовку, чтобы более подробнее объяснить о сути заголовка.

Мы можем также разместить иконку или изображение радом с заголовком. Причем можно указать, до или после него.

Вкладка расширенные.

Мы можем указать охват колонки. Т.е. сколько колонок будет охватывать этот заголовок.

Также можно указать произвольную ширину столбца в таблице elementor.

Вкладка стиль.

На вкладке стиль, мы можем стилизовать конкретный заголовок. Придать цвет тексту, цвет фону, а также цвет иконки, если мы её добавили.

На этом настройка заголовков в шапке таблицы элементор закончена и мы можем переходить к «телу» таблицы.