Создание пользовательского шорткода для просмотра PDF в WordPress

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

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

<?php
/*
Plugin Name: My PDF Shortcode
Description: A plugin that adds a PDF viewer shortcode.
Version: 1.2
Author: Theo van der Sluijs
*/

function my_pdf_shortcode($atts) {
    $a = shortcode_atts( array(
        'id' => '',
        'width' => '100%',  // ширина
        'height' => '141.4%' // высота (A4 ratio)
    ), $atts );

    $pdf_url = wp_get_attachment_url($a['id']);

    if($pdf_url) {
        $output = '<div style="width: '.$a['width'].'; overflow: auto; position: relative; padding-top: '.$a['height'].'">
                    <object data="' . $pdf_url . '" type="application/pdf" style="position: absolute; top: 0; left: 0; height: 100%; width: 100%;">
                         <p>Похоже, у вас нет PDF-плагина для этого браузера. Ничего особенного... <a href="'.$pdf_url.'">нажмите здесь, чтобы загрузить PDF-файл.</a></p>
                    </object>
                   </div>';
    } else {
        $output = '<p>PDF не найден!</p>';
    }

    return $output;
}
add_shortcode('my_pdf', 'my_pdf_shortcode');

Давайте углубимся в код.

<?php
/*
Plugin Name: My PDF Shortcode
Description: A plugin that adds a PDF viewer shortcode.
Version: 1.2
Author: Your Name
*/

function my_pdf_shortcode($atts) {
    //...
}
add_shortcode('my_pdf', 'my_pdf_shortcode');

Приведенный выше код представляет наш плагин и объявляет вызываемую функцию my_pdf_shortcode(). Эта функция регистрируется как шорткод с помощью функции add_shortcode().

Давайте проверим внутреннюю часть функции my_pdf_shortcode().

$a = shortcode_atts( array(
    'id' => '',
    'width' => '100%',  // ширина
    'height' => '141.4%' // высота (A4 ratio)
), $atts );

Этот блок кода определяет атрибуты, которые будет принимать наш шорткод: ‘id’, ‘width’ и ‘height’. ‘id’ является обязательным атрибутом для PDF-файла из вашей медиа-библиотеки, тогда как ‘width’ и ‘height’ являются необязательными.

$pdf_url = wp_get_attachment_url($a['id']);

Здесь мы извлекаем URL-адрес PDF-файла с помощью функции wp_get_attachment_url() в WordPress и предоставленного идентификатора.

if($pdf_url) {
    //...
} else {
    $output = '<p>PDF не найден!</p>';
}

В блоке ‘if’ мы проверяем, успешно ли получен URL-адрес PDF. Если это не удается (возможно, ‘id’ неверен или PDF-файл не существует), мы выводим сообщение “PDF не найден!”

Теперь давайте заглянем внутрь блока ‘if’.

$output = '<div style="width: '.$a['width'].'; overflow: auto; position: relative; padding-top: '.$a['height'].'">
                <object data="' . $pdf_url . '" type="application/pdf" style="position: absolute; top: 0; left: 0; height: 100%; width: 100%;">
                    <p>Похоже, у вас нет PDF-плагина для этого браузера. Ничего особенного... <a href="'.$pdf_url.'">нажмите здесь, чтобы загрузить PDF-файл.</a></p>
                </object>
            </div>';

Вот где происходит волшебство. Мы создаем HTML ‘div’, в котором находится элемент ‘object’ (для PDF). К “div” применен стиль CSS, который управляет шириной, высотой, положением и поведением переполнения. “Overflow: auto;” гарантирует, что полосы прокрутки появляются, когда содержимое PDF превышает размер контейнера.

Внутри тега ‘object’ мы устанавливаем атрибут ‘data’ на URL нашего PDF-файла. В случае, если браузер не поддерживает просмотр PDF, мы включаем ссылку для загрузки PDF.

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

С помощью этого пользовательского плагина вы можете легко вставить любой PDF-файл из вашей медиатеки в свои посты или страницы WordPress с помощью простого шорткода, подобного этому: [my_pdf id=”123″ width=”50%” height=”70.7%”].

Вот и все! Теперь у вас есть пользовательский плагин WordPress, который создает шорткод для просмотра PDF. Это простое, но мощное решение может кардинально изменить правила игры для всех, кто часто публикует PDF-контент на своем сайте WordPress. Наслаждайтесь!

(1 оценок, среднее: 5,00 из 5)

Загрузка...