WordPressПлагиныУчебники

Как встраивать PDF-файлы в WordPress

Как встраивать PDF-файлы в WordPress

Бывают случаи, когда вам захочется встроить PDF-файл в свое сообщение или страницу:

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

Но существует проблема!

Хотя WordPress позволяет вам встраивать аудио, видео и, конечно же, изображения, невозможно встраивать файлы PDF в ваши сообщения и страницы. Эта функция пока недоступна, возможно, она будет добавлена ​​в будущем.

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

Но что, если вы хотите встроить PDF-файлы в свои сообщения и позволить посетителям просматривать их, не покидая вашего веб-сайта? Есть ли решение для этого? Краткий ответ: да.

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

Как встроить PDF-файл с помощью плагина

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

Однако мы будем использовать плагин под названием PDF Embedder. Это бесплатный плагин, который доступен в каталоге плагинов WordPress. Лучшее в этом плагине – это то, что он использует javascript для выполнения своей работы, а не какой-то сторонний сервис или фреймы.

Шаг 1. Установите плагин PDF Embedder

Войдите в свою панель управления WordPress и выберите Плагины> Добавить новый. Теперь найдите PDF Embedder в поле поиска. Как только вы найдете плагин, просто установите и активируйте его. Просто, не правда ли?

Как встраивать PDF-файлы в WordPress

Шаг 2. Настройте плагин

Хотя вы можете начать встраивать свои PDF-файлы после установки этого плагина, вы можете сначала изменить настройки, чтобы встроенные файлы выглядели лучше. Чтобы открыть страницу настроек этого плагина, перейдите в «Настройки»> «PDF Embedder» на левой боковой панели панели инструментов WordPress.

Как встраивать PDF-файлы в WordPress

Бесплатная версия этого плагина позволяет вам изменить следующее:

  • Ширина и высота – вы можете изменить ширину и высоту средства просмотра PDF. Он принимает целые значения (в пикселях) или максимальные  (ширина 100%).
  • Расположение панели инструментов  – панель инструментов этого средства просмотра PDF позволяет вашей аудитории увеличивать или уменьшать масштаб и переходить к следующей или предыдущей странице. У вас может быть панель инструментов вверху, внизу или в обоих местах.
  • Наведение панели инструментов  – вы можете выбрать, хотите ли вы, чтобы панель инструментов отображалась только при наведении курсора мыши на документ или нет.

Теперь это универсальные настройки. Но что, если вы хотите изменить настройки конкретного файла? Что ж, вы можете сделать это с помощью шорткодов. Вот пример:

