TechBlogSD - Все для WordPress и WEB разработки
WEB и WordPress инструкции, новости, обзоры тем и плагинов

Руководство по плагину TablePress для пользователей WordPress

784

В нашей предыдущей статье мы видели, как добавлять таблицы на сайт WordPress разными способами. Редактор блоков Гутенберга имеет встроенный табличный блок, поэтому использование дополнительного плагина устарело. Однако TablePress – один из плагинов, позволяющих пользователям легко добавлять привлекательные таблицы на сайт WordPress. В этой статье давайте рассмотрим возможности и способы использования плагина TablePress.

Изучите WordPress: просмотрите более 400 бесплатных руководств по WordPress.

Почему плагин TablePress?

Перейдите к опции «Плагины> Добавить» на панели администратора WordPress и выполните поиск по ключевому слову «Таблица». Вы найдете тысячи плагинов для создания различных типов таблиц, а поиск «tablepress» покажет плагин TablePress на первой странице.

Руководство по плагину TablePress для пользователей WordPress

Плагин WordPress TablePress

  • Это полностью бесплатный плагин, созданный автором Тобиасом Бетге. Хотя расширения предлагаются как отдельные премиум-плагины, на панели инструментов нет навязчивых баннеров или ссылок с просьбой выполнить обновление.
  • 800K + активных установок с рейтингом 5 звезд от пользователей почти 4K не могут быть неправильным суждением.
  • Достойная документация и очень хорошая поддержка на форуме.
  • Создавайте унифицированные таблицы на сайте, а также настраивайте внешний вид любой конкретной таблицы с помощью настраиваемого CSS.

Особенности плагина TablePress

Плагин имеет следующие функции, которых достаточно для создания таблиц для большинства общих целей:

  • Таблицы могут быть созданы и встроены на любые страницы вашего сайта в виде шорткода.
  • Импортируйте таблицы из Microsoft Excel в форматах XLS, XLSX и CSV. Также возможен импорт путем копирования вручную и из формата JSON / HTML.
  • Таблицы можно экспортировать в форматы CSV, JSON и HTML.
  • Прямая вставка шорткода таблицы в визуальный редактор.
  • Отдельные таблицы можно настроить с помощью настраиваемого CSS.
  • Можно легко создавать сложные таблицы данных с полем поиска, разбивкой на страницы и фильтрацией.

Как использовать плагин TablePress?

Установите и активируйте плагин, чтобы увидеть меню администратора, созданное, как показано ниже:

Руководство по плагину TablePress для пользователей WordPress

Параметры меню плагина TablePress

Положение меню TablePress можно изменить в разделе «Параметры плагина».

Плагин состоит из следующих разделов:

  • Все таблицы – показывает список всех созданных таблиц.
  • Добавить новую – позволяет создать новую таблицу.
  • Импорт – предлагает различные варианты импорта одной или нескольких таблиц.
  • Экспорт – предлагает различные варианты экспорта одной или нескольких таблиц.
  • Параметр плагина – в этом разделе можно настроить отдельные таблицы с помощью CSS.
  • О программе – показывает подробную информацию о плагине и другие подробности.

Руководство по плагину TablePress для пользователей WordPress

Параметры плагина WordPress TablePress

Создание таблицы в TablePress

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

Руководство по плагину TablePress для пользователей WordPress

Добавить новую таблицу в TablePress

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

Предложение SEO: оптимизируйте свой сайт с помощью специальной 14-дневной бесплатной пробной версии Semrush Pro.

Раздел информации о таблице

Здесь вы можете просмотреть основные сведения, которые вы ввели на экране создания, а также шорткод для своей таблицы.

Руководство по плагину TablePress для пользователей WordPress

Раздел информации о таблице

Содержимое таблицы

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

Руководство по плагину TablePress для пользователей WordPress

Раздел содержимого таблицы

Управление таблицей

Этот раздел предлагает следующие возможности:

  • Добавьте в таблицу строки и столбцы.
  • Скрывать, отображать, удалять, дублировать и вставлять строки и столбцы.

Руководство по плагину TablePress для пользователей WordPress

Раздел управления таблицей

  • Нажмите кнопку «Вставить ссылку» и выберите ячейку таблицы, чтобы открыть всплывающее окно для вставки ссылки WordPress по умолчанию. Вы также можете напрямую добавлять ссылки с помощью тегов привязки HTML.
  • Как и в случае со ссылками, нажмите «Вставить изображение» и щелкните ячейку, чтобы вставить изображения из медиатеки WordPress. Вы также можете напрямую добавлять изображения с помощью тега HTML img.
  • Расширенный редактор позволяет добавлять форматированный контент с помощью простого редактора.

Руководство по плагину TablePress для пользователей WordPress

Расширенный редактор TablePress

  • Используйте параметры rowspan и colspan, чтобы объединить ячейку в строке и столбцы.

Атрибуты Rowspan и Colspan нельзя использовать в таблицах расширенных данных с использованием библиотеки JavaScript для сортировки.

Параметры стола

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

Руководство по плагину TablePress для пользователей WordPress

TablePress параметры стола

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

Особенности библиотеки JavaScript DataTables

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

Руководство по плагину TablePress для пользователей WordPress

Создание таблиц данных с помощью TablePress

  • Сортировка по любому столбцу, просто щелкнув по столбцу.
  • Поиск / Фильтрация – позволяет отображать окно поиска в правом верхнем углу таблицы, и пользователи могут фильтровать результаты, вводя ключевое слово. Это очень полезная функция, особенно когда у вас много строк, а содержимое не отображается из-за разбивки на страницы.
  • Разбиение на страницы – включите разбиение на страницы, чтобы отображать только определенные строки со ссылками «предыдущая / следующая» в правом нижнем углу таблицы. Вы также можете разрешить пользователю фильтровать и просматривать определенное количество строк.
  • Включите горизонтальную прокрутку, если у вас много столбцов в таблице, и добавьте пользовательские команды, если вы знаете, как использовать расширенные таблицы данных.

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

