Простое руководство по встраиванию документов Google Диска в WordPress

WordPress — система управления контентом (CMS) номер один на планете. Google Drive – это ведущее облачное хранилище данных от поисковой системы номер один на планете. Учитывая это, имеет смысл встраивать документы Google Диска в WordPress. Хорошая новость заключается в том, что есть несколько способов сделать это.

У Google есть функциональный способ встраивания документов с Google Диска на ваш сайт WordPress, но у него есть некоторые недостатки. Вместо этого вы захотите рассмотреть специальный плагин, такой как Google Drive Embedder. Это дает вам больше гибкости и помогает адаптировать рабочий процесс и подход к потребностям вашего сайта.

В этом посте мы дадим вам простое руководство по встраиванию документов Google Диска в WordPress. Перед этим поговорим о том, как WordPress работает с Google Docs из коробки.

Как WordPress и Google Docs работают вместе

У Google Docs и WordPress какое-то время были непростые отношения. Компании хорошо ладили, но CMS и пакет настольных издательских систем — нет. Это связано с тем, что Google Docs, в частности, страдает от тех же проблем, что и Microsoft Word: пользовательское форматирование под капотом.

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

Это связано с тем, что для форматирования текста в Документах Google используется скрытый HTML, а WordPress не знает, что делать с дополнительными тегами.

Документы Google в классический редактор

Например, у нас есть документ, который мы хотели бы импортировать на наш веб-сайт WordPress:

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

Однако, если вы посмотрите на текстовый редактор, вы заметите несколько дополнительных тегов:

Для ваших собственных документов вы можете обнаружить, что тегов больше или вообще нет. Несоответствие — еще один фактор в отношениях между Google Docs и WordPress.

В большинстве случаев вам потребуется найти и удалить следующие теги:

•   . Это тег HTML для обозначения неразрывного пробела.
• теги <span> . Это универсальные теги HTML, которые позволяют добавлять элементы стиля (и другие) к блокам HTML.
• Элементы списка (<li>) с атрибутом aria-level=”1” . Это атрибут доступности, который сам по себе мало что значит, поэтому в данном случае мы можем удалить его.

По мере развития WordPress некоторые из этих дополнительных тегов удаляются при входе в платформу.

Документы Google в редакторе блоков

Редактор блоков отлично справляется с анализом информации Google Doc с минимальной потребностью в вашем вводе.

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

Одним из элементов редактора блоков, о котором мало кто знает, является функция импорта изображений. Например, у нас есть изображение в нашем документе, которое нужно загрузить в WordPress:

Если вы выполните простое копирование и вставку, все будет выглядеть так, как вы ожидаете:

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

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

Почему встраивание документов Google Диска в WordPress — хорошая идея

В большинстве случаев вам нужно писать контент WordPress в родном редакторе (или, конечно, в вашем любимом редакторе компоновщика страниц). Однако есть много причин, по которым вы хотите работать с Google Диском и встраивать этот документ в WordPress:

• У вас будет больше потенциальной безопасности для вашего файла. Мы не имеем в виду в злонамеренном смысле, поскольку WordPress стабилен и надежен. В данном случае речь идет об облачном хранилище Google Drive. Если ваш файл находится здесь, это означает, что он зарезервирован и находится в безопасности.
• Вы можете аннотировать свой документ, как будто это «живой список дел». Это означает, что вы можете сотрудничать с другими в рамках документа, а также одновременно встраивать его в WordPress. Это эффективный и быстрый способ разместить свою работу в Интернете.
• Говоря об этом, совместные аспекты документов Google Диска означают, что несколько членов команды могут работать над ними одновременно. В WordPress у вас есть ограничения на количество членов команды в одном посте или странице за раз (часто один).

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

Как встроить документы Google Диска в WordPress без плагина

Хорошей новостью является то, что вам не нужно многого, чтобы встроить документы Google Диска в WordPress. Фактически, все, что вам нужно, находится в меню « Файл» > «Опубликовать в Интернете» в файле документа Google:

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

Когда вы нажмете для подтверждения, отобразится фрагмент HTML, который вы хотите скопировать и вставить в WordPress:

В вашем редакторе WordPress вы захотите получить доступ к редактору кода из меню «Дополнительные действия» с правой стороны:

На этом экране найдите подходящее место для встраивания и вставьте код в:

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

Тем не менее, у этого подхода есть несколько недостатков, несмотря на его простоту. Давайте обсудим их сейчас.

