WP Table Manager : таблицы стилей

1. Формат

На панели инструментов вы можете установить стиль для ячейки, например: шрифт, размер шрифта, стиль текста, цвет фона для ячейки, цвет текста, горизонтальное и вертикальное выравнивание ячейки... Его можно применять для одной ячейки или нескольких ячеек.

Вы можете выбрать процент для редактора таблицы. Это означает, что вы можете увеличивать/уменьшать масштаб таблицы в диапазоне от 50% до 200%.

Высота строки и ширина столбца могут быть определены в пикселях. Выберите Формат меню» > «Применить размер столбца/строки » и выберите «Изменить размер столбца/изменить размер строки» . Во всплывающем окне вы можете выбрать диапазон и установить px для столбцов или строк. Нажмите кнопку Готово », чтобы закончить.

2. Темы и опции

В каждой таблице вы можете найти опцию выбора темы меню «Тема». Просто нажмите на тему, чтобы применить ее.

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

Альтернативные цвета

В той же теме меню > Альтернативные цвета функция «Автоматическое оформление» позволяет раскрасить строку в таблице с помощью верхнего и нижнего колонтитула . Вы можете выбрать стили шаблона или создать свои собственные в настройках плагина.

Альтернативный цвет можно удалить, щелкнув «Удалить > Удалить автоматический стиль» в контекстном меню. После вашего подтверждения цвет будет очищен.

Выравнивание таблицы

Выравнивание таблицы связано с выравниванием div, содержащего всю таблицу, например, по центру всей таблицы. Вы можете найти в Формат меню > Выравнивание таблицы .

Подсветка ячеек

Подсветка ячейки также доступна в качестве опции. Вы можете включить эту функцию в настройках. По умолчанию он отключен. Вы можете выбрать строку выделения, чтобы настроить цвет и непрозрачность выделения.

В каждой ячейке таблицы вы можете увидеть опцию «Добавить всплывающую подсказку», щелкнув ее правой кнопкой мыши.

Вы можете установить ширину подсказки в пикселях. Вы увидите всплывающую подсказку с редактором для редактирования.

Добавьте контент и сохраните, все готово, всплывающая подсказка будет отображаться на общедоступной стороне при наведении курсора мыши.

4. Замораживание строк и столбцов

Колонка замораживания

Заморозка колонки доступна в меню « Формат» > «Параметры адаптивности» . Вы можете заморозить до 5 столбцов. Счет ведется с первого столбца.

Чтобы заморозить столбец/строку, существует дополнительная опция, позволяющая зафиксировать высоту таблицы (поскольку контейнер таблицы может иметь бесконечную высоту).

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

Замораживание строк

Вы можете найти его в «Формат меню» > «Заголовок таблицы» , отсюда вы можете включить опцию и установить закрепление строк (до 5 строк).

Если вы хотите установить высоту таблицы, вернитесь к параметрам адаптивности.

Тогда первая строка будет заморожена во внешнем интерфейсе в соответствии с настройками.

5. Сортировка и фильтры

Если вы хотите отсортировать или отфильтровать таблицу, выберите «Формат меню» > «Сортировка и фильтры» .

Затем появится всплывающее окно с опциями сортировки и фильтрации.

Если вы хотите отсортировать таблицу, просто включите сортировки во внешнем интерфейсе . Вы можете выбрать столбец для сортировки по умолчанию и его направление.

Например, в этом случае выберите столбец A с ASC .

Есть 2 варианта фильтра:

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

Форма расширенного фильтра: после выбора опции вы можете искать и фильтровать данные в таблице.

Основной поиск: когда вы включаете эту функцию, во внешнем интерфейсе добавляется поле ввода поиска. Это позволяет пользователям легко выполнять поиск по всем данным в таблице.

6. Заполнение ячеек и радиус границы

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

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

7. Пользовательский CSS

Давайте сделаем еще один шаг вперед. Если вы веб-дизайнер с навыками работы с CSS, вы сможете добавить CSS в меню «Формат меню» > «Пользовательский CSS».

Код CSS раскрашен с помощью зеркала кода и может быть написан с использованием меньшего количества CSS, это тоже работает!

Ячейки, строки и столбцы имеют координаты, позволяющие идентифицировать каждую из них и применять к ним собственный CSS. R — строка, C — столбец.

8. Адаптивные таблицы WordPress.

Являются ли мои таблицы адаптивными или используют прокрутку на небольших устройствах?

Сокрытие Колов

WP Table Manager обеспечивает адаптивный дизайн с помощью инструмента приоритета в качестве опции. По умолчанию адаптивная функция отключена, произойдет переполнение (хотя ведьма отлично работает на мобильных устройствах). Чтобы использовать «Скрытие столбцов» , перейдите в «Формат меню» > «Параметры адаптивности».

Расширенный адаптивный режим: вы можете определить приоритет скрытия столбцов для мобильных устройств.
Когда столбцы скрыты, отображается мобильное меню с флажком для принудительного отображения/скрытия столбцов. Размер столбца фиксируется при редактировании таблицы. Если размер всех столбцов слишком велик для контейнера, произойдет переполнение, и вы сможете легко прокручивать данные на мобильных устройствах.

Таблица со свитком (лучше при небольшом количестве столбцов)

Таблица со скрытым столбцом (лучше для большого количества столбцов)

Повторяющийся заголовок

Это еще один вариант, если вы хотите вставить таблицу в небольшую область вашего сайта. Вам следует перейти в «Формат меню» > «Параметры адаптивности». Затем выберите «Адаптивный тип» > «Повторяющийся заголовок».

Будут варианты для настройки по вашему запросу:

Адаптивная точка останова (px): выберите значение точки останова в пикселях, чтобы определить, когда таблица переключится в этот адаптивный режим.
Адаптивная максимальная высота (пикселей): при активации адаптивного режима в зависимости от значения точки останова определите максимальную высоту, чтобы избежать очень длинной таблицы.
Стиль адаптивного режима: примените стиль по умолчанию для этого адаптивного режима или используйте цвета таблицы.

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

Если вы используете повторяющийся заголовок и «Фильтр» включен, вы можете отфильтровать, набрав текстовое поле в мобильном представлении.

9. Экспорт в Excel

Чтобы сохранить таблицу на своем компьютере, вам следует перейти в меню « Таблица» и нажать кнопку «Экспортировать в Excel» . Тогда тип файла будет *.xlsx после экспорта во внешний интерфейс.

10. Пагинация

Эту функцию можно найти в меню «Формат меню» > «Разбиение на страницы» в каждой редакции таблицы. Используйте кнопку переключения, чтобы включить и выбрать количество строк, отображаемых на странице.

11. Оформление границ ячеек

Вы можете применить типы границ для своей таблицы, такие как ширина границы, цвет границы, стиль границы. Сначала выделите диапазон ячеек, затем щелкните значок на панели инструментов.

12. Таблица печати на интерфейсе

Иногда вам нужно распечатать таблицу. Поэтому, чтобы отобразить кнопку «Печать» на веб-интерфейсе, сначала вам следует перейти к таблице меню и поставить галочку на кнопке «Печать».