Фильтр для удаления атрибутов размеров изображения?

Question

Фильтр для удаления атрибутов размеров изображения?

18 дек. 2010 г., 06:54:51

Просмотры: 28.7K

Голосов: 36

Я работаю над сайтом на основе CSS-шаблона с гибкой шириной, который устанавливает максимальную ширину изображений по ширине содержащей их колонки, и мне нужно удалить встроенные атрибуты размеров width и height, которые WordPress добавляет к изображениям.

Я делаю это для изображений записей с помощью следующего фильтра:

add_filter( 'post_thumbnail_html', 'remove_thumbnail_dimensions', 10, 3 );

function remove_thumbnail_dimensions( $html, $post_id, $post_image_id ) {
    // Удаляем атрибуты width и height из HTML
    $html = preg_replace( '/(width|height)=\"\d*\"\s/', "", $html );
    return $html;
}

Я знаю, что могу применить тот же фильтр к the_content, если необходимо. Но есть ли лучший способ сделать это?

goldenapples

9.26K

изображения фильтры миниатюры записей

Комментарии

Возможно, я не вижу общей картины того, что вы пытаетесь сделать, не видя ваш фактический контент, но разве эту проблему нельзя решить только с помощью CSS? Если вы используете max-width для изображений, вы сможете решить проблему с высотой, добавив height: auto; для контентных изображений.

binaryorganic

1 мая 2012 г. 20:11:32

@binaryorganic - Да, теперь я понимаю, что это возможно... по крайней мере, в любом браузере, который меня бы беспокоил, CSS-свойства width и height должны переопределять inline-атрибуты width. Когда я первоначально работал над этим, были проблемы в старых версиях IE с этой функциональностью, хотя я уже не помню, какие именно. В любом случае, казалось лучше не выводить кучу дополнительных размерных свойств и затем их переопределять.

goldenapples

2 мая 2012 г. 00:51:04

Прежде всего, спасибо за очень полезный код. Он отлично работает для удаления атрибутов width и height из тега img, но почему-то также удаляет шорткод подписи, если он есть. Кто-нибудь знает, почему это происходит и как это исправить?

Dominic P

2 нояб. 2011 г. 00:46:03

Возможно, вам стоит задать этот вопрос отдельно? Он достаточно отличается от моего, чтобы заслуживать отдельного ответа. Тем не менее, я попробую ответить... для тех, кто наткнётся на этот ответ с той же проблемой:

Ваша проблема в том, что функция img_caption_shortcode, которая обрабатывает шорткод подписи, требует указания ширины в атрибутах шорткода. В противном случае она пропускает подпись и просто возвращает контент, обёрнутый в теги [caption].

goldenapples

3 нояб. 2011 г. 14:43:38

Если вы хотите использовать шорткоды подписей без указания ширины, вам нужно определить разметку подписи в функции, подключённой к фильтру img_caption_shortcode. Однако написание кода для такой функции выходит за рамки возможностей комментариев здесь.

goldenapples

3 нояб. 2011 г. 14:50:56

Показать остальные 1 комментариев

Все ответы на вопрос

Комментарии

Мне пришлось удалить \s из регулярного выражения. После этого всё заработало как надо. Думаю, проблема была в том, что у меня не было пробела после последней кавычки в настройке высоты.

MattSlay

10 окт. 2012 г. 17:55:02

@MattSlay Только у меня есть проблемы с постоянным изменением контента сайта? Адаптивная тема не должна изменять содержимое сайта, чтобы добиться правильного форматирования. Я предлагаю убрать фильтр из image_send_to_editor и вместо этого добавить его в the_content — как в этом посте блога. Так мы отделим логику представления от контента.

BFTrick

1 нояб. 2012 г. 15:53:50

@BFTrick - Мне кажется, это вопрос контекста. Для адаптивной темы я с вами согласен, потому что нельзя полагаться на то, что существующий контент уже обработан таким образом, и неизвестно, понадобятся ли атрибуты размеров следующей установленной теме.

В моём случае я разрабатывал приложение, где тема была неотъемлемой частью контента, поэтому я выбрал менее ресурсоёмкий метод обработки изображений при их первом добавлении. Но вы правы, это хорошее замечание.

goldenapples

