Таблицы WordPress: 5 способов добавить таблицы в сообщения блога

Опубликовано: 2022-05-17

Плагин таблицы цен

Вы когда-нибудь думали о столах?

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

Я имею в виду таблицы, как в диаграммах данных, отображаемых в столбцах.

При написании контента иногда может возникнуть проблема с организованным представлением данных. Вы можете отобразить его в формате диаграммы, но проще всего сделать его изображением. К сожалению, изображения имеют массу различных недостатков, не последним из которых является невозможность Google индексировать информацию в таблице. Изображения диаграмм не годятся для SEO!

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

Грязная версия выглядит примерно так:

  • День – Имя – Продажи
  • Понедельник — Шон — 500 долларов
  • Понедельник – Дэйв – 400 долларов
  • Вторник — Стив — 500 долларов
  • Среда — Дженнифер — 800 долларов.
  • Среда — Сьерра — $750

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

Разумеется, HTML имеет встроенную поддержку таблиц. Тем не менее, его нелегко создавать и обновлять. Утомительный способ — использовать HTML-код для создания содержимого таблицы вручную.

  • Во-первых, вам нужны теги таблицы, поэтому <table> для запуска и </table> для закрытия.
  • Внутри этого вам нужен код для каждой строки. Строка начинается с <tr> и заканчивается </tr> .
  • Внутри каждой строки каждой ячейке нужна запись данных таблицы. Итак, <td> и </td> с определенным элементом данных внутри него. Первые — это заголовки для этих столбцов.

Итак, для самой первой строки информации, заголовков, в моем примере выше вы смотрите на:

<table>
<tr>
<td>Day</td>
<td>Name</td>
<td>Sales</td>
</tr>
<!-- Additional rows and cells here -->
</table>

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

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

Давайте копать!

Оглавление
Вариант 1: Таблицы WordPress по умолчанию
Вариант 2: TablePress
Вариант 3: Столы ниндзя
Вариант 4: Генератор таблиц данных
Вариант 5: Партнерский

Вариант 1: Таблицы WordPress по умолчанию

Знаете ли вы, что WordPress позволяет добавлять таблицы? Оказывается, это бесплатно и довольно просто, хотя и не имеет многих функций. В конструкторе страниц перетаскивания Gutenberg вы можете щелкнуть, чтобы добавить новый блок, и выбрать блок «Таблица». Он вставит блок, который служит полем конфигурации параметров таблицы. Если вы используете классический редактор, вам придется вернуться к Гутенбергу, чтобы использовать построитель таблиц во внешнем интерфейсе.

Как добавить таблицу в Gutenberg

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

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

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

Пример настройки таблицы

Теперь, конечно, вы можете войти в CSS и изменить все, что захотите, вручную. Это нормально! Но если вы пытаетесь сделать так, чтобы таблица выглядела так, как вы хотите, в редакторе WordPress, это огромная проблема. Поддержка таблиц в WordPress на удивление отсутствует, учитывая, сколько еще они позволяют вам делать из коробки. Например, если в вашей таблице тысячи строк, она не будет создавать разбивку на страницы, чтобы разделить ее на меньший раздел, который легче читать.

Вот тут-то и пригодится установка плагина для таблиц WordPress.

Вариант 2: TablePress

Если у вас уже давно есть веб-сайт WordPress, неудивительно, что почти любая функция, которую вы хотите добавить, вероятно, имеет надстройку с именем FeaturePress. Столы не исключение. TablePress можно найти в каталоге бесплатных плагинов или на их веб-сайте TablePress.org.

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

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

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

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

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

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

Импорт CSV в TablePress

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

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

Z
Z
Z
Ваш блог приносит вам прибыль? Если нет, давайте это исправим.

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

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

Контент-маркетинг состоит из двух составляющих — контента и маркетинга. Мы заработали наши черные пояса в обоих.

Если вы ведете интернет-бизнес и хотите масштабироваться, запланируйте звонок, чтобы поговорить с нашим основателем:
Бесплатный вызов стратегии

Вариант 3: Столы ниндзя

Ninja Tables — это удобный вариант для создания таблиц и управления данными на сайте WordPress. Он предназначен больше для сообщений в блогах с большим объемом данных, чем для повседневного использования, и он делает много вещей, которые поддерживают объемы данных. Например, ваша таблица может иметь фильтры и параметры сортировки, чтобы пользователи могли сортировать и корректировать данные, которые вы отображаете динамически. Это довольно полезно для многих статистических данных и информации, но в меньшей степени для таблицы сравнения продуктов.

Столы ниндзя на WordPress

Одной из самых привлекательных особенностей Ninja Tables является то, что он очень удобен для пользователя. Вам не нужен пользовательский CSS или код для управления внешним видом ваших таблиц. Вам даже не нужно вводить много данных, если вы этого не хотите; вы можете импортировать данные напрямую из файлов различных типов.

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

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