Недостатки встраивания документов Google Диска без плагина

Несмотря на то, что подход с прямым встраиванием приемлем, есть несколько предостережений и аспектов, на которые стоит обратить внимание:

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

Есть еще одна проблема, которая может непредвиденным образом повлиять на вас. Во время нашего тестирования мы столкнулись со случаями, когда нам было отказано в возможности встроить документ Google. Хотя iFrame отображался нормально, наш контент был заменен уведомлением «Условия использования»:

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

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

Представляем подключаемый модуль Google Drive Embedder

Чтобы получить лучший опыт при встраивании документов Google Диска, вам нужно обратиться к специальному решению. Плагин Google Drive Embedder — это уникальное решение для встраивания практически любого документа Google Диска на ваш сайт:

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

Хотя плагин ориентирован на встраивание Google Диска, это еще не все. Вы также можете отображать ряд других типов файлов. Это означает, что если у вас есть документы Microsoft Word, ZIP-файлы, видео, изображения, PDF-файлы и т. д., вы можете встроить их все.

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

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

Как встроить Google Диск в WordPress с помощью плагина Google Drive Embedder (3 шага)

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

1. Установите и активируйте подключаемый модуль входа в Google Apps.

Чтобы использовать Google Drive Embedder, вам также необходимо установить подключаемый модуль входа в Google Apps:

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

Процесс прост, особенно если вы делаете это на экране « Плагины» > «Добавить новый» в WordPress:

Здесь используйте панель поиска, чтобы найти подключаемый модуль входа в Google Apps, и нажмите кнопку « Установить сейчас» :

Через несколько секунд вы увидите, что кнопка изменится на « Активировать ». Вы можете нажать на нее еще раз, после чего вы вернетесь на главный экран плагинов .

Прежде чем двигаться дальше, перейдите на экран « Настройки» > «Вход в Google Apps» :

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

Когда вы будете готовы, вы можете приступить к установке подключаемого модуля Google Drive Embedder.

2. Установите и активируйте плагин Google Drive Embedder.

Процесс для этого плагина аналогичен входу в Google Apps. Единственное отличие состоит в том, что вместо этого вы будете искать Google Drive Embedder:

Снова нажмите « Установить сейчас », затем « Активировать », и WordPress установит плагин в вашей системе. С бесплатной версией Google Drive Embedder дальнейшая настройка не требуется! Однако, если вы перейдете на премиум-версию, вы можете найти все настройки на экране « Настройки»> «Google Drive Embedder» .

3. Вставьте свои документы с Google Диска в WordPress

Последний шаг — встроить документ в WordPress. Для этого перейдите к любому сообщению или странице и добавьте новый блок к своему контенту. Вы ищете блок Google Drive Embedder:

Как только вы добавите это в свой макет, взгляните на меню настроек блока на правой боковой панели. Это позволит вам выбрать документ Google Диска:

Отсюда вы увидите диалоговое окно, которое поможет вам выбрать документ:

[IMAGE google-file-dialog]

Обратите внимание, что при первом доступе к этому вам может потребоваться аутентификация доступа с помощью Google, хотя этот процесс аналогичен другим процессам аутентификации:

Когда вы это сделаете, вы увидите список ваших документов Google Диска во всплывающем диалоговом окне:

После выбора документа вы получаете доступ к трем переключателям под диалоговым окном выбора:

Все они интуитивно понятны и просты в использовании; параметры « Встроить документ » позволяют установить ширину и высоту встраивания, а ссылка «Просмотр файла» позволяет открыть файл в новом окне и отобразить значок. Переключатель «Ссылка для загрузки файла» позволит вам установить параметры для загрузки пользователями вашего файла, если этот документ не является родным документом Google.

После того, как вы нажмете кнопку «Вставить файл», вы увидите заполнитель шорткода, который обновляется на экране. Если вы просмотрите страницу отсюда, вы увидите, как выглядит ваше встраивание. С этого момента пользователи смогут взаимодействовать с документом в интерфейсе вашего сайта.

Вывод

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

Хотя вы, возможно, не захотите полагаться на собственные функции встраивания Google Диска, вы захотите использовать плагин, такой как Google Drive Embedder. Это дает вам возможность встраивать документы Google Диска практически в любое место на странице. Более того, вы получаете некоторые параметры настройки, чтобы сделать средство просмотра и испытать его по-своему.

Вам нужно встроить документы Google Диска, и поможет ли вам этот плагин? Поделитесь своими мыслями в разделе комментариев ниже!