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

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

таблица товаров в WordPress

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

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

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

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

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

Как создать таблицу сравнения с помощью плагина WP Table Builder

В этой статье я создам вот такую таблицу для сравнения телевизоров.

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

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

Шаг № 1: Установите плагин WP Table Builder

Для создания таблицы сравнения товаров я буду использовать плагин WP Table Builder. Это бесплатный инструмент для создания гибких таблиц.

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

Чтобы установить этот плагин, перейдите на панель инструментов WordPress, далее Плагины. Нажмите «Добавить новый» и найдите «WP Table Builder». Нажмите установить и активировать, чтобы установить плагин на свой сайт.

Установка плагина WP Table Builder

Шаг № 2: Создаем новую таблицу

Чтобы создать новую таблицу в плагине WP Table Builder, вам нужно перейти к Table Builder — Add New.

Добавление новой таблицы

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

Конструктор создания таблиц

Вы можете дать имя своей таблице и установить количество строк и столбцов. После того, как вы установите количество строк и столбцов, которые вы хотите иметь в своей таблице, нажмите кнопку «Generate (Создать)».

Получится таблица, как показано ниже:

Таблица прототип

Шаг № 3: Заполните свою таблицу

Теперь пришло время для наполнения таблицы. WP Table Builder позволяет перетаскивать элементы в ячейки ваших таблиц.

Вы можете выбрать элемент на левой боковой панели и перетащить их на свою таблицу.

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

Вот как выглядит моя таблица после добавления контента:

Таблица с контентом

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

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

Шаг № 4: Делаем таблицу красивой и отзывчивой.

Есть много способов сделать великолепной вашу таблицу с помошью WP Table Builder. Этот плагин имеет так много вариантов настройки, и позволяет сделать многое.

Вот что вы можете еще сделать:

  • Настроить границы таблицы — WP Table Builder позволяет добавить границы к вашей таблице. Вы можете найти эту опцию в настройках таблицы слева.
  • Вы можете установить ширину границы и изменить ее цвет, а также вы можете установить внутренние границы таблицы.

Добавление границ таблицы

  • Cell Padding -Определяет расстояние в ячейках. Изменяя его значение, ваша таблица будет более плотной или более разряженной.

Регулирование расстояния в таблице

  • Header Background (Фон заголовка) — Вы также можете настроить цвет фона заголовка вашей таблицы. Это добавит стиля к вашей таблице.

Установка фона заголовков

  • Фон четных / нечетных рядов фона (Even/Odd Row Background) — Когда идет большая таблица, читателям трудно удержать внимание. В этом поможет сочетание четных и нечетных строк, которые отделяются разным цветом. И вы можете сделать это с помощью плагина WP Table Builder.

Установка фона нечетных строк таблицы

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

Установка адаптивности таблицы

Также включите опцию — Top Rows As Header. Она устанавливает вашу верхнюю строчку в качестве заголовков таблицы.

Сохраните таблицу кликнув на Save Table в верхней части конструктора.

Шаг № 5: Вставить таблицу с помощью шорткода

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

Чтобы найти шорткод таблицы, нажмите кнопку «EMBED» в верхней части конструктора таблиц. Откроется всплывающее окно с шорткодом таблицы.

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

Теперь, для вставки таблицы в статью, просто вставьте этот шорткод.

Заключение

Вот как легко можно создать таблицу в WordPress для сравнения товаров. Если это делать с помощью кода HTML, или даже с помощью большинства других плагинов, то это будет совсем не так просто, но главное, совсем не так красиво и профессионально. С помощью плагина WP Table Builder весь процесс создания таблицы упрощается и таблицу можно сделать за несколько минут.

Конечно, в этой статье я не рассмотрел все настройки плагина. И если у вас остались вопросы, то задавайте их в комментариях.

1 Star2 Stars3 Stars4 Stars5 Stars (1 оценок, среднее: 5,00 из 5)
Loading...
Случайные публикации:
  • Конкурс для YouTube блоггеров от BinPartnerКонкурс для YouTube блоггеров от BinPartner...на берегу реки или моря, торгуете на планшете. Или, например, вы можете
  • Что такое конверсия трафика на сайте?Что такое конверсия трафика на сайте?Сейчас, в очередной раз надеясь получить успешный эффект, пиарю кое-что...
  • Как в WordPress добавить область виджетов в сайдбар?Как в WordPress добавить область виджетов в сайдбар?...еретаскиваем в WordPress называют обычно областью виджетов. Данная CMS позволяет нам
  • Как проверять купленный текст на рерайт и зачем? Используем eTXT АнтиплагиатКак проверять купленный текст на рерайт и зачем? Используем eTXT АнтиплагиатПри покупке уникальных статей на биржах копирайтинга (особенно пр...
  • Что такое поисковый спам (спамдексинг)?Что такое поисковый спам (спамдексинг)?...тров, а не к полной его смерти. Кроме того, многие веб-мастера и т.н. сеошники использует
Оставьте комментарий:
Я не спамлю...