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

30.05.2019 От Админ 14 комментариев

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

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

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

<?php 
  $checkContent = get_the_content();
  if(!empty($checkContent)): ?>
    <div class="portfolio-content">
        <?php the_content(); ?>
    </div>
<?php endif; ?>

<?php

$checkContent = get_the_content();

if(!empty($checkContent)): ?>

<?php the_content(); ?>

</div>

<?php endif; ?>

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

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

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

<?php wp_editor( 'content' , 'editorid', array( 
    'wpautop'       =>      false,
    'media_buttons' =>      false,
    'textarea_name' =>      'editorid',
    'textarea_rows' =>      15,
    'teeny'         =>      false
)); ?>

<?php wp_editor( 'content' , 'editorid', array(

'wpautop' => false,

'media_buttons' => false,

'textarea_name' => 'editorid',

'textarea_rows' => 15,

'teeny' => false

)); ?>

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

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

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

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

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

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

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

<?php
  add_action('init','myplugin_check_editor_capabilities');

  function myplugin_check_editor_capabilities(){ 

    if(  current_user_can( 'edit_others_posts' ) ) {
      //do something
    }

 }
?>

<?php

add_action('init','myplugin_check_editor_capabilities');

function myplugin_check_editor_capabilities(){

if( current_user_can( 'edit_others_posts' ) ) {

//do something

}

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

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

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

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

//удаляем фильтр, который не позволяет вводить html-теги
remove_filter('pre_user_description', 'wp_filter_kses');

//добавляем другой фильтр, который разрешает использовать html-теги
add_filter('pre_user_description', 'wp_filter_post_kses');

//удаляем фильтр, который не позволяет вводить html-теги

remove_filter('pre_user_description', 'wp_filter_kses');

//добавляем другой фильтр, который разрешает использовать html-теги

add_filter('pre_user_description', 'wp_filter_post_kses');

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

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

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

$user = get_user_by('id', 1);;
$user_descr = $user -> description;

wpautop($user_descr, true)

$user = get_user_by('id', 1);;

$user_descr = $user -> description;

wpautop($user_descr, true)

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

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

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

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 );
}

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 );

}

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

function your_slug_add_scripts() {

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

function your_slug_add_scripts() {

wp_enqueue_script(

'your-slug-admin-script',

plugins_url( '/js/my-script.js', __FILE__ ),

array( 'jquery' ), 1.0, true

);

}

add_action( 'admin_enqueue_scripts', 'your_slug_add_scripts' );

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

(function($){ 
   // удаляем textarea
   $('#description').parents('tr').remove();
})(jQuery);

(function($){

// удаляем textarea

$('#description').parents('tr').remove();

})(jQuery);

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

Страницы: 1 2 3 4 5 6 7

Автор: Админ

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

Taras 28 декабря, 2019

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

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

// Редактор в Биографии автора
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 );
}

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

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 );

}

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

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' );

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' );

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

