如何更改帖子缩略图的图像宽度/高度属性?

时间:2015-02-09 16:08:58

标签: php jquery html css wordpress

我正在尝试更改单个帖子缩略图的图像宽度和高度属性。这是WordPress生成的HTML标记输出。

<img width="1024" height="600" src="http://www.sample.com/wp-content/uploads/2015/02/image.jpg" alt="My site" width="100%" height="" />

我希望此width="1024" height="600"变为width="100%" height="",以便在不执行CSSJQUERY代码的情况下,图片已在所有不同的窗口屏幕中响应。

以下我的代码无效。输出是width="100%" height="" />属性之后的另一个src,而不是替换width="1024" height="600"属性之前的src

我期望的图像标签输出是这样的

<img width="100%" src="http://www.sample.com/wp-content/uploads/2015/02/image.jpg" alt="My site" />

PHP代码:

$attr = array( 
    'class'     => '',
    'alt'       => 'My site'
    'width'     =>  '100%',
    'height'    =>  ''
);
get_the_post_thumbnail( $post->ID, 'full', $attr )

我有另一种解决方法。下面的代码是我的第二个选项,但我也想知道这个图像/高度属性如何动态变化。

$img_url= wp_get_attachment_image_src( get_post_thumbnail_id(), 'full' );

<img width="100%" src="<?php echo $img_url[0]; ?>" alt="My site" />

非常感谢任何帮助。

2 个答案:

答案 0 :(得分:0)

你可以找到缩略图网址&amp;给css那个

<?php $url = wp_get_attachment_url(get_post_thumbnail_id($post->ID)); ?>
<img src="<?php echo $url; ?>" class="img_thumb"/>

答案 1 :(得分:0)

上传新图片时创建自定义图片尺寸:

if ( function_exists( 'add_image_size' ) ) { 
    add_image_size( 'thumb-400', 400, 350 ); //cropped 400 pixels wide, max 350px height
    add_image_size( 'center', 550, 367, array( 'center', 'center' ) ); //center crop
    add_image_size( 'default-thumb', 600 ); // 600 pixels wide (and unlimited height)
} 

在你的模板中:

$thumb = wp_get_attachment_image_src( get_post_thumbnail_id(), 'thumb-400'); 
$t = $thumb[0];

HTML

<img class="thumbnail" src="<?php echo $t ?>" />