Как добавить встроенный просмотр PDF в WordPress

0 71

Как добавить встроенный просмотр PDF в WordPress

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

В этой статье мы покажем, как добавить просмотр PDF в WordPress.

Как добавить встроенный просмотр PDF в WordPress

Почему нужно об этом задумываться?

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

Как добавить встроенный просмотр PDF в WordPress

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

Один из способов справиться с этим – предлагать PDF-файлы в контенте записей/статей. Для этого потребуется установить дополнительный плагин.

Устанавливаем PDF Embedder

Мы будем использовать PDF Embedder, лучший на текущий момент плагин для встраивания PDF в WordPress.

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

Для начала вам нужно будет установить и активировать плагин PDF Embedder.

После активации вы можете посетить Settings -> PDF Embedder, чтобы задать параметры плагина. Стандартные настройки подходят для большинства вебсайтов, поэтому данный шаг не является обязательным.

Как добавить встроенный просмотр PDF в WordPress

Вы можете задавать высоту и ширину PDF-вьювера. Вы можете корректировать эти параметры, если считаете, что инструмент просмотра слишком широкий или слишком узкий.

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

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

Когда вы завершите изменять настройки, не забудьте нажать «Save Changes» для их сохранения.

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

Добавляем просмотр PDF через редактор блоков

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

Сначала поместите курсор в то место, где вы хотите встроить PDF-документ. Затем вам нужно будет добавить новый блок, щелкнув по кнопке «Add Block +» в верхнем левом углу экрана на странице редактирования WP.

Затем вам нужно будет нажать на кнопку PDF Embedder в секции Text.

Как добавить встроенный просмотр PDF в WordPress

Как только вы сделаете это, вы сможете загрузить новый PDF-файл в свою запись (или выбрать уже готовый файл из медиатеки). Вы можете сделать это, щелкнув по ссылке «Click here to Open Media Library to select PDF».

Как добавить встроенный просмотр PDF в WordPress

Вы попадете в медиатеку WP. Если вы еще не загружали PDF-файл, сделайте это сейчас. Просто перетащите файл в библиотеку.

Как добавить встроенный просмотр PDF в WordPress

PDF-файл будет автоматически загружен и выбран. Все, что вам останется сделать – щелкнуть по кнопке «Select».

Как добавить встроенный просмотр PDF в WordPress

Вы увидите ваш PDF-документ в контенте. Превью этого файла в редакторе не выводится. Блок будет просто содержать URL файла.

Как добавить встроенный просмотр PDF в WordPress

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

Как добавить встроенный просмотр PDF в WordPress

Добавляем просмотр PDF через классический редактор

Вставка PDF в классический редактор ничуть не сложнее. Просто добавляем новую запись или редактируем уже существующую.

Помещаем курсор в то место, куда мы хотим добавить PDF. Далее перетаскиваем PDF-файл на страницу.

Как добавить встроенный просмотр PDF в WordPress

PDF автоматически загрузится в вашу медиатеку и будет выбран. Дальше жмем на кнопку «Insert into post».

Как добавить встроенный просмотр PDF в WordPress

PDF Embedder добавит шорткод к вашей записи или к вашей странице. Он будет иметь следующий вид: [ pdf-embedder url=”PDFURL” ].

Как добавить встроенный просмотр PDF в WordPress

Чтобы просмотреть PDF, перейдите на сайт. Вот как документ будет выглядеть на демо-сайте:

Как добавить встроенный просмотр PDF в WordPress

Готово! Надеемся, что эта статья помогла вам встроить просмотр PDF на WordPress-сайт.

Источник: https://www.wpbeginner.com

Источник: oddstyle.ru

Оставьте ответ

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