Вы здесь: Главная » Wordpress » Полезные мелочи для тем и плагинов на WordPress

Полезные мелочи для тем и плагинов на WordPress

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

Как проверить, есть ли контент в записи/на странице

За вывод содержимого записи или страницы WordPress отвечает функция the_content(). Если автор не заполнил текст записи, мы можем проверить это с помощью такого кода:

В переменную $checkContent попадет контент текущего поста, который выводится либо в цикле WP, либо на странице single.php. В зависимости от того, есть контент или нет, мы отобразим или спрячем определенный блок. Это удобно делать с произвольными типами постов, которые выводятся на одну страницу, например, на Landing Page или на страницу резюме.

Использование классического редактора WordPress (TinyMCE) для произвольных полей

Произвольные поля - очень интересная возможность WP для создания дополнительных атрибутов, выводимых на страницах или в записях. Чаще всего для них создают текстовое поле (<input type="text">) или текстовую область (<textarea>), но в ряде случаев бывает значительно удобнее писать текст в стандартном текстовом редакторе WordPress. Тогда вам стоит воспользоваться функцией wp_editor() с такими параметрами:

Обращу внимание на параметр 'wpautop'. Со значением  false он добавляет html-разметку в виде абзацев, что важно при сохранении произвольных полей, текст которых вы хотите представит на сайте с привычным форматированием. Если же вы оставите там значение true, то в html-редакторе будут присутствовать любые теги (<h2>, <strong>, <em>), но не <p>. Соответственно, при сохранении, разбивка на абзацы не будет учтена, и на сайте текст выведется сплошным блоком.

Например, у нас есть некое поле Portfolio Description и в нем - ряд абзацев.

wp-editor в произвольном поле

Так выглядит текст в виде html-разметки в произвольном поле с редактором.

разметка с помощью абзацев

Если же значение параметра 'wpautop' будет равно true, разбивка на абзацы будет видна в редакторе, но не сохранится в базу данных. Сравните скриншоты выше и ниже этого абзаца.

значение wpautop true

Исправление ошибки "Call to undefined function wp_get_current_user()"

Опишем ситуацию появления ошибки Fatal error: Call to undefined function wp_get_current_user() - она возникает, когда вы пытаетесь записать какой-либо код, который проверяет права пользователя на выполнение каких-либо  действий вне кода функции, привязанной к хуку WordPress.

fatal error при вызове функции urrent_user_can()Этот код выполняется раньше, чем ядро WordPress загрузит нужные для обработки пользовательских разрешений файлы и функции. Поэтому самым простым выходом является запись нужного вам кода при вызове хука 'init':

Добавление поддержки html-тегов в профиле пользователя

В обычном виде профиль пользователя позволяет вывести только текст, в котором нет таких очень популярных тегов, как <strong>, <em>, <a>, т.к. при попытке добавить их и сохранить изменения в профиле, специальный фильтр WordPress очистит наше форматирование. Поэтому  информация о пользователе выглядит скучно.

Обычное форматирование биографии пользователя

Кроме того, при выводе текста не сохраняются абзацы, которые видны в текстовом поле биографии в профиле.

Вывод биографии на сайте

Добавить форматирование с помощью html-тегов в описании пользователя мы можем с помощью всего 2-х строчек:

После этого изменим текст, добавив выделение жирным, курсивом и ссылки:

Биография пользователя с html-тегами

 

Результат будет уже другим:

Вывод биографии на сайте c html-тегами

Для того чтобы вывод текста был разбит на абзацы, необходимо в теме на странице одиночного поста (single.php) или страницы (page.php) записать примерно такой код:

Вы можете получить информацию о пользователе и другим способом, например, с помощью функции wp_get_current_user() или get_the_author_meta(). А функция wpautop() выполнит разбивку на абзацы.

Использование классического редактора WordPress (TinyMCE) для редактирования биографии пользователя в его профиле

Добавить редактор для записей или произвольных полей можно с помощью функции wp_editor().  Для этого необходимо добавить несколько фильтров и хуков.  При вызове функции wp_editor() необходимо указать ряд параметров, которые позволят вывести определенные кнопки в редакторе.