[pdf-embedder url = »http://yoursite.com/wp-content/uploads/2019/01/April.pdf» width = «500 ″ toolbar =« top »toolbarfixed =« on »]

В приведенном выше примере ширина установлена ​​на 500 пикселей, панель инструментов расположена вверху, а панель инструментов будет фиксированной. Вы также можете установить панель инструментов в нижнее положение, а панель инструментов – в выключенное положение.

Этот плагин также имеет премиум-версию, которая предлагает такие функции, как кнопка загрузки, отслеживание просмотров и загрузок, непрерывная прокрутка страниц и открытие ссылок в новом окне.

Шаг 3. Вставьте PDF-файл в свое сообщение или страницу

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

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

Прежде всего, создайте новый пост или откройте существующий, а затем нажмите кнопку «Добавить медиа». Теперь загрузите файл PDF, нажмите кнопку «Вставить в сообщение», и к вашему сообщению будет добавлен шорткод.

Как встраивать PDF-файлы в WordPress

Вот и все – теперь вы можете предварительно просмотреть свой пост, чтобы проверить, правильно ли он работает.

А как насчет редактора Гутенберга? Ну, плагин PDF Embedder поставляется с определенным блоком. Итак, создайте новый пост и нажмите значок «Добавить блок». Затем найдите блок PDF Embedder и выберите его.

Как встраивать PDF-файлы в WordPress

Наконец, нажмите на блок, чтобы выбрать (или загрузить) свой PDF-файл, и ваша работа будет сделана.

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

Как встраивать PDF-файлы в WordPress

Популярные плагины для просмотра PDF-файлов

Хотя плагин PDF Embedder работает хорошо, всегда полезно иметь альтернативу. Итак, позвольте мне поделиться некоторыми бесплатными и платными плагинами для просмотра PDF без определенного порядка:

Просмотрщик PDF для WordPress


Как встраивать PDF-файлы в WordPress

Информация и Скачать

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

Инструмент для встраивания Google Диска


Как встраивать PDF-файлы в WordPress

Информация и СкачатьПосмотреть демо

Google Drive Embedder – это бесплатный плагин, который позволяет вам получить доступ к вашему Google Диску из панели управления WordPress и встраивать PDF-файлы, документы Word или электронные таблицы в вашу публикацию или страницу. Однако, чтобы использовать этот плагин, вам также необходимо установить вход в Google Apps – цель этого плагина – подключить ваш Google Диск к вашему сайту WordPress.

Алгори PDF Viewer


Как встраивать PDF-файлы в WordPress

Информация и СкачатьПосмотреть демо

Ищете плагин блока Гутенберга для встраивания файлов PDF? Вы можете попробовать плагин Algori PDF Viewer. Этот бесплатный плагин совместим со всеми веб-браузерами, такими как Google Chrome, Firefox, Safari, Opera и Internet Explorer 11. Он позволяет загружать несколько файлов на одной странице и поддерживает режим презентации.

Плагин Real3D FlipBook для WordPress


Как встраивать PDF-файлы в WordPress

Информация и Скачать

Как следует из названия, Real3D FlipBook – это отзывчивый и удобный для сенсорных экранов плагин 3D flipbook для отображения PDF-файлов и изображений. Он был разработан с использованием HTML5 и не требует использования Flash. Вы можете настроить такие параметры, как скорость поворота, звук поворота, уровень масштабирования и угол обзора камеры. Этот плагин также поддерживает лайтбокс и полноэкранный режим.

Вставить любой документ плюс


Как встраивать PDF-файлы в WordPress

Информация и Скачать

Embed Any Document Plus – единственный в своем роде плагин, который позволяет легко загружать и вставлять файлы документов (PDF, Word, PPT, Excel и т.д.) На веб-сайты WordPress. Плагин добавляет кнопку «Добавить документ» над визуальным редактором. Откроется всплывающее окно EAD Plus, в котором вы можете выбрать источник своего документа. Он также тесно интегрирован с облачными сервисами Google Drive, Dropbox и Box.com. Вы можете оставаться на своем сайте WordPress и загружать файлы в облачные сервисы и встраивать их прямо оттуда.

После загрузки или выбора документа, который вы хотите встроить, вы также получите возможность выбрать, какую службу документов вы хотите выбрать для встраивания файла. Плагин автоматически распознает формат файла и предложит вам программу просмотра. Зрители могут обрабатывать файлы размером от 5 до 8 МБ. Для файлов большего размера разработчики рекомендуют загружать их на Google Диск и встраивать оттуда.

Как встроить PDF-файл без плагина

Что ж, если вы один из тех, кто всегда ищет решения без плагина, то этот раздел для вас. Мы, безусловно, можем встроить PDF-файл в сообщения и страницы WordPress, не устанавливая еще один плагин.

Идея проста – вам нужно будет загрузить файл PDF в свою учетную запись на Google Диске, а затем использовать код iframe, чтобы встроить этот файл на свой сайт. Хотя этот метод безопасен, единственная проблема заключается в том, что он использует фреймы.

Шаг 1. Перейдите на Google Диск и войдите в свою учетную запись (просто зарегистрируйте бесплатную учетную запись Gmail, чтобы бесплатно получить 15 ГБ места на Диске).

Шаг 2: Загрузите сюда PDF-файл, который вы хотите встроить в свой пост WordPress. Для этого нажмите «Создать» на левой боковой панели своей учетной записи Google Диска, выберите «Загрузить файл» и загрузите файл со своего локального компьютера.

Как встраивать PDF-файлы в WordPress

Шаг 3: После того, как файл будет загружен на ваш диск, дважды щелкните по нему, чтобы просмотреть файл. Теперь нажмите на 3 вертикальные точки (Дополнительные действия) в правом верхнем углу и выберите Открыть в новом окне .

Как встраивать PDF-файлы в WordPress

Шаг 4: В новом окне нажмите «Дополнительные действия» (3 вертикальные точки в правом верхнем углу) и выберите «Поделиться».

Как встраивать PDF-файлы в WordPress

Шаг 5: Откроется всплывающее окно с названием «Поделиться с людьми и группами» и «Получить ссылку». Здесь нажмите «Изменить для всех, у кого есть ссылка» в разделе «Получить ссылку». Это гарантирует, что любой, у кого есть ссылка на файл PDF, сможет его просмотреть. Если вы этого не сделаете, файл останется закрытым и не будет виден аудитории вашего сайта.

Как встраивать PDF-файлы в WordPress

Вы должны увидеть следующее подтверждение:

Как встраивать PDF-файлы в WordPress

Как только вы это сделаете, нажмите Готово .

Шаг 6: Теперь пришло время получить код для встраивания, который мы будем использовать в нашем посте. Для этого снова нажмите «Дополнительные действия» и выберите «Вставить».

Как встраивать PDF-файлы в WordPress

Шаг 7. Откроется всплывающее окно, в котором вы можете скопировать код iframe.

Как встраивать PDF-файлы в WordPress

Шаг 8: Перейдите в панель управления WordPress и создайте или отредактируйте сообщение или страницу, на которые вы хотите встроить файл PDF. Теперь, если вы используете классический редактор, просто перейдите на вкладку Текст и вставьте код:

Как встраивать PDF-файлы в WordPress

Для редактора Gutenberg вам нужно добавить новый блок, выполнить поиск по Custom HTML и, наконец, добавить код iframe в блок Custom HTML:

Как встраивать PDF-файлы в WordPress

Шаг 9. Вот и все – теперь просмотрите сообщение или страницу, чтобы проверить встроенный PDF-файл.

Сноска о том, как встраивать файлы PDF в WordPress

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

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

Источник записи: https://www.wpexplorer.com

Похожие сообщения
WoocommerceWordPressПлагиныПодсказки

Как управлять налогом с продаж для магазинов WooCommerce

WordPressWordPress - АдминкаПлагиныПодсказки

Как настроить результаты страницы поиска в WordPress

WordPressПлагиныПодсказки

Простые решения для создания базы знаний WordPress

WordPressПолезные сайтыУчебники

WordPress.com и WordPress.org: различия, плюсы и минусы

Добавить комментарий