Пример создания таблицы ниндзя

Вы можете найти бесплатную версию Ninja Tables в каталоге плагинов WordPress. Как и многие плагины, они также предлагают премиум-версию, если вы хотите купить ее на их сайте.

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

  • Возможность добавлять в ячейки медиа-элементы, а не только текстовые данные.
  • Палитра цветов, так что вы не ограничены только предварительно настроенными для вас цветами.
  • Дополнительные параметры для импорта и экспорта данных или синхронизации с Google Sheets.
  • Параметры условного форматирования и расширенная фильтрация данных.
  • Использование шорткодов внутри ячеек таблицы.

Лицензия на один сайт стоит 49 долларов в год, вы можете заплатить 99 долларов за 20 сайтов или 199 долларов за неограниченное количество сайтов. Кроме того, они предлагают пожизненные лицензии за 199 долларов за один домен , 399 долларов за 20 или 599 долларов за неограниченное количество. Помимо количества доменов, на которых вы можете его использовать, планы не имеют ограничений, поэтому все платные версии идентичны. Вы можете просмотреть сайт и увидеть больше функций здесь.

Вариант 4: Генератор таблиц данных

Вам нравятся характеристики? Хотели бы вы, чтобы их было больше? Хотели бы вы иметь таблицу данных, которую можно динамически преобразовывать в диаграммы, графики, гистограммы, круговые диаграммы, PDF-файлы и другие экспортные файлы? Вы хотите отображать медиа в своей таблице? Панель поиска? Раскрывающийся список для выбора количества отображаемых строк? Сортировка по столбцу для каждого столбца? Отзывчивый дизайн?

Ладно, я остановлюсь.

Дело в том, что в Data Tables Generator от Supsystic есть почти все. Конечно, многое из этого скрыто за платной версией, а не за бесплатной, но все еще там. Если вы можете придумать функцию, которую хотите видеть в таблице, скорее всего, она там есть.

Как и TablePress, вы управляете своими таблицами с панели инструментов и встраиваете их в свои сообщения или страницы WordPress. Этот плагин очень подходит для специалистов по STEM, которые начинают вибрировать от волнения, когда видят хорошую кучу свежих данных, и совсем не для маркетолога, которому нужна таблица «выстрелил и забыл», в которой есть полдюжины строк и звездный рейтинг. Это также очень сложно, потому что у него есть миллион различных вариантов.

Пример сложной диаграммы

Когда я говорю, что это может сделать все, я имею в виду это. Дашборд Data Tables Generator для редактирования таблицы выглядит так, как если бы вы взяли Excel или Google Sheets и просто встроили их в редактор. В нем есть место для формул и форматирования и многое другое. В нем есть все, что вы могли бы хотеть. В некотором смысле это лучший плагин для таблиц WordPress просто потому, что он имеет больше всего функций.

Так в чем подвох?

Сложность, конечно. Это очень надежно для сайта с большим объемом данных, но если вы небольшой блог WordPress и вам нужна только диаграмма для сравнения себя с вашими конкурентами, таблица цен с различными планами и функциями или таблица сравнения продуктов для чего-то, что вы продаете ; это примерно такое же излишество, как использование крылатой ракеты для обработки вашего сада.

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

Платная версия, как и следовало ожидать, оценивается в виде таблицы.

Таблицы цен для генератора таблиц данных

Веб-сайт Data Tables Generator имеет лицензии на один, два или три года и для одного, пяти или 6+ сайтов одновременно. Лицензия на один сайт на один год стоит 46 долларов.

Вариант 5: Партнерский

Большинство из вышеперечисленных вариантов предназначены для отображения больших объемов сложных данных в таблицах, но что, если вы не хотите чего-то такого сложного?

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

Пример партнерского продукта

Affiliatable — один из таких способов добавления этих таблиц. В нем есть сравнительные таблицы, формат «3 лучших поля», поля с подробной информацией об отдельных продуктах и ​​стиль окна с плюсами и минусами. Что еще более важно, он имеет некоторые маркетинговые функции, а не функции управления данными. Пользователям не нужно иметь возможность сортировать или искать в таблице сравнения продуктов, но они, безусловно, могут извлечь выгоду из небольшого геотаргетинга с вашей стороны, верно?

Affiliatable имеет три версии:

  • Бесплатная версия
  • Про версия для односайтовой лицензии
  • Про версия для неограниченного количества сайтов

Бесплатная версия приемлема, но ограничена; он не позволяет вам использовать премиальные шаблоны, он не оптимизирован для схемы и не позволяет использовать пользовательские категории. Платные версии стоят 39 долларов в год и 89 долларов в год соответственно, или вы можете купить пожизненные лицензии за 199 или 399 долларов .

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