Обновление WordPress 6.0 – перестали работать кастомные кнопки HTML редактора QTags.addButton

Большинство обновлений, каких бы то ни было, как правило приносят неудобства. По меньшей мере приходится с чем-то смиряться, переучиваться, подстраиваться и пр. Не исключение и очередное крупное обновление WordPress 6.0.  Помимо прочего, некоторых пользователей, которые работают со старым кастомезированным текстовым редактором, ждал сюрприз, а именно пропали кастомные – дополнительные кнопки с панели HTML редактора. В общем, неприятная штука!..

 

Когда не отрабатывает QTags.addButton, обратимся к Quicktags API

 

В данном случае есть несколько вариантов решения задачи, рассмотрим их по тексту ниже:

 

 

 

 

 

 

 

 

 

как вернуть кастомные кнопки в HTML редактор после обновления WordPress 6.0 – QTags.addButton

 

 

 

Вот об этих кнопках речь. Дополнительные кнопки добавляются администратором самостоятельно. Такая возможность появилась от версии WP 3.3. Группируются данные опции в Quicktags API. Но обо всем этом в иных тематических статьях. А сегодня нам нужно решить задачу о том, как вернуть свои дополнительные кнопки в HTML редактор после обновления WordPress 6.0?

 

 

 

 

Нюансы:

 

а) если вы использовали плагин для организации дополнительных кнопок в HTML редакторе, то, предположительно, что волноваться не следует: после очередного обновления плагина кнопки вновь появятся – заработают в редакторе.

 

 

б) но если в вашем шаблоне обработка кастомных кнопок в HTML редакторе организована посредством кода и шаблон не обновляется, придется немного самостоятельно поправить php сниппет.

 

 

Организуя функциональные кастомные кнопки, обычно используют примерно такую конструкцию:

 

 

add_action('admin_print_footer_scripts', 'buttom_my_quicktags');
function buttom_my_quicktags() {
if ( wp_script_is('quicktags')) {
?><script>

QTags.addButton( 'sdrasty', 'sdrasty', 'Здравствуйте !');

</script><?php } }

 

 

После обновления WP до 6.0 данный сниппет перестанет отрабатывать, кнопки, соответственно, из html редактора пропадут.

 

 

 

чтобы восстановить привычную кнопочную работу HTML редактора, поступаем так:

 

 

Используем функцию JS:

 

 

window.addEventListener( 'DOMContentLoaded', () => {

действие

});

 

 

…привязываем данную JS функцию к уже существующей. Получится примерно так:

 

 

/*прописка кнопок в редакторе*/
add_action('admin_print_footer_scripts', 'add_my_quicktags');
function add_my_quicktags() {
if ( wp_script_is('quicktags')) {
?>
<script>
window.addEventListener( 'DOMContentLoaded', () => { // обнова ВП 6.0 = перестали выводиться дополнительные кнопки в html редакторе
QTags.addButton( 'sdrasty', 'sdrasty', 'Здравствуйте !');
QTags.addButton( 'Per', 'перенос строки', '&nbsp;\n');
});
</script>
<?php } }
/*прописка кнопок в редакторе*/

 

 

После правок – кнопки в HTML редакторе появятся и снова заработают!..

 

 

Однако, данная выше js функция успешно отработает не во всех вариантах php сниппетов.

 

 

Существует второй вариант js функции, которая поможет вернуть кастомные кнопки в html редактор:

 

 

Теперь поработаем с такой функцией JS:

 

 

window.onload=function() {

действие

}

 

 

 

 

Ниже дан рабочий пример кода, при помощи которого в HTML редактор будет встроена кнопка добавления видеоролика YouTube:

 

 

/*КНОПКА ВИДЕО youtube*/
add_action( 'admin_print_footer_scripts', 'ats_html_button_class' );
function ats_html_button_class() {
if ( wp_script_is( 'quicktags' ) ) {
?>
<script>
window.onload=function() { // после обновы ВП 6.0 = перестали выводиться кнопки в html редакторе
QTags.addButton( 'my_prompt', 'YouTube Видео', div_class);
function div_class() {
var new_class = prompt( 'Добавьте финал ссылки видео с YouTube Пример: https://www.youtube.com/embed/это: 21UFzStx1gM', 'замените на свою: 21UFzStx1gM' );
if ( new_class ) { QTags.insertContent('<div class="teni-too"><iframe style="border:0" src="https://www.youtube.com/embed/' + new_class + '?feature=oembed=0&amp;showinfo=0" width="auto" allowfullscreen="allowfullscreen"></iframe></div>');
} } }
</script>
<?php
} }
/*КНОПКА ВИДЕО*/

 

 

Функцию window.onload=function() в код для примера я уже добавил. То есть код совершенно рабочий и в WP 6.0. Изучите внимательно сниппет и, по требованию, реализуйте у себя.

 

 

 

 

 

Если возникнут какие-то вопросы, опишите их в комментариях, или в форме обратной связи. Решим все закавыки…

 

 

А также подписывайтесь на наш новый канал Телеграм – много нового и полезного:

 

 

обсуждаем, общаемся, вопросы в чате Телеграм запросто с WordPress ATs media squad

 

 

 

 

 

 

На этом у меня на сегодня все!.. Удачи и будьте здоровы!..