Стилизация ссылок на страницы в постах WordPress

Последнее обновление Авг 9, 2022

Содержание

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

Обзор

Сообщения можно разбить на страницы, введя  Quicktag при написании содержимого сообщения, чтобы указать, что содержимое, следующее за тегом, должно быть помещено на новую страницу. Затем ссылки генерируются с помощью функции wp_link_pages, которая создает разбиение на страницы содержимого публикации.

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

Инициализация

Мы можем вызвать wp_link_pagesфункцию в нашей теме WordPress, включая наши классы CSS, готовые к стилизации следующим образом:

<?php
    wp_link_pages(
        'before' => '<div class="nextpages">'. esc_html__( 'Next Pages:', 'startfunction' ),
        'after' => '</div>',
        'pagelink' => '<span class="pagelink">%</span>'
    );

Фильтрация

Что произойдет, если мы используем дочернюю тему? если он правильно построен get_template_part, мы можем скопировать файл в нашу дочернюю тему и повторно инициализировать функцию с правильными значениями.

Хорошей альтернативой было бы использование фильтра wp_link_pages_argsдля переопределения инициализации wp_link_pagesфункции. Мы можем добавить следующий код в файл functions.php нашей дочерней темы:

<?php
function startfunction_link_pages( $r) {
    $args = array(
        'before' => '<div class="nextpages">'. esc_html__( 'Next Pages:', 'startfunction' ),
        'after' => '</div>',
        'pagelink' => '<span class="pagelink">%</span>'
    );
    return wp_parse_args( $args, $r );

    }
add_filter( 'wp_link_pages_args','startfunction_link_pages' );

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

Источник записи: startfunction.com