Незалежно від того, що ви налаштували як дійсних дітей, WordPress дуже унікальним чином обробляє теги p, а також розриви рядків. Ви, мабуть, помітите, якщо ви ще цього не зробили, що при переході з текстового редактора на візуальний редактор і назад ваші <p>теги позбавляються, як це відбувається на фронталі. Спосіб заблокувати це - це надання <p>тегам користувацького класу.
<p class="text">This p tag won't get removed"</p>.
Незважаючи на те, що ↑ цей ↑ не дозволить вам позбавитись вашого тегу p, він не виправить вашу проблему, оскільки розмітка на передній панелі все-таки заглушиться. Ви можете DISABLE wpautop. Якщо ви це зробите І ви включили p у дійсних дітей, це ВІДКРИТИ ВАШ ІСУС .
ВАРІАНТ 1: Вимкнути автозапуск та встановити дійсні діти
remove_filter( 'the_content', 'wpautop' );
add_filter('tiny_mce_before_init', 'modify_valid_children', 99);
function modify_valid_children($settings){
$settings['valid_children']="+a[div|p|ul|ol|li|h1|span|h2|h3|h4|h5|h5|h6]";
return $settings;
}
Я хотів би попередити вас, що після другого переходу з редактора HTML на TinyMCE ваш HTML буде знищений. Вирішення проблеми полягає в тому, щоб повністю відключити TinyMCE для певних типів публікацій, як у варіанті 2 нижче.
ВАРІАНТ 2: Вимкнути автоматичну функцію P, TinyMCE та встановити дійсні діти
remove_filter( 'the_content', 'wpautop' );
add_filter('tiny_mce_before_init', 'modify_valid_children', 99);
function modify_valid_children($settings){
$settings['valid_children']="+a[div|p|ul|ol|li|h1|span|h2|h3|h4|h5|h5|h6]";
return $settings;
}
add_filter('user_can_richedit', 'disable_wyswyg_to_preserve_my_markup');
function disable_wyswyg_to_preserve_my_markup( $default ){
if( get_post_type() === 'post') return false;
return $default;
}
Для більшості людей, хоча ↑ це ↑ не є варіантом.
То які ще варіанти є? Одне вирішення, яке я помітив, - це використовувати тег "span" з класом та переконайтесь, що між вашими HTML-тегами немає пробілу . Якщо ви це зробите, ви можете скористатися варіантом один вище і уникнути необхідності відключити TinyMCE всі разом. Просто пам’ятайте, що вам також доведеться додати трохи CSS до таблиці стилів, щоб правильно відобразити проміжок.
ВАРІАНТ 3: Варіант 1 + Стильові теги Span
HTML
<a href="#"><img src="https://placehold.it/300x200?text=Don%27t+P+On+Me" alt="" /><span class="noautop">Some amazing descriptive text</span></a>
CSS в таблиці стилів
.noautop {
display: block;
}
Варіант 4: Використовуйте вбудований у медіа короткий код завантажувача
Я спочатку забув цей, але короткий код [заголовка] виглядатиме так:
[caption id="attachment_167" align="alignnone" width="169"]
<img class="size-medium wp-image-167" src="http://example.com/example.png" alt="" width="169" height="300" />
awesome caption
[/caption]
Вихід буде виглядати приблизно так:
<figure id="attachment_167" style="width: 169px" class="wp-caption alignnone">
<img class="size-medium wp-image-167" src="http://example.com/example.png" alt="" width="169" height="300" />
<figcaption class="wp-caption-text">Some amazing descriptive text</figcaption>
</figure>
Якщо ви не хочете тегів для фігур, ви можете використовувати плагін, наприклад, шорт-код спеціального вмісту, який дозволяє вам це зробити:
[raw] <p>this content will not get filtered by wordpress</p> [/raw]
Чому редактор не може працювати так, як я хочу?
Я витратив незліченну кількість годин, намагаючись змусити це добре працювати за останні пару років. Іноді я придумаю рішення, яке ідеально працює, але тоді WordPress підштовхне оновлення, яке все зіпсує знову. Єдине рішення, яке я коли-небудь знайшов, щоб повністю працювати як слід, приводить мене до найкращої відповіді.
Варіант 5: Збережена розмітка HTML-редактора Plus
Тож збережіть собі головний біль і просто вирушайте з цим. За замовчуванням збережена HTML-редактор розмітки плюс впливає лише на нові сторінки. Якщо ви хочете змінити вже створені сторінки, вам потрібно перейти на www.example.com/wp-admin/options-writing.php і відредагувати параметри плагіна. Ви також зможете змінити поведінку нового рядка за замовчуванням.
Примітка. Якщо ви вирішили скористатися цим, переконайтеся, що ви перевіряєте потік підтримки, коли запускається нове оновлення WordPress. Іноді зміна може зіпсувати речі, тому краще переконатися, що плагін працює на новіших версіях.
Додатковий кредит: налагодження вашої проблеми / редагування інших параметрів TinyMCE
Якщо ви хочете перевірити та легко редагувати свої конфігурації TinyMCE вручну, як це робиться з фільтрами, ви можете встановити розширений конфігурацію TinyMCE . Це дозволяє переглядати ВСІ налаштовані параметри TinyMCE та редагувати їх із простого інтерфейсу. Ви також можете додавати нові параметри так само, як і з фільтрами. Це робить речі набагато простішими для розуміння.
Наприклад, у мене є це і збережений HTML-редактор Markup Plus. Знімок екрана нижче - це адміністратор сторінки Advanced TinyMCE Config. Хоча на скріншоті обрізається 90% того, що є насправді, ви можете бачити, що він показує дійсні діти, доступні для редагування, а також які додані збережені HTML-редактори HTML .
Це надзвичайно корисний спосіб не лише повністю налаштувати редактор, але і побачити, що відбувається. Можливо, ви навіть зможете розібратися, що було причиною вашої проблеми тоді. Після перегляду самих параметрів під час увімкнення розмітки збереженого HTML-редактора я побачив додаткові параметри, які можна додати до спеціального фільтра.
function fix_tiny_mce_before_init( $in ) {
// You can actually debug this without actually needing Advanced Tinymce Config enabled:
// print_r( $in );
// exit();
$in['valid_children']="+a[div|p|ul|ol|li|h1|span|h2|h3|h4|h5|h5|h6]";
$in[ 'force_p_newlines' ] = FALSE;
$in[ 'remove_linebreaks' ] = FALSE;
$in[ 'force_br_newlines' ] = FALSE;
$in[ 'remove_trailing_nbsp' ] = FALSE;
$in[ 'apply_source_formatting' ] = FALSE;
$in[ 'convert_newlines_to_brs' ] = FALSE;
$in[ 'verify_html' ] = FALSE;
$in[ 'remove_redundant_brs' ] = FALSE;
$in[ 'validate_children' ] = FALSE;
$in[ 'forced_root_block' ]= FALSE;
return $in;
}
add_filter( 'tiny_mce_before_init', 'fix_tiny_mce_before_init' );
На жаль, цей метод не спрацював. Ймовірно, є якийсь регулярний вираз або JavaScript, який відбувається під час оновлення публікації та / або переходу між редакторами. Якщо ви подивитеся на вихідний код збереженого HTML-редактора, ви можете побачити, що він працює з деякими JavaScript на стороні адміністратора, тому моїм останнім порадою буде перевірити, як працює плагін, якщо ви хочете додати цю функціональність у свою тему.
У всякому разі, вибачте за всіх, хто так далеко потрапив у моїй відповіді. Я просто подумав, що я поділюсь власним досвідом роботи з редактором WordPress, тому іншим, сподіваємось, не доведеться витрачати години на те, щоб зрозуміти це, як я!