Убираем теги <p> из текста и изображений в WordPress

Убираем теги <p> из текста и изображений в WordPress

Когда мы набираем текст, добавляем изображение или вставляем код в визуальном редакторе TinyMCE, WordPress по умолчанию вставляет теги <p></p> после каждого переноса строки. Это очень удобная функция, она облегчает написание статьи, автоматически разделяя текст на абзацы. Но иногда автодобавление тегов искажает отображение кода, текста или изображений, как бы вы не редактировали свою статью WordPress все-равно будет обрамлять содержимое в тег <p>, но это ограничение можно обойти.

Убираем теги <p> с помощью редактора TinyMCE.

Разверните окно выбора типа шрифта в визуальном редакторе и нажмите строку «Отформатированный». Это самый простой способ, но в основном, он подходит для вставки кода в статью, так как оборачивает содержимое в тег <pre>.

Отключаем автоформатирование в визуальном редакторе WordPress.

Если вы решили полностью отключить автоформатирование в визуальном редакторе TinyMCE и решили добавлять их вручную, то добавьте в файл functions.php следующий PHP-код:

Отключаем автоматическое добавление тега <p> в статье.

/* Disable auto-add tags in the post */ 
remove_filter( 'the_content', 'wpautop' );

Отключаем автоматическое добавление тега <p> в анонсе.

/* Disable auto-tagging in the announcement */
remove_filter( 'the_excerpt', 'wpautop' );

Полностью отключать автоформатирование лучше в самом начале создания сайта, иначе все ваши предыдущие статьи лишатся тегов.

Убираем теги <p> из изображений.

WordPress автоматически обрамляет в теги <p> не только текст, но и изображения. Если вам понадобится задать своим изображениям определенный стиль, а теги <p> мешают этому, то разместите в файле functions.php следующий PHP-код:

/* Remove the <p> tag from images */
function img_unautop($pee) {
    $pee = preg_replace('/<p>\\s*?(<a .*?><img.*?><\\/a>|<img.*?>)?\\s*<\\/p>/s', '<figure>$1</figure>', $pee);
    return $pee;
}
add_filter( 'the_content', 'img_unautop', 30 );

При добавлении этого кода, все изображения будут расположены внутри тега <figure>. Его можно заменить на <div class="figure">$1</div> если вы не используете HTML5. Также этот код убирает теги <p> в ссылках, которые вставлены отдельной строкой после переноса .

Плагин для частичного отключения автоматического форматирования.

Плагин Raw HTML позволяет отключить автоматическое создание абзацев и кавычек в визуальном редакторе WordPress с помощью тега raw. После установки плагина, переключитесь в текстовый редактор HTML и оберните тегами [ raw]...[/raw] или <!--raw-->...<!--/raw--> ту часть содержимого, где вам необходимо отключить автоформатирование (при копировании уберите все пробелы и точки). Последний способ вставки тега не будет виден посетителям если вы решите деактивировать Raw HTML. Плагин отлично подойдет тем, кто не желает полностью отключать автоформатирование.

Частичное отключение автоформатирования без плагина.

Плагин Raw HTML очень удобно использовать, но можно обойтись и без него, если воспользоваться функцией отключения автоформатирования. Вставьте этот код в файл functions.php.

/**
 * Disable autotop in content and create the shortcode.
 */
function my_formatter($content) {
       $new_content = '';
       $pattern_full = '{(\[raw\].*?\[/raw\])}is';
       $pattern_contents = '{\[raw\](.*?)\[/raw\]}is';
       $pieces = preg_split($pattern_full, $content, -1, PREG_SPLIT_DELIM_CAPTURE);

       foreach ($pieces as $piece) {
               if (preg_match($pattern_contents, $piece, $matches)) {
                       $new_content .= $matches[1];
               } else {
                       $new_content .= wptexturize(wpautop($piece));
               }
       }

       return $new_content;
}

remove_filter('the_content', 'wpautop');
remove_filter('the_content', 'wptexturize');

add_filter('the_content', 'my_formatter', 99);
}

Теперь переключитесь в текстовый редактор HTML и оберните тегами [ raw]…[/raw] необходимый участок контента (при копировании тега raw уберите пробелы и точки).

Новый способ.

Благодаря новому редактору Gutenberg статью можно разделить на блоки с различным содержимым, в том числе создать блок с произвольным HTML в котором не будут автоматически добавляться открывающие и закрывающие теги.

При создании блока выберете «Добавить произвольный HTML» или «Редактировать как HTML», после редактирования нажмите Сохранить как HTML. 

убрать теги p gutenberg
СтраUz
Читайте также
Привет! Я Натали Мамбетова.

Занимаюсь разработкой сайтов, блогов, интернет-магазинов, лендингов на WordPress. Оказываю платные помощь и консультации. Являюсь сертифицированным партнером TemplateMonster по CMS системе WordPress, имею сертификат этой компании подтверждающий мои навыки в работе с данной системой.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

© СтраUz 2018. Все права защищены. Копирование разрешено только с указанием гиперссылки на источник.
Сделано с ❤
Заказать сайт