Для  того чтобы отключить вывод <textarea id="description">, которая выводится для заполнения биографии пользователя по умолчанию, необходимо подключить еще простой скрипт. Добавляем скрипт для админки WP:

В файле my-script.js записываем небольшой код:

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

14 комментариев

  1. Здравствуйте.

    У меня вопрос по этой теме: Использование классического редактора WordPress (TinyMCE) для редактирования биографии пользователя в его профиле.

    Делал все как вы написали:

    Я добавил в файл functions.php код - https://ibb.co/dft26fz
    Создал в public_html файл - my-script.js и добавил туда код

    Но в админки все криво, два редавтора появилось - https://ibb.co/KFPk7vZ и https://ibb.co/gFRksz6

    В чем может быть причина? Спасибо.

    • Спасибо за вопрос. Дело в том, что в описании была ошибка.
      Вы делали все правильно, но у вас не сработал последний пункт, связанный с подключением скрипта к админке WordPress, т.к. именно там была ошибка.
      Последовательность действительно такова: сначала стандартный вид Биографии - https://prnt.sc/qcpoit, затем измененный с помощью фильтров, но нерабочий - https://prnt.sc/qcpr09.
      Ошибка была в 9-й строке - вместо
      add_action( 'admin_enqueue_scripts', 'your_slug_add_scripts' ); //подключает скрипт к админке
      было написано
      add_action( 'wp_enqueue_scripts', 'your_slug_add_scripts' ); //подключает скрипт к сайту (фронтэнду)
      После того, как вы это исправите и добавите скрипт с нужным кодом, должно все получится (https://prnt.sc/qcpz45)
      Имейте ввиду, что, если вы подключаете скрипт в теме, то вместо функции plugins_url( '/js/my-script.js', __FILE__ ) вам нужно использовать функцию get_template_directory_uri(). '/js/admin-script.js', которая указывает путь к файлам темы. В кавычках после слеша нужно указывать те папки и файлы, которые есть в вашей теме. Или создать их по этому пути.

      • Спасибо за ответ. А что значит "в теме"?

        Имейте ввиду, что, если вы подключаете скрипт в теме...

        • В WordPress есть 2 вида расширений - плагины и темы (шаблоны). И там, и там можно подключать скрипты.
          Основным файлом темы, в котором записываются различные функции, является файл functions.php. В нем обычно нужно прописывать пути для загрузки css- и js-файлов, используя функцию get_template_directory_uri().
          В плагинах основным файлом может быть любой. Чаще всего, его имя совпадает с названием папки с плагином. Для плагина загрузку css- и js-файлов обычно выполняют с помощью функции plugins_url( '/js/my-script.js', __FILE__ ).

  2. Что-то не получается, та же проблема, что и писал в первом сообщении. Визуальный редактор должен быть включен? https://ibb.co/rQTJx0B

    Делал все так же:

    добавил код ниже в functions.php
    создал папку js в public_html и добавил туда файл с нужным кодом: /public_html/js/admin-script.js
    сделал путь до файла js: get_template_directory_uri( '/js/admin-script.js' ),

    // Редактор в Биографии автора
    add_filter( 'get_the_author_description', 'wptexturize' );
    add_filter( 'get_the_author_description', 'convert_chars' );
    add_filter( 'get_the_author_description', 'wpautop' );
    add_action( 'show_user_profile', 'your_slug_add_editor' );
    add_action( 'edit_user_profile', 'your_slug_add_editor');

    function your_slug_add_editor($user ){
    if ( !current_user_can('edit_users') ) return;
    $settings = array(
    'media_buttons'=>0,
    'textarea_name'=>'description',
    'quicktags'=>1,
    'teeny'=>0,
    'tinymce'=> 1,
    'textarea_rows'=>14,
    );

    $description = get_user_meta( $user->ID, 'description', true);
    wp_editor( $description, 'description', $settings );
    }
    function your_slug_add_scripts() {

    wp_enqueue_script(
    'your-slug-admin-script',
    get_template_directory_uri( '/js/admin-script.js' ),
    array( 'jquery' ), 1.0, true
    );
    }
    add_action( 'admin_enqueue_scripts', 'your_slug_add_scripts' );

    • Проблема не в коде, а в подходе. И лежит она здесь:

      создал папку js в public_html и добавил туда файл с нужным кодом: /public_html/js/admin-script.js

      public_html - это корневая папка сайта, а вам нужна корневая папка темы. Она расположена по пути public_html/wp-content/themes/название_вашей_темы.
      Путь к папке темы в проводнике Windows
      Для того чтобы удостоверится, что скрипт подгрузился в вашей админ-панели, необходимо нажать Ctrl + U на странице редактирования профиля пользователя или выбрать пункт "Исходный код страницы"/"Поcмотреть код страницы" из контекстного меню по правому клику в любом месте страницы
      Показать код страницы
      Затем нажмите CTRL+F и найдите свой скрипт на странице, введя название файла в поле поиска.
      Поиск скрипта в коде
      Если такого файла у вас на странице нет, то, возможно, нужно перезагрузить страницу с обновлением кэша браузера (нажимаем CTRL + F5) и еще раз поискать его.
      Если js-файла опять там нет - ищите ошибку в путях подключения или размещения файла.

      • Спасибо за подробности.

        А с точки зрения безопасности или каких-то других моментов, все эти изменения не отразятся в худшею стороно? Но информацию в поле "Биография" добавлять будет только я, доступ будет только у меня...

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

          • Спасибо, все заработало, но есть нюанс. Не сохраняеться и не выводиться фото в редакторе и на странице профиля автора. То есть: добавляю фото в редактор, сохраняю, а этот код пропадает в редакторе - вместо него пустота появляется:

            <img class="alignleft wp-image-877" src="https://site.ru/wp-content/uploads/2019/11/foto-avtor.jpg" alt="Фото-автор" width="280" height="167" />

          • Не могу точно объяснить, в чем у вас причина, т.к. у меня все сохраняется и выводится. Скриншот:
            Фото в редакторе
            Может проблема в том, как вы это делаете?
            В обычном редакторе постов есть специальная кнопка "Добавить медиафайл", которая вызывает окно медиа-загрузчика WordPress.
            Здесь ее нет. Вместо этого вам нужно переключится в текстовый вид редактора из визуального и нажать на кнопку img.
            Добавление фото в редакторе
            Возможно, вам стоит прочитать статью "Добавление фото пользователя в профиль WordPress" и воспользоваться кодом из нее?

  3. Я пробовал разными путями добавлять фото и как вы описали, но всеравно не получаеться. А может это из за того, что у меня https а не http?

    • Думаю, что https здесь ни при чем. Этот протокол автоматически подтянется в ссылку на изображение, когда вы его загрузили через медиа-загрузчик. Если, разумеется, у вас правильно настроен https на сайте и в админке, хоть это дело и несложное. В конце концов, кто мешает сделать ссылку вида //site.ru/wp-content/uploads/2019/11/foto-avtor.jpg, не вводя в нее протокол. Или еще меньше /wp-content/uploads/2019/11/foto-avtor.jpg?

      Есть вероятность, что где-то в коде при обработке вывода вашей информации есть функция типа wp_kses(), для которой запрещена обработка тега . А может, вы где-то допустили ошибку. Но точно можно сказать, только заглянув в код.

  4. Этого wp_kses() не нашел у себя.

    Код вот такой у меня functions.php:

    // Редактор в Биографии автора 2

    В файле admin-script.js такой код:

    • Жаль, Taras, что вы не удосужились посмотреть на код чуть выше в этой же статье. Там как раз описывается вариант, когда в стандартном поле ввода для биографических данных (описания) пользователя не сохраняются html-теги.
      Там отменяется функция, подобная wp_kses():

      При выводе информации о пользователе на странице поста можно также воспользоваться функцией wpautop():

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *