Если вам часто приходится использовать HTML таблицы в статьях, то наверняка сталкивались с проблематичностью, так как это трудоемкий процесс. Не говоря уже о тех пользователей, которые только начали знакомиться с языком разметки и каскадной таблицей. Поскольку предстоит иметь дело с исходным кодом, что весьма неудобно в плане заполнения и стилизации, а в будущем редактирования. Даже если создавать таблицу отдельно в каком-то редакторе, а после вставлять в статью, едва ли это можно назвать лучшим решение.
Не проще ли воспользоваться специальным инструментом, речь идет о плагине TablePress, который максимально упростит работу с таблицами. В нем предусмотрены все детали, а главное, не придется возиться с кодом, так как все технические моменты устроены визуальным образом. То есть вам практически нужно будет лишь указать необходимое количество столбцов, и количество рядов. А дальше предстоит обычное заполнение таблицы нужной информацией, картинками и прочим контентом.
Некоторые особенности плагина TablePress:
- Легкое управление таблицами
- Вставка через шорткод
- Любое содержимое: изображения, ссылки, HTML код
- Заголовок первых строк
- Ховер эффект при наведении на строку
- Импорт таблиц
- Сортировка и фильтрация строк
- Прочее
- Посмотреть демо
Пример создания таблицы и обзор настроек плагина TablePress
Как установите плагин и активируете его в панели слева появится новая вкладка TablePress с шестью разделами. Больше всех нас интересует раздел Add New Table, а остальные идут уже как второстепенные, но отнюдь не маловажные. В первом шаге этого раздела нужно дать название таблицы, описание (необязательно), указать количество столбцов и рядов.
После чего жмем кнопку Add Table и на открывающей страницы уже приступаем к заполнению таблицы нужной информацией.
Информация о таблице
В первом разделе параметров содержится уникальный шорткод, используется для вставки таблицы в статьи, а также личное название и описание.
Контент таблицы
Здесь заполняете таблицу необходимой информацией.
Управление таблицей
Первые три кнопки отвечают за дополнительный контент, вставка ссылки, изображения и расширенный редактор. Чтобы их использовать нужно нажать на одну из кнопок, подтвердить действие, а затем кликнуть в ячейку таблицы где вы хотели добавить ссылки или еще что-то. Combine cells отвечает за соединение как столбцов, так и рядов. Параметр Selected позволяет скрывать часть таблицы, дублировать, удалять. В последнем пункте Add можно добавить еще столбцов, колонок к существующей таблице.
Параметры таблицы
Две первые строки включают заголовок ячеек. Параметр Colors стилизует через один ряд цвет фона, как это принято в таблицах. Hover Highlighting активирует подсветку при наведении мыши на ряд, а следующих два пункта выводят название и описание таблицы.
Функции
В последнем раздели параметром сможете активировать кое-какие дополнительные возможности, а именно:
Use DataTables: Вкл/Выкл все функции
Sorting: Включить сортировку
Search/Filtering: Включить поиск по таблице
Pagination: Навигации, если таблица не помещается в указанное значение показа строк
Pagination Length Change: Разрешать посетителям изменять количество показа строк
Info: Разрешать показывать информацию о таблице
Horizontal Scrolling: Включить горизонтальную прокрутку
И напоследок, рядом с кнопкой Save Changes, есть кнопка для предварительного просмотра.
А как сделать, чтоб каждая ячейка была разного цвета?
Насколько я помню, то только вверх, низ и чередовка строк устанавливается цвет.