Intereting Posts
Архив в боковой панели с выпадающим списком Year-Month-Day Как настроить таргетинг на детей дочерних страниц Как реализовать баннер в WordPress, который является исходным UTM, автоматически изменяется в соответствии с URL-адресом страницы Как разрешить пользователю выполнять поиск более чем с одним тегом Передача различного контента в шаблонные части Как создать почтовую очередь с помощью функции mail () php Лучший способ разработать новую тему на живом сайте, с новым контентом? Shortcode плагина не будет работать в файле настраиваемого шаблона Сортировка столбца по мета-ключу и мета-значению WordPress работает SQL-запрос для обновления базы данных из формы Как добавить пользовательский CSS и файл JavaScript для панели управления wp-admin (backend) Лучшее изображение, не показывающееся на wordpress, размещенном под Amazon AWS У меня есть около 404 по ссылке rel = alternate json + oembed, как ее исправить? get_users с сериализованной пользовательской метаоценкой Установите количество продукта woocommerce на странице посещений

Как предотвратить предварительный просмотр короткого кода от взлома редактора tinymce?

Я создаю визуальный предварительный просмотр для коротких кодов (точно так же, как подписи). У меня не большая часть частей, но мой предварительный просмотр html разрывается редактором при сохранении сообщения.

Я исследую его дальше и постараюсь предоставить как можно больше информации.

Замена короткого кода

Я BeforeSetContent событию BeforeSetContent . Вот как выглядит обратный вызов события

 //replace from shortcode to an image placeholder editor.on('BeforeSetcontent', function(event){ if ( event.format !== 'raw' ) { console.log(event.content); // log before shortcode replacement event.content = replaceShortcodes( event.content ); console.log(event.content); // log after shortcode replacement } }); 

Ниже приведены некоторые журналы и наблюдения, которые я сделал

Итак, из журнала перед заменой shrotcode. Я заметил что-то странное. Возьмите, например, короткий код.

Если у меня есть такой короткий код:

 [shortcode attr1="my attr" attr2="my attr 2"] a bunch of contents <h1>A h1 tag</h1> [/shortcode] 

В журнале это становится

 <p>[shortcode attr1="my attr" attr2="my attr 2"]</p> <p>a bunch of conents</p> <h1>A h1 tag</h1> <p>[/shortcode]</p> 

Обратите внимание , как тег короткого кода обернут тегами <p></p> . Я предполагаю , что в каждую строку короткого кода добавляются линейные тормоза, поэтому добавляются теги <p> . Но не могу понять откуда!

Итак, мне было любопытно, как выглядит контент для заголовка wp. И уверен, что надпись не имеет этой проблемы.

пример

 <img class="size-full wp-image-205" src="http://localhost/l/factory/wp-content/uploads/sites/2/10882100_885482111484562_5965805158604571190_n.jpg" alt="khkjh" height="389" width="370"> khkjh 

Функция для преобразования и восстановления короткого кода и предварительного просмотра HTML (упрощена)

Это функция, используемая для преобразования и восстановления коротких кодов.

 function replaceShortCodes(content){ content = content.replace( /\[block([^\]]*)\]([^\]]*)\[\/block\]/g, function( all, attr, con) { return html_block( 'block', attr , con); // returns html content }); return content; } function restoreShortcodes(content ) { var $tmp = jQuery('<div>', { html: content }); $tmp.find('.content-block').each(function () { var $this = jQuery(this); var attr = decodeURIComponent($this.data('sh-attr')); var content = decodeURIComponent($this.data('sh-content')); var shortcode = '[block' + attr + ']' + content + '[/block]'; $this.replaceWith(shortcode); }); content = $tmp.html(); return content; } 

Теперь, Как предотвратить tinymce, чтобы обернуть вокруг тегов <p> по короткому коду?

Solutions Collecting From Web of "Как предотвратить предварительный просмотр короткого кода от взлома редактора tinymce?"