Intereting Posts
Отфильтруйте действие плагина в wp head / wp_footer Штрих-коды не будут работать в живой среде Как установить статус публикации для удаления? Могу ли я использовать темы WordPress без WordPress? Переопределение навигации в профиле Buddy Press Есть способ масштабировать медиа (изображения) на 50%? Что касается автоматической генерации страниц, похоже, как woocommerce генерирует «страницу магазина 2», когда доступно достаточно предметов Разрешая отдельным пользователям добавлять только сообщения, используя определенные пользовательские термины таксомии Изменение размера изображения в зависимости от ориентации? Что мне нужно для тестирования одного скрипта в admin Проблема с клонированием живого сайта WordPress на новый сайт на локальном сервере? Форма плагина неспособна обрабатывать Миграция сайта WordPress нарушила кодировку UTF8 Как получить вход редактора TinyMCE при использовании в интерфейсе? Отладочная техника Вопрос re: functions.php

Как предотвратить предварительный просмотр короткого кода от взлома редактора 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?"