Вставка таблицы в сообщение или страницу

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

Просмотр всех таблиц

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

Руководство по плагину TablePress для пользователей WordPress

Параметры на вкладке "Все таблицы"

Импорт таблиц

Хотя создание таблицы на экране легко, для больших таблиц это будет утомительной задачей. В таких сценариях вы можете создавать таблицы, используя электронную таблицу Excel в формате XLS, XLSX или CSV, и импортировать их на свой сайт WordPress на вкладке «Импорт» плагина TablePress. Перейдите на вкладку «Импорт», чтобы увидеть следующие параметры:

Руководство по плагину TablePress для пользователей WordPress

Параметры импорта таблиц в TablePress

  • Источником импорта может быть файл на локальном компьютере, URL-адрес, файл на сервере или ввод вручную.
  • В зависимости от источника загрузите файл со своего локального компьютера или укажите необходимые данные.
  • Выберите формат файла, если вы используете XLSX, выберите вариант «XLSX -» в раскрывающемся списке. Хотя XLSX все еще находится в стадии бета-тестирования, он отлично работает, как мы тестировали.
  • Выберите, следует ли создать новую таблицу или изменить или добавить существующую таблицу. При выборе вариантов замены и добавления отобразится раскрывающийся список всех существующих таблиц, из которого вы можете выбрать таблицу.
  • Нажмите кнопку «Импорт», чтобы начать импорт таблицы.

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

Экспорт таблиц

Как и при импорте, все существующие таблицы можно экспортировать в формат CSV, JSON или HTML на ваш локальный компьютер. Также плагин позволяет выбирать несколько таблиц и экспортировать их в виде zip-файла.

Руководство по плагину TablePress для пользователей WordPress

Экспорт таблиц в TablePress

Форматы CSV и HTML экспортируют только содержимое таблицы, а формат JSON также включает параметры таблицы.

Настройка таблиц в TablePress

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

Руководство по плагину TablePress для пользователей WordPress

Добавление пользовательского CSS в TablePress

Ниже приведены селекторы для определения вашего стиля:

  • .tablepress – все таблицы TablePress должны иметь этот класс.
  • .tablepress-id – используется для стилизации конкретной таблицы.
  • .column-id – используется для стилизации столбца таблицы.
  • .row-id – используется для стилизации строки таблицы.

Ниже приведен пример таблицы, созданной с помощью TablePress, предположим, что идентификатор равен 3, а некоторые стили настройки даны на основе этого примера:

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

Измените ширину второго столбца на 200 пикселей:

.tablepress-id-3 .column-2 { width: 200px; }

Измените цвет фона строки 2 на красный:

.tablepress-id-3 .row-2 td { Background-color: red; }

Измените цвет альтернативных строк:

.tablepress-id-3 .odd td { background-color: red; } .tablepress-id-3 .even td { background-color: blue; }

Изменить цвет строки при наведении:

.tablepress-id-3 .row-hover tr:hover td { background-color lightgrey; }

Общие вопросы

При использовании TablePress мы заметили несколько основных проблем:

  • Отзывчивость таблиц на мобильных устройствах, которую можно решить, установив расширение плагина.
  • Вставка таблиц в нижний колонтитул или боковую панель сайта – это можно решить, используя теги шаблона с «$ query» в виде строки или массива. Например, ниже приведен пример получения табличных данных для таблицы с идентификатором = 1:
<?php tablepress_print_table( array( 'id' => '1', 'use_datatables' => true, 'print_name' => false) ); ?>

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

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

Расширения TablePress

Хотя основные потребности могут быть удовлетворены с помощью бесплатной версии плагина, вы можете загрузить дополнительные расширения со страницы расширений TablePress для улучшения функций таблиц. Опять же, в качестве вклада в сообщество автор предлагает все расширения бесплатно и называет лишь несколько расширений премиум-класса с просьбой о пожертвовании. Из всех расширений мы обнаружили, что «Адаптивные таблицы» – это то, что вам может понадобиться, чтобы сделать таблицу доступной для просмотра на мобильных устройствах. Каждое расширение можно загрузить и установить, загрузив zip-файл через панель администратора WordPress в разделе «Плагины> Добавить новый> Загрузить плагин». Вы также можете использовать FTP для загрузки извлеченной папки плагина в «/ wp-content / plugins /».

Ниже приведен пример таблицы, созданной в стиле флип с использованием расширения адаптивных таблиц.

Руководство по плагину TablePress для пользователей WordPress

Отзывчивый флип-стол

TablePress SEO

Наиболее важным аспектом создания таблиц с помощью плагина TablePress является SEO – таблицы более удобны для поисковых систем, особенно в Google. Ниже приведен пример результата поиска Google, показывающий содержание таблицы более привлекательным образом с общим количеством элементов:

Руководство по плагину TablePress для пользователей WordPress

Таблица TablePress в результатах поиска Google

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

Резюме

TablePress – это бесплатный плагин WordPress для создания таблиц для вашего сайта. Вы можете вставить таблицы в любом месте сайта, используя шорткод. Можно сделать таблицы адаптивными с помощью надстроек.

Плюсы

  • Бесплатные и регулярные обновления
  • Простой пользовательский интерфейс
  • Таблицы расширенных данных
  • Отзывчивый на мобильных

Минусы

  • Загрузка таблицы требует значительных ресурсов
  • Нет оптимизации производительности для загрузки CSS / JS только на страницах с таблицами
  • Нет шаблонов

Источник записи: www.webnots.com
Leave A Reply

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