Вам нужен просмотр PDF в WordPress? Формат PDF удобен, если вы хотите, чтобы файлы всегда выводились в одной и той же разметке вне зависимости от используемого устройства. Встраивание PDF позволяет вашим посетителям просматривать файлы, не покидая вашего сайта.
В этой статье мы покажем, как добавить просмотр PDF в WordPress.
Почему нужно об этом задумываться?
По умолчанию WordPress не встраивает файлы PDF в контент, как это происходит с аудио, видео, твитами и другими форматами медиа. Вы просто будете видеть ссылку на скачивание PDF.
Это означает, что вашим посетителям придется покинуть ваш сайт, чтобы посмотреть PDF. Многие из этих пользователей потом уже не вернутся на ваш сайт, что снижает количество просмотренных страниц и ухудшает вовлеченность пользователей.
Один из способов справиться с этим – предлагать PDF-файлы в контенте записей/статей. Для этого потребуется установить дополнительный плагин.
Мы будем использовать PDF Embedder, лучший на текущий момент плагин для встраивания PDF в WordPress.
Он использует JavaScript для встраивания PDF-файлов, выводя полнофункциональную панель инструментов, которая позволяет задавать зум и перемещаться по PDF. Встроенный PDF-файл полностью адаптивен, а потому его можно удобно просматривать на любом устройстве.
Для начала вам нужно будет установить и активировать плагин PDF Embedder.
После активации вы можете посетить Settings -> PDF Embedder, чтобы задать параметры плагина. Стандартные настройки подходят для большинства вебсайтов, поэтому данный шаг не является обязательным.
Вы можете задавать высоту и ширину PDF-вьювера. Вы можете корректировать эти параметры, если считаете, что инструмент просмотра слишком широкий или слишком узкий.
Есть опция, позволяющая выбирать, нужно ли отображать тулбар внизу или вверху области просмотра. Также есть вариант скрыть тулбар, пока пользователь не наведет указатель мыши на документ.
В премиум-версии плагина есть дополнительные опции: кнопка скачивания файла, непрерывная прокрутка страницы, кликабельные ссылки, а также отслеживание скачиваний.
Когда вы завершите изменять настройки, не забудьте нажать «Save Changes» для их сохранения.
Теперь мы можем встроить PDF в запись или на страницу. Все зависит от того, какой редактор вы используете – классический или блочный.
Добавляем просмотр PDF через редактор блоков
Добавление PDF-файлов к страницам или к записям – достаточно простой процесс. Начнем с того, что добавим новую запись или отредактируем уже имеющуюся.
Сначала поместите курсор в то место, где вы хотите встроить PDF-документ. Затем вам нужно будет добавить новый блок, щелкнув по кнопке «Add Block +» в верхнем левом углу экрана на странице редактирования WP.
Затем вам нужно будет нажать на кнопку PDF Embedder в секции Text.
Как только вы сделаете это, вы сможете загрузить новый PDF-файл в свою запись (или выбрать уже готовый файл из медиатеки). Вы можете сделать это, щелкнув по ссылке «Click here to Open Media Library to select PDF».
Вы попадете в медиатеку WP. Если вы еще не загружали PDF-файл, сделайте это сейчас. Просто перетащите файл в библиотеку.
PDF-файл будет автоматически загружен и выбран. Все, что вам останется сделать – щелкнуть по кнопке «Select».
Вы увидите ваш PDF-документ в контенте. Превью этого файла в редакторе не выводится. Блок будет просто содержать URL файла.
Чтобы просмотреть PDF, вам надо будет сохранить запись, после чего перейти на сайт. Вот как это выглядит на демо-сайте:
Добавляем просмотр PDF через классический редактор
Вставка PDF в классический редактор ничуть не сложнее. Просто добавляем новую запись или редактируем уже существующую.
Помещаем курсор в то место, куда мы хотим добавить PDF. Далее перетаскиваем PDF-файл на страницу.
PDF автоматически загрузится в вашу медиатеку и будет выбран. Дальше жмем на кнопку «Insert into post».
PDF Embedder добавит шорткод к вашей записи или к вашей странице. Он будет иметь следующий вид: [ pdf-embedder url=”PDFURL” ].
Чтобы просмотреть PDF, перейдите на сайт. Вот как документ будет выглядеть на демо-сайте:
Готово! Надеемся, что эта статья помогла вам встроить просмотр PDF на WordPress-сайт.
Источник: https://www.wpbeginner.com
