Создание и управление таблицами с помощью редактора Gutenberg

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

 Это может быть действительно утомительно искать таблицу после её создания, поскольку нам приходится копировать/вставлять короткий код, но что если есть блок, посвящённый поиску всех ваших таблиц? WP Table Manager позволяет вам сделать это с помощью простого в использовании редактора Gutenberg WordPress.

WP Table Manager добавляет блоки в редактор Gutenberg, что позволит вам добавлять эти таблицы с полем поиска прямо в блок.

Создание таблиц WordPress с помощью этого плагина для Gutenberg

Для этого поста мы будем использовать WP Table Manager для создания таблицы сравнения цен, сначала мы увидим, как создавать таблицы.

Для начала перейдите в «Менеджер таблиц» > «Все таблицы», в этом разделе нажмите « + Создать новую» > «Таблица», это откроет редактор таблиц. Для упрощения работы можно использовать тему оформления, поэтому выберем одну из них: «Тема» > «Выбор темы».

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

Теперь нажмите Ok (имейте в виду, что все данные в таблице будут удалены).

Поскольку мы добавили тему, почти вся работа выполнена.

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

Чтобы удалить, просто кликните на строки, кликните правой кнопкой мыши, а затем Удалить.

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

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

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

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

Перейдите в раздел «Записи» > «Добавить новую», вы увидите редактор Gutenberg, выберите WP Table Manager .

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

Таблица будет добавлена, и теперь вам нужно будет только опубликовать этот пост, и таблица будет там, так же просто, как нажать на таблицу и опубликовать пост/страницу.

И это всё, мы создали и опубликовали таблицу цен менее чем за 10 минут, действительно легко, не так ли?

Использование WP Table Manager в WordPress для создания диаграмм

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

Теперь, чтобы создать диаграммы, перейдите в Диспетчер таблиц > Все таблицы. У нас должна быть создана таблица с данными, которые мы хотим отобразить на диаграмме, то есть таблица подготовлена ​​с информацией для создания этой диаграммы.

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

Создать категории очень просто: для этого нажмите + Создать новую > Категория.

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

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

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

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

Мы будем использовать круговую диаграмму для этого примера.

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

Теперь, когда мы создали/настроили диаграмму, перейдем в раздел «Запись» > «Добавить новую» , чтобы создать запись и добавить созданную нами диаграмму.

В редакторе Gutenberg найдите блок «WP Table Manager Chart» и добавьте его в запись.

Это откроет поле поиска, где вы сможете увидеть все доступные графики.

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

Как вы видите, шорткод будет автоматически добавлен, поэтому вам нужно будет только опубликовать его, и все будет сделано.

Но что произойдет, если мы захотим обновить данные на графике? Следует ли нам создавать новый график? Нет! Вы можете просто отредактировать данные в таблице, и график будет автоматически обновлен.

В этом примере население Тувалу составляет 11147 человек, как вы можете видеть на изображении, поэтому давайте изменим население на 20000 и снова проверим график.

Теперь диаграмма должна быть обновлена, давайте проверим её.

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

Кроме того, таблицы из баз данных в WordPress

Также есть возможность создавать таблицы из базы данных, и эта таблица будет автоматически обновляться при изменениях в базе данных. Поэтому, если у вас есть информация, хранящаяся в базе данных, и вы хотите создать на её основе таблицу/диаграмму, просто нажмите « + Создать новую» > «Таблица базы данных»

Это перенаправит вас на страницу со всеми таблицами, включенными в вашу базу данных, поэтому вы можете просто выбрать ее с нужными столбцами, и WP Table Manager автоматически создаст таблицу.

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

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

Теперь нажмите на Создать таблицу и таблица будет автоматически создана, имейте в виду, что есть Условия, которые мы можем добавить, например, показать переменную только если электронная почта автора - “Этот адрес электронной почты защищен от спам-ботов. Для его просмотра вам необходимо включить JavaScript.”.

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

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

Наш новый дизайн сделает все еще проще!

Начните создавать таблицы с WP Table Manager

Теперь, когда вы знаете, насколько легко создавать и управлять таблицами с помощью WP Table Manager, чего вы ждете? Перейдите сюда и приобретите членство, чтобы начать обслуживать все эти таблицы наиболее профессиональным способом.