在WordPress中使用获取后缩略图问题进行图像缩放

时间:2017-12-14 作者:June

问题URL-http://www.creativescripters.com/clients/testwp/uncategorized/image-resized/

我使用的是wordpress(自托管)的最新版本,问题是我想从调整大小/缩放后的图像中获取缩略图,当我这样做时,wordpress会返回test-150x150。jpg,即原始图像的缩略图,而不是应测试的已调整大小的图像-e1513229707262-150x150。jpg公司

复制问题的步骤

上载图像,缩放它(单击上载图像上的编辑,更改宽度,然后单击缩放)。Wordpress将重命名图像并在名称中添加后缀Id,以便您确认图像已缩放。例如,如果你上传了测试。jpg缩放后的图像名称将成为测试随机字符串。jpg

enter image description here

<当我调用get\\u the\\u post\\u thumbnail($post,\'full\')时,我得到了正确的图像,即大小调整后的图像,即test randomstring。jpg公司enter image description here

当我尝试获取不同大小的缩放图像时,例如,我需要从图像大小生成缩略图,并调用函数get\\u the\\u post\\u thumbnail($post,\'thumbnail\')wordpress从实际图像返回缩略图(我最初上传的test.jpg,而不是调整大小的one-test randomstring.jpg)

屏幕截图-https://i.imgur.com/sQKoZcF.png

5 个回复
SO网友:CK MacLeod

始终在图像编辑时重新生成源集(新材质,尤其是自定义函数,在注释线程中的对话之后)

以下函数在图像编辑操作后自动重新生成完整的源集。

/**
 * ALWAYS REGENERATE FULL SOURCE SET AFTER EDITING IMAGE
 * answering StackExchange WordPress Development Question
 * see: https://wordpress.stackexchange.com/questions/288581/image-scaling-using-get-the-post-thumbnail-issue-in-wordpress/
 * exploits code already worked out in Regenerate Thumbnails Plugin
 */
add_action( \'edit_attachment\', \'wpse_always_regenerate\', 99);

function wpse_always_regenerate( $postID ) {

    $new_url = get_attached_file( $postID );

    $metadata = wp_generate_attachment_metadata( $postID, $new_url );

    wp_update_attachment_metadata( $postID, $metadata );

}
您可以将其添加到主题函数中。php文件—如果您对生成并添加到原始图像的索引号感到满意,并且对由编辑(重新缩放)的图像管理的完整源集感到满意。它碰巧将原始上载及其设置保留在文件夹中。(添加一个可选的“清理器”操作是我还没有接触到的,但有一些插件可以清理文件夹中未连接/未使用的图像,其中一个可以半定期应用。)

我还没有测试它是否存在不必要的额外交互。在大多数安装中,这不会有什么坏处,甚至可能有帮助,但我可以想象,在某些情况下,您可能不希望所有图像编辑操作都“重新生成缩略图”(可能应该命名为“重新生成源集”)。对于这些安装,您显然需要更精致的东西。

完整的讨论虽然对最初的问题以及如何准确地再现它会有所帮助,但我相信答案大致如下:

上载图像时,WordPress将上载图像的完整版本以及正常的缩略图集。如果缩放图像,它还将创建一个特定的变体,使用随机数相加。因此,在一次安装中,当我将一个图像上载为post featured图像并继续对其进行重新缩放时,我会在上载文件夹中获得以下内容:

![enter image description here

如果我要求get_the_post_thumbnail( $postID, $type ), 我得到:

full :

<img 
    width="500" 
    height="651" 
    src="http://ckmswp.com/wp-content/uploads/2017/12/pingdom_topline_before-e1514050718361.jpg" 
    class="attachment-full size-full wp-post-image" 
    alt="" 
    sizes="100vw" 
/>
post-thumbnail :

<img 
    width="500" 
    height="651" 
    src="http://ckmswp.com/wp-content/uploads/2017/12/pingdom_topline_before-e1514050718361.jpg" 
    class="attachment-post-thumbnail size-post-thumbnail wp-post-image" 
    alt="" 
    sizes="100vw" 
/>
thumbnail :

<img 
    width="150" 
    height="150" 
    src="http://ckmswp.com/wp-content/uploads/2017/12/pingdom_topline_before-150x150.jpg" 
    class="attachment-thumbnail size-thumbnail wp-post-image" alt="" 
    srcset="https://ckmswp.com/wp-content/uploads/2017/12/pingdom_topline_before-150x150.jpg 150w, 
            https://ckmswp.com/wp-content/uploads/2017/12/pingdom_topline_before-100x100.jpg 100w" 
    sizes="100vw" 
/>
因此,在上传时缩放图像时,我创建了一个新的“完整”版本的图像,在原始文件名中添加了“随机”代码,并且,由于我将其作为特色图像上传,现在它也被定位为“后期缩略图”图像。

这也可以使用wp\\u get\\u attachment\\u image\\u src()进行验证,对于上面的“full”,它返回:

(
    [0] => http://ckmswp.com/wp-content/uploads/2017/12/pingdom_topline_before-e1514050718361.jpg
    [1] => 500
    [2] => 651
    [3] => 
)
因此,简而言之,如果您在常规图像集中调用一个命名图像,那么您将在缩放图像之前创建这些图像。如果-假设您在将图像上载为特色图像时缩放了图像-您需要完整图像或(在此安装中)post-thumbnail 图像,您还将获得新的缩放图像。

要获取原始的完整图像,我认为您可能必须访问附件对象,如下所示:

[64755] => WP_Post Object
        (
            [ID] => 64755
            [post_author] => 1
            [post_date] => 2017-12-23 17:38:24
            [post_date_gmt] => 2017-12-23 17:38:24
            [post_content] => 
            [post_title] => pingdom_topline_before
            [post_excerpt] => 
            [post_status] => inherit
            [comment_status] => open
            [ping_status] => closed
            [post_password] => 
            [post_name] => pingdom_topline_before
            [to_ping] => 
            [pinged] => 
            [post_modified] => 2017-12-23 17:38:24
            [post_modified_gmt] => 2017-12-23 17:38:24
            [post_content_filtered] => 
            [post_parent] => 64752
            [guid] => **http://ckmswp.com/wp-content/uploads/2017/12/pingdom_topline_before.jpg**
            [menu_order] => 0
            [post_type] => attachment
            [post_mime_type] => image/jpeg
            [comment_count] => 0
            [filter] => raw
        )

)

If you wanted to get a 150x150 (or whatever is set for you installation for thumbnail) version of the scaled image, you\'d have to either:

1) upload the scaled image separately, and let WordPress generate the test-image-random-150x150.jpg for you. or

2) Achieve a similar effect by "regenerating thumbnails."

执行此重新生成操作后,“我的上载”文件夹显示以下内容:

enter image description here

请注意,原始图像集在文件夹中保持不变。

创建这样一个重新生成的图像集是最好的方法,尤其是如果您打算将缩放后的图像用于其他目的,因为重新上载它并让它生成适合您的安装的完整源图像集将有助于提高响应性和一致性。

为了达到这些目的,您将需要一个自定义函数(如本答案开头提供的函数),并且可能需要考虑一个更复杂的可选实现,尽管我不相信它会经常使用。(当我想将图像缩放到特定的尺寸时,我几乎总是与WP分开进行,并给它起一个对我有意义的名称,但我不能代表其他人。)

如果您希望获得完整的图像源集(相对于新缩放的图像),并且不希望重新上载新缩放的图像,或者在编辑库中的图像时依赖该函数为您执行此操作,则可以使用“重新生成缩略图”或类似插件。最后,还可以裁剪(或假裁剪)图像以生成缩略图集。

最后一个很容易执行:除了重新缩放图像外,在“编辑图像”中,您可以使用裁剪工具生成原始图像的虚拟近似副本,WordPress将在保存图像时生成完整的源代码集。我之所以说接近副本,是因为在测试中,编辑器不会让您完全保存一个实际上与原始版本完全相同的“副本”,但在这一点上,如果我想理解的话,我别无选择,只能详细检查代码,这件事我会留到另一天,也许会在其他地方写出来,除非其他人先提供完整的简介。

总之,

1. When you first upload an image, WordPress creates a set of thumbnails based on the uploaded file.

2. If you simply re-scale the image, it will produce a single unique scaled image, with a generated filename based on the original name, with the addition of a "random" element (actually a heterogeneous index number)

3. If you re-upload the new scaled image or if you regenerate thumbnails - using a custom function, a plugin, or an editing trick - you can produce a new set of images based on the scaled image, using the generated filename.

SO网友:Tarang koradiya

使用的img标签和显示图像

<img src="<?= $img_url=get_the_post_thumbnail_url($post->ID,\'full\'); ?>" alt="image" />

SO网友:BlueSuiter

使用post-thumbnail 而不是thumbnail. 您的最终代码为get_the_post_thumbnail($post, \'post-thumbnail\');.请参考此link

SO网友:shramee

您可以尝试添加IMAGE_EDIT_OVERWRITE 常量强制wp清除旧图像并使用新图像。

作用wp_save_image() 是用来处理图像的wp_ajax_image_editor() 它是图像编辑器AJAX端点的AJAX处理程序。

您可以在文件中阅读有关其工作原理的更多信息/wp-includes/image-edit.php 或者在线浏览其源代码@https://developer.wordpress.org/reference/functions/wp_save_image/

然而,我仍然不确定这是否真的是一个问题,

原始图像是1024x707,WP将其与其他大小一起转换为缩略图大小

SO网友:Ted

您必须在主题函数中添加适当的图像大小。php文件

add_image_size(\'my_post_thumbnial\', 400, 99999, false);

400表示宽度,99999表示高度,false表示不裁剪。这必须是“之后”添加\\u主题\\u支持(张贴缩略图);因此,找到它并将上面的代码放在后面。

您不必重新生成所有图像。。。只需重新上传您需要的内容。(可选)重新生成缩略图插件(https://wordpress.org/plugins/regenerate-thumbnails/) 向媒体库中的每个图像添加链接,以重新生成该特定图像。

然后调用缩略图the_post_thumbnail(\'my_post_thumbnial\');

结束

相关推荐

Images are not shown

我可以在媒体/图书馆中看到我的图片,但不能在帖子中看到。问题似乎是图像的真实url以图像结尾。jpg(如果我转到这个url,我可以看到图像)。但在帖子中,我看到了“断开的图像链接”图标。当我检查图像url时,它以图像sizeXsize结尾。jpg,所以Wordpress出于某种原因添加了sizeXsize(例如1000x1000)。如何解决此问题?编辑1:我刚刚安装了WP。我试过theams 2111和215,同样的问题。我已经安装了很多插件,请看一下。Edit2:我已经停用了所有插件,仍然是同一个问题。