Фев
14
0

Добавляем визуальный редактор в анонсы для WordPress постов

Визуальный редактор в анонсахЧастично функцию анонсов я уже несколько раз упоминал в блоге – во-первых, вы можете глянуть хаки для ссылки читать далее по типу задания количества выводимого текста и т.п., а во-вторых, рассматривал плагин Advanced Excerpt со множеством разных настроек непосредственно в админке. Сегодня расскажу, как активировать визуальный редактор для поля анонса дабы можно легко и быстро задавать определенное оформление тексту. Для реализации задачи есть методы без плагина, но я также находил парочку модулей по теме.

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

Разумеется, такая ситуация встречается достаточно редко и нет смысла заниматься ею на кажом своем сайте. Например, я на все новые проекты ставлю плагин TinyMCE Advanced и лишь в одном из 50-ти случаев мне пригодился модуль Black Studio TinyMCE Widget, добавляющий продвинутый редактор в текстовое поле виджетов из сайдбара. Собственно, этот модуль выполняет работу аналогичную нашей сегодняшней задаче, только делает это для виджетов, а не анонсов постов.

Простой сниппет для Functions.php

Начнем с варианта без плагинов. В онлайне я находил несколько хаков, но все они достаточно древние (плюс-минус 2012 год), поэтому изначально было сложно понять какие из них все еще актуальны.

К счастью, в этом варианте оказались максимально новые комментарии пользователей за 2019-2020 год, которые сообщают, что все до сих пор отлично работает (и даже для Гутенберга).

Следующий код надо будет поместить в файл функций (functions.php) вашего шаблона:

add_action( 'add_meta_boxes', array ( 'T5_Richtext_Excerpt', 'switch_boxes' ) );
 
/**
 * Replaces the default excerpt editor with TinyMCE.
 */
class T5_Richtext_Excerpt
{
    /**
     * Replaces the meta boxes.
     *
     * @return void
     */
    public static function switch_boxes()
    {
        if ( ! post_type_supports( $GLOBALS['post']->post_type, 'excerpt' ) )
        {
            return;
        }
 
        remove_meta_box(
            'postexcerpt' // ID
        ,   ''            // Screen, empty to support all post types
        ,   'normal'      // Context
        );
 
        add_meta_box(
            'postexcerpt2'     // Reusing just 'postexcerpt' doesn't work.
        ,   __( 'Excerpt' )    // Title
        ,   array ( __CLASS__, 'show' ) // Display function
        ,   null              // Screen, we use all screens with meta boxes.
        ,   'normal'          // Context
        ,   'core'            // Priority
        );
    }
 
    /**
     * Output for the meta box.
     *
     * @param  object $post
     * @return void
     */
    public static function show( $post )
    {
    ?>
        <label class="screen-reader-text" for="excerpt"><?php
        _e( 'Excerpt' )
        ?></label>
        <?php
        // We use the default name, 'excerpt', so we don’t have to care about
        // saving, other filters etc.
        wp_editor(
            self::unescape( $post->post_excerpt ),
            'excerpt',
            array (
            'textarea_rows' => 15
        ,   'media_buttons' => FALSE
        ,   'teeny'         => TRUE
        ,   'tinymce'       => TRUE
            )
        );
    }
 
    /**
     * The excerpt is escaped usually. This breaks the HTML editor.
     *
     * @param  string $str
     * @return string
     */
    public static function unescape( $str )
    {
        return str_replace(
            array ( '&lt;', '&gt;', '&quot;', '&amp;', '&nbsp;', '&amp;nbsp;' )
        ,   array ( '<',    '>',    '"',      '&',     ' ', ' ' )
        ,   $str
        );
    }
}

Далее в админке в поле “Отрывок” (Excerpt) увидите простенький редактор с визуальной и HTML версиями.

редактор в WordPress анонсах

Из форматирования тут есть:

  • выделение жирным, курсивом, подчеркиванием;
  • вставка списков, цитат, ссылок;
  • задание выравнивания.

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

Rich Text Excerpts

Rich Text Excerpts

Здесь используется функция wp_editor, поэтому минимально допустимая версия WordPress 3.3, но думаю, она и так у всех установлена. Данное решение обновлялось последний раз 2 года назад, но, как видим по прошлому скрипту, это не критично. Здесь имеется 10тыс. скачиваний и хорошая оценка.

Функция редактора в анонсах появится сразу после активации. По умолчанию, визуально он будет мало чем отличаться от размещенного выше скриншота. Однако, вы можете сделать его более продвинутым – переходим в раздел “Настройки” – “Богатые отрывки текста” (да, название странное).

Настройки плагина Rich Text Excerpts

Тут есть много интересных параметров:

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

Модуль и сниппет я тестировал перед написанием поста – все рабочее. Для простых ситуация, когда надо просто выделять текст жирным и вставлять списки, достаточно первого хака (зачем ставить лишний плагин). Когда нужен именно полноценный визуальный редактор со всеми функциями и вставкой картинок – активируйте модуль Rich Text Excerpts.

Если знаете еще какие-то альтернативные решения – присылайте ниже. Данные анонсы/отрывки совместимы как с Гутенрбергом, так и с Elementor-редактором, поскольку относятся не к самом контенту, а скорее к доп.параметрам той или иной записи. Также следует учитывать, что анонс используйте только, когда его вывод прописан в шаблоне (через the_excerpt).

рейтинг Оцените статью:
Ужасная статьяНичего интересногоТак себеНормальноХорошоКлассный постВ закладки!
(голосов - 4, средний балл: 4,50 из 7)
Загрузка...

категория Категории: Плагины;
теги Теги: , , , , .
Оставить комментарий


Блог Wordpress Inside поможет вам научиться работать в вордпресс, закрепить и расширить имеющиеся знания. Плагины и шаблоны, разные хаки и функции wp, оптимизация и безопасность системы – все это и намного больше вы сможете найти на страницах нашего проекта!

Если хотите быстро и оперативно получать последние новости и статьи, то рекомендуем подписаться на обновления блога:

Поиск:
Последние посты
Лучшее в категории

Облако тегов
Скажи свое мнение!

В чем основные плюсы Wordpress?

Посмотреть результаты

Загрузка ... Загрузка ...
Друзья проекта
Последние новости