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

Как создать сравнительную таблицу в WordPress?

23

Люди говорят, что WordPress поддерживает более 30% веб-сайтов в Интернете. Однако создать веб-сайт со всеми необходимыми функциями – непростая задача. Создание таблиц в WordPress – один из простых примеров этого. WordPress представил блок таблиц с Gutenberg и постоянно обновляет его. Однако он не реагирует и не будет работать должным образом на мобильных устройствах, если у вас три или более столбца. Хотя плагины, такие как TablePress, решают эту проблему с помощью бесплатного плагина, по-прежнему неудобно создавать сравнительную таблицу, для которой нужны звезды обзора. В этой статье мы объясним, как создать сравнительную таблицу в WordPress.

Что такое сравнительная таблица?

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

  • Отображение списка из 10 лучших продуктов в таблице – например, 10 лучших хостинговых компаний.
  • Сравните характеристики двух продуктов – например, iPhone и Samsung Galaxy.

Как создать сравнительную таблицу в WordPress?

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

  • Войдите в свою панель управления WordPress и перейдите в раздел «Плагины> Добавить новый».
  • Найдите ключевое слово «таблица» и найдите «WP Table Builder – WordPress Table Plugin ».
  • Установите и активируйте плагин для создания красивых таблиц.

Как создать сравнительную таблицу в WordPress?

Конструктор таблиц WP

Создание таблиц с помощью Drag and Drop Table Builder

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

Как создать сравнительную таблицу в WordPress?

Редактор перетаскивания WP Table Builder

Введите таблицу имен для своей таблицы и выберите столбцы / строки. Щелкните по кнопке «Создать».

Настроить параметры таблицы

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

Как создать сравнительную таблицу в WordPress?

Настройки стола

  • Включите опцию «Сделать таблицу адаптивной», чтобы сделать ваши таблицы адаптивными на мобильных устройствах.
  • Добавьте верхнюю строку в качестве заголовка и установите цвет для строки заголовка.
  • Измените размеры и цвета внешней и внутренней границы.
  • Добавьте цвета для четных и нечетных строк на столе.
  • Настройте заполнение ячеек и ширину таблицы.

Если вы не знакомы с таблицами, узнайте здесь, как создавать таблицы HTML.

Добавление содержимого в таблицу

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

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

Как создать сравнительную таблицу в WordPress?

Таблица сравнения в построителе таблиц

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

Получение шорткода для сравнительной таблицы

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

Как создать сравнительную таблицу в WordPress?

Получить встроенный шорткод

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

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

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

  • Просто вставьте шорткод в блок «Абзац» или «Шорткод» редактора Гутенберга.
  • Вы также можете вставить таблицу в нижний колонтитул или боковую панель с помощью текстового виджета. Перетащите виджет «Текст» в область боковой панели или нижнего колонтитула и вставьте шорткод таблицы. Сохраните изменения, и таблица начнет отображаться в соответствующей области виджетов на опубликованном сайте.

Опубликованная таблица на рабочем столе будет выглядеть примерно так:

Как создать сравнительную таблицу в WordPress?

Образец сравнительной таблицы

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

Как создать сравнительную таблицу в WordPress?

Сравнительная таблица на мобильных устройствах

Плюсы и минусы плагина WP Table Builder

У плагина есть как преимущества, так и несколько ограничений.

Плюсы

  • Плагин – прекрасный инструмент для создания адаптивных сравнительных таблиц на вашем сайте WordPress.
  • Он не показывает никаких раздражающих рекламных объявлений или дополнительных продаж в разделе администратора.
  • Простой интерфейс с возможностью перетаскивания и настраиваемыми параметрами.
  • Шорткоды для вставки таблицы в любом месте вашего сайта.

Минусы

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

Мы надеемся, что в будущих обновлениях будут включены эти параметры.

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

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