Как встроить Google Таблицы на сайт WordPress — Мария Кассаева

Как встроить Google Таблицы на сайт WordPress

Publish to the web

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

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

Как вставить Google Таблицы на сайт WordPress

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

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

Создайте код для встраивания Google Таблиц

Для начала вы будете работать в интерфейсе Google Таблиц — обязательно откройте электронную таблицу, которую вы хотите встроить. В интерфейсе Google Таблиц откройте меню Файл и выберите «Опубликовать в Интернете»:

Publish to the web

Откроется всплывающий интерфейс. Перейдите на вкладку «Встраивание» в этом всплывающем окне и выберите, хотите ли вы встроить весь документ или только отдельный лист.

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

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

Выбрав, нажмите «Опубликовать».

Click publish

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

embed code

Добавьте код для встраивания Google Таблиц в WordPress

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

embed in editor

Если вы используете классический редактор TinyMCE, вы можете вставить код встраивания на вкладку «Текст» в редакторе (а не на вкладку «Визуальный»). Когда вы публикуете/обновляете сообщение, вы должны увидеть встроенный документ Google Таблиц во внешнем интерфейсе. Как видите, моя таблица довольно широкая, поэтому во внешнем интерфейсе она выглядит немного неудобной/

Google Sheets document on the front-end

Чтобы исправить это, вы можете добавить во встраиваемый код параметры высоты и ширины. Например, я установила ширину 100% (при этом она занимает всю ширину области содержимого) и высоту 500 пикселей. Вы можете настроить это в соответствии со своими потребностями.

height and width parameters

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

embed code with parameters

Лучшие плагины Google Таблиц для WordPress

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

1. Inline Google Spreadsheet Viewer

Inline Google Spreadsheet Viewer — популярный бесплатный плагин, который позволяет встроить встроенную программу просмотра PDF-файлов с помощью простой системы на основе коротких кодов. Это полезно, если вы не хотите встраивать весь интерфейс Google Таблиц и предпочитаете использовать программу просмотра таблиц этого плагина.

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

2. wpDataTables

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

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

3. TablePress

TablePress — популярный бесплатный плагин для таблиц в WordPress. С помощью расширения Automatic Periodic Table Import вы можете автоматически импортировать Google Таблицы в WordPress по выбранному вами расписанию.

Все, что вам нужно сделать — это создать URL-адрес экспорта CSV для Google Таблицы и добавить его в TablePress. Для этого перейдите в меню «Файл» → «Опубликовать в Интернете» в интерфейсе Google Таблиц и выберите CSV в разделе «Ссылка».

4. Visualizer

Visualizer — еще один популярный плагин для таблиц/диаграмм в WordPress. В бесплатной версии вы можете единовременно импортировать таблицы Google в WordPress. А если вы перейдете на премиум-версию, вы также сможете автоматически синхронизировать таблицу с электронной таблицей, чтобы данные обновлялись. Бесплатная версия Visualizer доступна на WordPress.org, а премиум-версия стоит от 59 долларов.

5. Essential Addons для Elementor

Если вы используете популярный конструктор страниц Elementor, плагин Essential Addons включает виджет, который позволяет вам импортировать данные Google Таблиц в таблицу в ваших проектах. Посмотрите демонстрацию здесь или просмотрите документацию. Essential Addons стоит 40 долларов.

Вставьте Google Таблицы на свой сайт WordPress

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

Если вам нужна помощь в работе с вашим сайтом WordPress, обращайтесь ко мне.

WordPress тема под вирусный контент и социальные сети