Как встроить Google Таблицы в WordPress (таблицы и диаграммы)

Хотите встроить Google Таблицы в WordPress? В этом посте мы научим вас, как добавлять данные Google Таблиц в WordPress двумя способами:

1. Визуальные диаграммы – используйте электронную таблицу Google Sheets для создания гистограмм, линейных графиков, круговых диаграмм и множества других форматов.
2. Таблицы – встраивайте электронную таблицу Google Sheets в виде адаптивной таблицы вместе с такими полезными функциями, как поиск и фильтры.

Мы шаг за шагом покажем вам, как это сделать с помощью бесплатного плагина Visualizer — код не требуется.

Как Visualizer помогает встроить Google Таблицы в WordPress

Полное раскрытие – Визуализатор это плагин Themeisle. Он позволяет извлекать данные из Google Sheets (и другие источники) и преобразуйте его в профессионально выглядящий график или таблицу на своем сайте WordPress.

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

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

В премиум-версии вы даже можете автоматически синхронизировать диаграммы — при обновлении данных в Google Sheets эти изменения будут автоматически синхронизироваться с вашим сайтом WordPress.

Как добавить Google Таблицы в WordPress с помощью визуализатора (за три шага)

Если вы хотите следовать этому руководству, вам понадобятся две вещи:

1. Ваши существующие данные в Google Таблицах.
2. бесплатный плагин визуализатора. Прежде чем продолжить обучение, вам необходимо установить и активировать его.

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

Когда плагин активен, вы получите доступ к новому Визуализатор вкладка на панели управления. Если вы нажмете на нее, вы увидите список всех существующих диаграмм. Нажать на Добавить новое кнопка вверху, чтобы начать:

Первое, что вам нужно сделать, это выбрать стиль для ваших данных Google Sheets. Какой из них выбрать, будет зависеть от ваших данных и того, что вы хотите, чтобы читатели извлекли из них:

• Чтобы встроить таблицу данныхвыбрать Стол стиль диаграммы.
• Встроить визуальные диаграммывы можете выбирать из множества различных стилей диаграмм.

Для визуальной диаграммы вам нужно выбрать стиль, который лучше всего поможет вам визуализировать данные Google Sheets. У CodeinWP есть несколько хороших советов о том, как выбрать правильный стиль диаграммы для ваших данных.

Шаг 2. Импортируйте данные из Google Таблиц.

Используя бесплатную версию Visualizer, вы можете импортировать данные из .csv файл, URL-адрес или введите его вручную. Чтобы добавить Google Таблицы в WordPress, вам следует выбрать Импортировать данные из URL вариант и выберите Одноразовый импорт:

Пока оставьте эту вкладку открытой и перейдите в Google Таблицы, чтобы получить свои данные. Допустим, у вас есть очень простая таблица, в которой показаны различные количества фруктов:

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

• нить
• число
• логическое значение
• дата
• время дата
• время суток

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

Теперь данные готовы к работе плагина. Чтобы создать URL-адрес, который вам нужен для WordPress, откройте Google Таблицы. Файл меню и выберите Публикация в Интернете:

В появившемся меню выберите Весь документ и Значения, разделенные запятыми (.csv)затем нажмите Публиковать кнопка:

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

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

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

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

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

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

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

Шаг 3. Отобразите новую диаграмму в WordPress

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

Есть два способа добавить визуализации к вашим сообщениям или страницам:

1. Короткие коды
2. Блоки

Если вы присмотритесь, вы заметите короткий код под каждой таблицей или диаграммой:

Вы можете скопировать этот короткий код и разместить его в любом месте на своем веб-сайте.

Второй подход — открыть редактор блоков и добавить Диаграмма визуализатора заблокировать вашу публикацию или страницу:

Редактор спросит, хотите ли вы отобразить существующую диаграмму или создать новую. Если вы выберете первый вариант, вы увидите список всех доступных графиков — выберите один:

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

Каждый тип диаграммы имеет свои собственные настройки, которые вы можете настроить, чтобы настроить ее. Например, с помощью таблицы вы можете настроить параметры нумерации страниц и включить адаптивность, чтобы ее можно было читать на мобильных устройствах:

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

Заключение

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

С бесплатным Визуализатор плагин, вы можете выполнить этот точный процесс в три этапа:

1. Создайте новую диаграмму или таблицу и выберите стиль, который использовать.
2. Импортируйте данные из Google Таблиц.
3. Редактируйте и отображайте свою диаграмму в WordPress.

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

Чтобы узнать больше о том, как работать с таблицами и диаграммами в WordPress, ознакомьтесь с нашими коллекциями лучших материалов:

У вас есть вопросы о том, как встроить Google Таблицы в WordPress? Давайте рассмотрим их в разделе комментариев ниже!

Бесплатное руководство

4 основных шага для ускорения
Ваш сайт WordPress

Следуйте простым шагам из нашей мини-серии из 4 частей.
и сократите время загрузки на 50-80%. 🚀