【问题标题】:resize the_post_thumbnail to stretch properly, wordpress调整 the_post_thumbnail 的大小以正确拉伸,wordpress
【发布时间】:2012-10-13 00:29:19
【问题描述】:

嗨,我使用the_post_thumbnail 作为 nivo 滑块,我的问题是我似乎无法找到一种简单的方法来自动将图像调整为精确的尺寸。 当我使用add_image_size 时,它不会正确拉伸它,它会保持约束。我不想裁剪或任何东西。我只希望用户上传图片,之后无需执行任何操作。

这可能很愚蠢,但我已经用谷歌搜索过了,尽管有很多关于它的内容,包括各种插件,但我似乎无法找到一个可靠的答案。

谢谢

【问题讨论】:

    标签: php image wordpress thumbnails


    【解决方案1】:

    我认为您需要澄清您的问题。如果我理解正确,您希望上传的图像是准确的图像而不进行裁剪?确保在调用 nivo 滑块的_post_thumbnail 函数之前保存上传。这样,您就可以在函数获取原始图像之前对其进行操作。

    【讨论】:

    • 对不起,澄清一下,我想自动调整图像大小,即使这意味着拉伸它。无论上传时图像的大小,我每次都需要像素为760px * 474px。我对add_image_size 的问题是它不会拉伸它,它会按比例调整我无法拥有的大小。谢谢
    • 因为用户不擅长电脑,我不希望他们除了在 wordpress 中上传图片外,还需要做任何事情
    • 要自动调整图像大小,只需将宽度/高度设置为 100%;它将图像拉伸到其父容器的宽度/高度。
    【解决方案2】:

    add_image_size() 方法有一个您希望使用的裁剪方法的标志。但是,它们都将保持图像的比例不变。

    您可以扩展功能或构建您自己的插件来以您想要的方式处理大小调整 - 您可能想看看 /wp-includes/media.php 和一个简单的调整大小类,如 https://github.com/mdular/ReSample.php/blob/master/ReSample.php

    不过,我不喜欢扭曲图像比例。如果客户无法区分纵向或横向纵横比,那么在大多数情况下,裁剪图像而不是拉伸它似乎是更优雅的解决方案。

    对于您的问题的快速而肮脏的解决方案,尽管我建议如下:

    1. 添加图像大小并通过宽度或高度对其进行限制以适合您的滑块宽度或高度(此示例仅通过宽度进行限制):

      add_image_size('slider-image', 760, 9999); //760 像素宽,“无限”高度

    2. 输出图片标签时,强制图片标签中的尺寸为760 x 474

    这将为您留下可能比您想要的更高或更宽的图像文件,但将被强制为浏览器中设置的尺寸,因此适合滑块。它很脏,是的,但它可以与你目前拥有的工具一起使用。

    更新 回应您的评论:您可以通过获取原始图像信息自己构建图像标签。

    1) 抓取 post 元数据,像这样(假设 the_post() 已经执行,如果你在 while 循环中应该是这样):

    $meta = get_post_meta($post->ID)
    

    2) 检查缩略图 id 以避免空输出(并在 if 块内执行步骤 3 + 4)

    if(!empty($meta['_tumbnail_id'][0])
    

    3) 获取实际的缩略图原始数据 - 请务必填写您想要的“缩略图版本”(大小)(“缩略图”、“中”等。如果您在您的函数.php)

    $image = wp_get_attachment_image_src( $meta['_thumbnail_id'][0], 'VERSION');
    

    4) 构造图片标签:

    $image[0] = the src url
    $image[1] = the width - you may use this
    $image[2] = the height - you may wish to force this to your liking
    

    希望这会有所帮助:)

    【讨论】:

    • 嗨,谢谢,很好的答案,唯一的问题是我没有“访问”img 标签如果你关注,我知道这听起来很荒谬,但我的意思是,我唯一使用的东西在循环中是 the_post_thumbnail ,它会生成自己的 img 标记。而且我需要在循环中使用该函数才能使滑块正常工作(因为它也可以获取 img 信息等。)但是我可能会采用您的解决方案,而不是使用 html height 我可以使用 CSS auto-height .所以add_image_size 会处理宽度,css auto-height 会处理高度。我会告诉你谢谢
    • 您可以访问图像的原始数据并自己构建标签,几天前我已经构建了一个自定义滑块。将用更多信息更新我的答案。
    猜你喜欢
    • 2012-09-19
    • 2010-09-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-07-24
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多