过滤以删除图像尺寸属性?


35

我正在一个基于流体宽度css模板的网站上工作,该模板将图像的最大宽度设置为包含它们的列的宽度,并且我需要删除WordPress添加到图像的内联宽度高度尺寸属性。

我正在使用带有此滤镜的精选图片来做:

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

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

我知道可以根据需要将相同的过滤器应用于the_content。但是有更好的方法吗?


首先,感谢非常有用的代码。它可以完美地从img标签中删除width和height属性,但是由于某种原因,它似乎也可以删除字幕简码(如果有的话)。有谁知道这是为什么以及如何纠正它?
Dominic P

1
也许您应该将此问题发布为自己的问题?它似乎与我的足够不同,因此值得自己作出回应。尽管如此,我将尝试为其他人找到答案并遇到相同问题的答案:您的问题是,img_caption_shortcode处理字幕简码的函数要求在字幕简码属性中指定宽度。否则,它会完全跳过标题,只返回包装在[caption]shortcode标签内的内容。
goldenapples

如果要使用没有定义宽度的字幕简短代码,则必须在连接到过滤器的函数中定义字幕标记img_caption_shortcode。但是,为这样的函数编写代码远远超出了我在此处的注释范围。
goldenapples

@goldenapples,感谢您的有用回复。我已经按照您的建议做了,并在这里提出了一个新问题:wordpress.stackexchange.com/questions/32931/…。任何有关的输入将不胜感激。正如我在问题中解释的那样,我不确定打开过滤器img_caption_shortcode是否足以解决问题。
Dominic P

1
也许我没有看到您想做的事情的全盘大意而又看不到实际内容,但是仅使用CSS可以解决这个问题吗?如果您在图片上使用最大宽度,则应该可以通过添加height来解决高度问题:auto; 您的内容图像。
binaryorganic

Answers:


36

谢谢大家!

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其他相关功能(没有钩子)检索到的图像中删除它们,但是可以在必要时在模板文件中处理这些情况。


1
我不得不从正则表达式中删除\ s。在那之后,它运行良好。我认为这是因为在高度设置的最后一个双引号之后没有尾随空格。
MattSlay 2012年

1
@MattSlay永久修改网站内容是否只是我一个问题?响应式主题不必修改网站内容即可正确设置格式。我投票删除了该过滤器image_send_to_editor,而是将此过滤器添加到了the_content博客文章中。这将表示逻辑与内容分开。
BFTrick 2012年

1
@BFTrick-对我来说似乎是一个上下文问题。对于自适应主题,我会同意您的看法,因为您不能依赖以这种方式处理过的现有内容,而且您也不知道下一个安装的主题是否需要这些维度属性。就我而言,我正在构建一个主题是内容不可或缺的应用程序,因此我选择了在图像首次添加时处理处理器的方法。但是,您确实提出了一个好要点。
goldenapples 2012年

2
警告:此答案会破坏WordPress 3.5.1中的图像标题。
有线

5

对该脚本进行了一些修改。谢谢您的帮助!

add_filter( 'post_thumbnail_html', 'remove_thumbnail_dimensions', 10 );
add_filter( 'image_send_to_editor', 'remove_thumbnail_dimensions', 10 );
// Genesis framework only
add_filter( 'genesis_get_image', 'remove_thumbnail_dimensions', 10 );
// Removes attached image sizes as well
add_filter( 'the_content', 'remove_thumbnail_dimensions', 10 );
function remove_thumbnail_dimensions( $html ) {
    $html = preg_replace( '/(width|height)=\"\d*\"\s/', "", $html );
    return $html;
}

5
不过要小心。过滤the_content还将过滤youtube视频和任何其他width / height属性。
MikeNGarrett 2011年

1
没错,但这在响应式网站中可能是一件好事。如果需要对图像进行处理,则可能还需要对其他介质进行处理。
BFTrick

1

如果您在function.php中将图像大小设置为“图库”

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

您可以删除特定图像尺寸(例如“图库”)的宽度和高度:

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;
}

0

将过滤器应用于the_content将为所有内容触发它。这将是有效的,但可能会影响网站的性能和加载时间。如果您告诉WordPress在开始插入图像时仅不插入行内宽度和高度标签会更好。

不幸的是,实际插入图像的脚本是用JavaScript构建的,并与TinyMCE所见即所得编辑器进行交互。可能有一种方法可以直接挂接到它,而不使用标准add_filter()调用。


1
image_send_to_editor这里不会过滤工作吗?
t31os 2010年

@ t31os-我想这就是我想要的!不知道为什么我以前没有看到那个钩子。
goldenapples 2010年

好吧,我当然希望它能对您有所帮助,看来它可以解决问题……报告并告知我们。:)
t31os 2010年

@ t31os是的,成功了!谢谢!我将其发布为答案,除非您先了解它。
goldenapples 2010年

2
您为它努力吧,我不是太着急,很高兴您能够找到解决方案...;)
t31os 2010年
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.