Остановить WordPress от оборачивания изображений в тег "P"

По сути, вам нужно заставить WordPress рассматривать img как блочный элемент для целей форматирования. Такие элементы жёстко зашиты в wpautop(), и, к сожалению, этот список не фильтруется.

Что я бы сделал:

1. Создал форк функции wpautop() под другим именем.
2. Добавил img в регулярное выражение в переменной $allblocks.
3. Удалил wpautop из фильтра the_content.
4. Добавил свою версию функции в фильтр the_content.
5. Возможно, придётся поиграть с приоритетом и, возможно, удалить и заново добавить другие фильтры, если что-то сломается из-за изменения порядка обработки.

возможно, это поможет

remove_filter('the_content', 'wpautop')

Но тогда вам придется добавлять абзацы для всего остального вручную.

Этот пост немного устарел, но есть гораздо более простое решение, если не использовать CSS на вашей стороне.

Обертывание тега img в div имеет минимальный негативный эффект.

Соска предложил один/простой способ.

Но я делаю по-другому - извлекаю изображение из контента и отображаю его отдельно.

Я разработал плагин, который решает именно эту проблему: http://wordpress.org/extend/plugins/unwrap-images/

Это лучше, чем устанавливать отступы или лезть прямо в код WordPress для тех, кто не хочет возиться с кодом, потому что он использует нативную функцию jQuery unwrap для удаления тегов p вокруг всех изображений.

Надеюсь, это поможет кому-то! С уважением, Брайан

Принятый ответ помог мне только с изображениями, но переработанный код плохо обрабатывает связанные изображения на моем сайте. В этой статье блога есть код, который работает идеально.

Вот код:

function wpautop_forked($pee, $br = 1) {

if ( trim($pee) === '' )
return '';
$pee = $pee . "\n"; // для удобства добавим перевод строки в конце
$pee = preg_replace('|<br />\s*<br />|', "\n\n", $pee);
// Добавляем немного пространства
$allblocks = '(?:table|thead|tfoot|caption|col|colgroup|tbody|tr|td|th|div|dl|dd|dt|ul|ol|li
|pre|select|option|form|map|area|blockquote|img|address|math|style|input
|p|h[1-6]|hr|fieldset|legend|section|article|aside|hgroup|header|footer
|nav|figure|figcaption|details|menu|summary)';
$pee = preg_replace('!(<' . $allblocks . '[^>]*>)!', "\n$1", $pee);
$pee = preg_replace('!(</' . $allblocks . '>)!', "$1\n\n", $pee);
$pee = str_replace(array("\r\n", "\r"), "\n", $pee); // кросс-платформенные переводы строк
if ( strpos($pee, '<object') !== false ) {
$pee = preg_replace('|\s*<param([^>]*)>\s*|', "<param$1>", $pee); // не добавлять отступы внутри object/embed
$pee = preg_replace('|\s*</embed>\s*|', '</embed>', $pee);
}
$pee = preg_replace("/\n\n+/", "\n\n", $pee); // убираем дубликаты
// создаем параграфы, включая один в конце
$pees = preg_split('/\n\s*\n/', $pee, -1, PREG_SPLIT_NO_EMPTY);
$pee = '';
foreach ( $pees as $tinkle )
$pee .= '<p>' . trim($tinkle, "\n") . "</p>\n";
$pee = preg_replace('|<p>\s*</p>|', '', $pee); // в некоторых случаях может создать пустой P
$pee = preg_replace('!<p>([^<]+)</(div|address|form)>!', "<p>$1</p></$2>", $pee);
$pee = preg_replace('!<p>\s*(</?' . $allblocks . '[^>]*>)\s*</p>!', "$1", $pee); // не добавлять P вокруг тегов
$pee = preg_replace("|<p>(<li.+?)</p>|", "$1", $pee); // проблема с вложенными списками
$pee = preg_replace('|<p><blockquote([^>]*)>|i', "<blockquote$1><p>", $pee);
$pee = str_replace('</blockquote></p>', '</p></blockquote>', $pee);
$pee = preg_replace('!<p>\s*(</?' . $allblocks . '[^>]*>)!', "$1", $pee);
$pee = preg_replace('!(</?' . $allblocks . '[^>]*>)\s*</p>!', "$1", $pee);
if ($br) {
$pee = preg_replace_callback('/<(script|style).*?<\/\\1>/s', create_function('$matches', 'return str_replace("\n", "<WPPreserveNewline />", $matches[0]);'), $pee);
$pee = preg_replace('|(?<!<br />)\s*\n|', "<br />\n", $pee); // опционально добавляем переносы строк
$pee = str_replace('<WPPreserveNewline />', "\n", $pee);
}
$pee = preg_replace('!(</?' . $allblocks . '[^>]*>)\s*<br />!', "$1", $pee);
$pee = preg_replace('!<br />(\s*</?(?:p|li|div|dl|dd|dt|th|pre|td|ul|ol)[^>]*>)!', '$1', $pee);
if (strpos($pee, '<pre') !== false)
$pee = preg_replace_callback('!(<pre[^>]*>)(.*?)</pre>!is', 'clean_pre', $pee );
$pee = preg_replace( "|\n</p>$|", '</p>', $pee );

return $pee;
}

remove_filter('the_content', 'wpautop');
add_filter('the_content', 'wpautop_forked');

Удачи!

Я не эксперт, но потратил весь день, пытаясь решить проблему с обёрткой изображений в теги p, и это сработало для меня.

Я работаю над темой на основе WordPress и просто добавил это в файл functions.js

Функция JQuery unwrap

> $(document).ready(function (){
> 
> // для изображений, обёрнутых в теги a
> 
> $(‘.entry a’).unwrap(‘p’);
> 
> // для изображений, обёрнутых только в теги p
> $(‘.entry img’).unwrap(‘p’);

Теперь я могу работать с тегами p и img отдельно.

Также можно добавить div с другим классом вокруг изображения, используя это:

$(document).ready(function (){

$('.entry img').wrap('<div class="justImg"></div>');

Последний вариант не решил мою проблему, потому что я хотел сделать теги p с display:none;, поэтому мне действительно нужно было вытащить изображения из них.

Поместите ваше изображение внутрь тега <div> без пробелов между ними. Вместо:

<div class="your_container">
    <div class="element1">...</div>
    <div class="element2">...</div>
    <img src="image.jpg" />
</div>

Напишите так:

<div class="your_container">
    <div class="element1">...</div>
    <div class="element2">...</div>
    <div><img src="image.jpg" /></div>
</div>

У меня была такая же проблема с элементами <a>, и это решение помогло.

В зависимости от поста, другим решением может быть использование плагина WP Unformatted для отключения функции auto-p на уровне отдельных постов.

Если кто-то ищет быстрый и грязный способ исправить это для любого тега, вот что я сделал:

1. перейдите в wp-content/formatting.php
2. найдите функцию wpautop (если пропустили, это WP-AUTO-P, понятно?)
3. найдите переменную "all blocks", должно быть что-то вроде $allblocks = '(?:table|thead|tfoot|capti...
4. в конце добавьте блок, который хотите исключить — img, a и т.д. Например, если строка заканчивается на (...)menu|summary)';, измените на (...)menu|summary|a)';, чтобы добавить тег a и избежать автоп-эффекта. Обратите внимание на разделитель | — это синтаксис регулярных выражений!

Вот и всё, счастливого Вордпрессинга!