В этой статье вы найдете ряд полезных мелочей, которые вам могут пригодится при создании новой или дочерней темы WordPress.
Как проверить, есть ли контент в записи/на странице
За вывод содержимого записи или страницы WordPress отвечает функция the_content(). Если автор не заполнил текст записи, мы можем проверить это с помощью такого кода:
| 1 2 3 4 5 6 7 | <?php $checkContent = get_the_content(); if(!empty($checkContent)): ?> <div class="portfolio-content"> <?php the_content(); ?> </div> <?php endif; ?> |
В переменную $checkContent попадет контент текущего поста, который выводится либо в цикле WP, либо на странице single.php. В зависимости от того, есть контент или нет, мы отобразим или спрячем определенный блок. Это удобно делать с произвольными типами постов, которые выводятся на одну страницу, например, на Landing Page или на страницу резюме.
Использование классического редактора WordPress (TinyMCE) для произвольных полей
Произвольные поля - очень интересная возможность WP для создания дополнительных атрибутов, выводимых на страницах или в записях. Чаще всего для них создают текстовое поле (<input type="text">) или текстовую область (<textarea>), но в ряде случаев бывает значительно удобнее писать текст в стандартном текстовом редакторе WordPress. Тогда вам стоит воспользоваться функцией wp_editor() с такими параметрами:
| 1 2 3 4 5 6 7 | <?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':
| 1 2 3 4 5 6 7 8 9 10 11 | <?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-х строчек:
| 1 2 3 4 5 | //удаляем фильтр, который не позволяет вводить html-теги remove_filter('pre_user_description', 'wp_filter_kses'); //добавляем другой фильтр, который разрешает использовать html-теги add_filter('pre_user_description', 'wp_filter_post_kses'); |
После этого изменим текст, добавив выделение жирным, курсивом и ссылки:
Результат будет уже другим:
Для того чтобы вывод текста был разбит на абзацы, необходимо в теме на странице одиночного поста (single.php) или страницы (page.php) записать примерно такой код:
| 1 2 3 4 | $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() необходимо указать ряд параметров, которые позволят вывести определенные кнопки в редакторе.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | 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:
| 1 2 3 4 5 6 7 8 9 | 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 записываем небольшой код:
| 1 2 3 4 | (function($){ // удаляем textarea $('#description').parents('tr').remove(); })(jQuery); |
В этой статье вы можете прочитать про добавление визуального редактора к комментариям WordPress.
Этого wp_kses() не нашел у себя.
Код вот такой у меня functions.php:
// Редактор в Биографии автора 2
В файле admin-script.js такой код:
Жаль, Taras, что вы не удосужились посмотреть на код чуть выше в этой же статье. Там как раз описывается вариант, когда в стандартном поле ввода для биографических данных (описания) пользователя не сохраняются html-теги.
Там отменяется функция, подобная
wp_kses():При выводе информации о пользователе на странице поста можно также воспользоваться функцией wpautop():
Я пробовал разными путями добавлять фото и как вы описали, но всеравно не получаеться. А может это из за того, что у меня https а не http?
Думаю, что https здесь ни при чем. Этот протокол автоматически подтянется в ссылку на изображение, когда вы его загрузили через медиа-загрузчик. Если, разумеется, у вас правильно настроен https на сайте и в админке, хоть это дело и несложное. В конце концов, кто мешает сделать ссылку вида
//site.ru/wp-content/uploads/2019/11/foto-avtor.jpg, не вводя в нее протокол. Или еще меньше/wp-content/uploads/2019/11/foto-avtor.jpg?Есть вероятность, что где-то в коде при обработке вывода вашей информации есть функция типа wp_kses(), для которой запрещена обработка тега![]()
. А может, вы где-то допустили ошибку. Но точно можно сказать, только заглянув в код.
Что-то не получается, та же проблема, что и писал в первом сообщении. Визуальный редактор должен быть включен? 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' );
Проблема не в коде, а в подходе. И лежит она здесь:
public_html- это корневая папка сайта, а вам нужна корневая папка темы. Она расположена по пути public_html/wp-content/themes/название_вашей_темы.Для того чтобы удостоверится, что скрипт подгрузился в вашей админ-панели, необходимо нажать 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" и воспользоваться кодом из нее?
Здравствуйте.
У меня вопрос по этой теме: Использование классического редактора 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__ ).