<span class="crayon-sy">(</span><span class="crayon-t">(function($){
   // удаляем textarea
   $('#description').parents('tr').remove();
})(jQuery);

<span class="crayon-sy">(</span><span class="crayon-t">(function($){

// удаляем textarea

$('#description').parents('tr').remove();

})(jQuery);

Ответить

Админ 2 января, 2020

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

//удаляем фильтр, который не позволяет вводить html-теги
remove_filter('pre_user_description', 'wp_filter_kses');
 
//добавляем другой фильтр, который разрешает использовать html-теги
add_filter('pre_user_description', 'wp_filter_post_kses');

//удаляем фильтр, который не позволяет вводить html-теги

remove_filter('pre_user_description', 'wp_filter_kses');

//добавляем другой фильтр, который разрешает использовать html-теги

add_filter('pre_user_description', 'wp_filter_post_kses');

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

<?php
$user_description = get_the_author_meta( 'user_description', $post->post_author );
echo "<div class='user-info'>".wpautop($user_description)."</div>";
?>

<?php

$user_description = get_the_author_meta( 'user_description', $post->post_author );

echo "<div class='user-info'>".wpautop($user_description)."</div>";

Ответить

Taras 26 декабря, 2019

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

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

Что-то не получается, та же проблема, что и писал в первом сообщении. Визуальный редактор должен быть включен? 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' );

Ответить
- Админ 22 декабря, 2019
  
  Проблема не в коде, а в подходе. И лежит она здесь:
  
  создал папку js в public_html и добавил туда файл с нужным кодом: /public_html/js/admin-script.js
  
  public_html - это корневая папка сайта, а вам нужна корневая папка темы. Она расположена по пути public_html/wp-content/themes/название_вашей_темы.
  
  Для того чтобы удостоверится, что скрипт подгрузился в вашей админ-панели, необходимо нажать Ctrl + U на странице редактирования профиля пользователя или выбрать пункт "Исходный код страницы"/"Поcмотреть код страницы" из контекстного меню по правому клику в любом месте страницы
  
  Затем нажмите CTRL+F и найдите свой скрипт на странице, введя название файла в поле поиска.
  
  Если такого файла у вас на странице нет, то, возможно, нужно перезагрузить страницу с обновлением кэша браузера (нажимаем CTRL + F5) и еще раз поискать его.
  Если js-файла опять там нет - ищите ошибку в путях подключения или размещения файла.
  
  Ответить
  - Taras 22 декабря, 2019
    
    Спасибо за подробности.
    
    А с точки зрения безопасности или каких-то других моментов, все эти изменения не отразятся в худшею стороно? Но информацию в поле "Биография" добавлять будет только я, доступ будет только у меня...
    
    Ответить
    - Админ 22 декабря, 2019
      
      Нет, то, что вы добавите, необходимо для вывода на какой-либо странице темы или внутри поста.
      Безопасность здесь вряд ли будет задета.
      Все манипуляции вы выполняете в админке, чтобы сохранить в БД не голый текст, а текст с каким-то форматированием - выделением жирным, курсивом или добавлением ссылок и т.п.
      Возможность редактировать данные всех пользователей есть только у админа, так что вряд ли стоит беспокоится.
      
      Ответить
      - Taras 23 декабря, 2019
        
        Спасибо, все заработало, но есть нюанс. Не сохраняеться и не выводиться фото в редакторе и на странице профиля автора. То есть: добавляю фото в редактор, сохраняю, а этот код пропадает в редакторе - вместо него пустота появляется:
        
        <img class="alignleft wp-image-877" src="https://site.ru/wp-content/uploads/2019/11/foto-avtor.jpg" alt="Фото-автор" width="280" height="167" />
      - Админ 25 декабря, 2019
        
        Не могу точно объяснить, в чем у вас причина, т.к. у меня все сохраняется и выводится. Скриншот:
        
        Может проблема в том, как вы это делаете?
        В обычном редакторе постов есть специальная кнопка "Добавить медиафайл", которая вызывает окно медиа-загрузчика WordPress.
        Здесь ее нет. Вместо этого вам нужно переключится в текстовый вид редактора из визуального и нажать на кнопку img.
        
        Возможно, вам стоит прочитать статью "Добавление фото пользователя в профиль WordPress" и воспользоваться кодом из нее?
Taras 17 декабря, 2019

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

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

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

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

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

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

Ответить
- Админ 18 декабря, 2019
  
  Спасибо за вопрос. Дело в том, что в описании была ошибка.
  Вы делали все правильно, но у вас не сработал последний пункт, связанный с подключением скрипта к админке 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', которая указывает путь к файлам темы. В кавычках после слеша нужно указывать те папки и файлы, которые есть в вашей теме. Или создать их по этому пути.
  
  Ответить
  - Taras 19 декабря, 2019
    
    Спасибо за ответ. А что значит "в теме"?
    
    Имейте ввиду, что, если вы подключаете скрипт в теме...
    
    Ответить
    - Админ 20 декабря, 2019
      
      В WordPress есть 2 вида расширений - плагины и темы (шаблоны). И там, и там можно подключать скрипты.
      Основным файлом темы, в котором записываются различные функции, является файл functions.php. В нем обычно нужно прописывать пути для загрузки css- и js-файлов, используя функцию get_template_directory_uri().
      В плагинах основным файлом может быть любой. Чаще всего, его имя совпадает с названием папки с плагином. Для плагина загрузку css- и js-файлов обычно выполняют с помощью функции plugins_url( '/js/my-script.js', __FILE__ ).
      
      Ответить

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

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

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

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

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

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

Вам может понравиться

Добавление меню в тему WordPress. Использование класса Walker_Nav_Menu

Создание виджета в WordPress в классическом стиле

Оптимизируем обращение к серверу за счет API Heartbeat WordPress

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

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

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