2 нояб. 2012 г. 01:43:44

Внимание: этот ответ нарушает работу подписей к изображениям в WordPress 3.5.1.

wired

25 апр. 2013 г. 02:41:26

Немного изменил этот скрипт. Спасибо за помощь!

add_filter( 'post_thumbnail_html', 'remove_thumbnail_dimensions', 10 );
add_filter( 'image_send_to_editor', 'remove_thumbnail_dimensions', 10 );
// Только для фреймворка Genesis
add_filter( 'genesis_get_image', 'remove_thumbnail_dimensions', 10 );
// Удаляет также прикрепленные размеры изображений
add_filter( 'the_content', 'remove_thumbnail_dimensions', 10 );
function remove_thumbnail_dimensions( $html ) {
    $html = preg_replace( '/(width|height)=\"\d*\"\s/', "", $html );
    return $html;
}

MikeNGarrett

2.67K

5 янв. 2011 г. 20:57:00

Комментарии

Однако будьте осторожны. Фильтрация the_content также затронет YouTube-видео и любые другие атрибуты width/height.

MikeNGarrett

5 янв. 2011 г. 23:59:35

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

BFTrick

1 нояб. 2012 г. 15:50:00

если вы установили размер изображения в function.php как "gallery"

add_image_size( 'gallery', 200, 120, true );

вы можете удалить ширину и высоту для конкретного размера изображения, такого как "gallery":

add_filter( 'post_thumbnail_html', 'remove_thumbnail_dimensions', 10, 4 );

function remove_thumbnail_dimensions( $html, $post_id, $post_image_id,$post_thumbnail) {
    if ($post_thumbnail=='gallery'){
    $html = preg_replace( '/(width|height)=\"\d*\"\s/', "", $html );
    }
    return $html;
}

Tohid Golkar

61

29 янв. 2013 г. 08:40:42

Применение этого фильтра к the_content будет активировать его для всего контента. Это будет эффективно, но может повлиять на производительность и время загрузки вашего сайта. Лучше было бы, если бы вы сказали WordPress просто не вставлять встроенные теги ширины и высоты при первоначальной вставке изображений.

К сожалению, скрипты, которые фактически вставляют изображение, построены на JavaScript и взаимодействуют с wysiwyg-редактором TinyMCE. Возможно, есть способ подключиться к нему напрямую, но не с использованием стандартных вызовов add_filter().

EAMann

32.2K

18 дек. 2010 г. 07:57:47

Комментарии

Не сработает ли здесь фильтр image_send_to_editor?

t31os

18 дек. 2010 г. 17:50:13

@t31os - Думаю, это именно то, что я искал! Не знаю, почему раньше не заметил этот хук.

goldenapples

18 дек. 2010 г. 18:17:09

Ну, я очень надеюсь, что это поможет, похоже, что может сработать... отпишись и дай нам знать. :)

t31os

18 дек. 2010 г. 18:43:23

@t31os Да, это сработало! Спасибо! Я опубликую это как ответ, если ты не сделаешь это раньше.

goldenapples

19 дек. 2010 г. 00:01:27

Давай, дружище, мне не очень важно, рад, что ты смог найти решение... ;)

t31os

19 дек. 2010 г. 00:04:49

goldenapples 9.26K · Accepted Answer · 2010-12-19T00:15:56Z

Спасибо всем!

Фильтр image_send_to_editor оказался именно тем, что я искал... спасибо @t31os за подсказку.

Вот мои текущие функции.

add_filter( 'post_thumbnail_html', 'remove_thumbnail_dimensions', 10 );
add_filter( 'image_send_to_editor', 'remove_thumbnail_dimensions', 10 );

function remove_thumbnail_dimensions( $html ) {
    $html = preg_replace( '/(width|height)=\"\d*\"\s/', "", $html );
    return $html;
}

Этот код удаляет встроенные атрибуты ширины и высоты у изображений, полученных через the_post_thumbnail(), а также предотвращает добавление этих атрибутов к новым изображениям, вставляемым в редактор. Не удаляет атрибуты у изображений, полученных через wp_get_attachment_image или другие связанные функции (там нет хуков), но эти случаи можно обработать непосредственно в файлах шаблонов при необходимости.