Làm thế nào để tạo hình thu nhỏ khi chỉ cần?


18

Tôi có 1000 hình ảnh. Làm thế nào tôi có thể làm cho wordpress để tạo ngón tay cái chỉ khi cần thiết. Ví dụ: thanh trượt tại nhà sẽ chỉ sử dụng 10 hình ảnh, tôi không muốn 1000 hình ảnh khác có hình thu nhỏ đó được tạo ra vì nó gây lãng phí không gian và tài nguyên.

Có cách nào để bắn add_image_size chỉ khi cần?

Cảm ơn

CẬP NHẬT Như bạn đề cập không thực sự add_image_size những gì nó cần phải được kích hoạt. Điều tuyệt vời là bắn kích thước hình ảnh khi tôi sử dụng the_post_thumbnail ('slide-thumb'); Có thể điều này làm chậm chế độ xem hình ảnh đầu tiên nhưng chế độ xem đó thường được tạo bởi tôi khi tôi thực sự xem lại bài đăng nên tôi không quan tâm.

Vì vậy, giữa các bài đăng của tôi, thanh trượt, ngón tay cái blog, hình thu nhỏ danh mục đầu tư, v.v ... tôi có 1000 hình ảnh và tôi chỉ muốn thay đổi kích thước 10 hình ảnh cho thanh trượt, tôi thấy rất nhiều tài nguyên bị lãng phí để tạo kích thước hình thu nhỏ cho 990 hình ảnh khác.

Hy vọng nó rõ ràng bây giờ, xin lỗi cho tiếng Anh của tôi


2
Làm thế nào là hình thu nhỏ được tạo ra từ các hình ảnh thêm 990 lãng phí không gian và tài nguyên hơn so với 990 hình ảnh không được sử dụng ở nơi đầu tiên? Sẽ không có ý nghĩa hơn nếu chỉ tải lên những hình ảnh bạn đang tích cực sử dụng?
SickHippie

Mặc dù các lập trình viên lành nghề hơn đang trình bày các lập luận hợp lệ chống lại ý tưởng của bạn, tôi thấy nó thú vị. Tôi đã thấy một số plugin và chủ đề tải lên hình ảnh mà không tạo ra ngón tay cái (không chắc chắn ngay bây giờ). Nhưng nghi ngờ lớn của tôi về câu hỏi của bạn là: khi nào bạn sẽ cần nó? . Điều gì sẽ là bộ lọc?
brasofilo

1
Bạn đã sai tôi. Tôi sử dụng hình ảnh 990 trong bài viết, tôi chỉ không sử dụng thanh trượt trong nhà. Một số trong số chúng tôi cần ngón tay cái cho danh mục đầu tư, một số khác cho ngón tay cái blog, v.v.
chifliiiii

Câu trả lời:


12

Hãy xem plugin Dynamic Image Resizer của Otto

Plugin này thay đổi cách WordPress tạo hình ảnh để khiến nó tạo ra hình ảnh chỉ khi chúng thực sự được sử dụng ở đâu đó, một cách nhanh chóng. Do đó, hình ảnh được tạo sẽ được lưu trong các thư mục tải lên thông thường, để sau đó gửi nhanh bởi máy chủ web. Kết quả là không gian được lưu (vì hình ảnh chỉ được tạo khi cần thiết) và tải lên hình ảnh nhanh hơn nhiều (vì nó không tạo ra hình ảnh khi tải lên nữa).


2
Lưu ý rằng plugin đó có vấn đề với việc thêm hình ảnh vào bài viết cũ. Bản vá chào mừng.
Otto

Đó chính xác là những gì tôi đang tìm kiếm. Tôi sẽ cho nó nó một cơ hội. Vì vậy, nó chỉ hoạt động trên bài viết mới?
chifliiiii

1
Đối với những người bắt gặp bài đăng này ngay bây giờ, đây là một plugin tương tự đang được tích cực phát triển: wordpress.org/plugins/fly-dynamic-image-resizer
Tim Malone

7

Đặt cái này trong tập tin chức năng chủ đề của bạn. Nó sẽ ngăn Wordpress tạo bất cứ thứ gì trừ 3 kích thước mặc định khi tải lên.

Khi một hình ảnh sau đó được yêu cầu ở một kích thước cụ thể, chưa được tạo, nó sẽ chỉ được tạo một lần.

        add_filter('image_downsize', 'ml_media_downsize', 10, 3);
        function ml_media_downsize($out, $id, $size) {
            // If image size exists let WP serve it like normally
            $imagedata = wp_get_attachment_metadata($id);
            if (is_array($imagedata) && isset($imagedata['sizes'][$size]))
                return false;

            // Check that the requested size exists, or abort
            global $_wp_additional_image_sizes;
            if (!isset($_wp_additional_image_sizes[$size]))
                return false;

            // Make the new thumb
            if (!$resized = image_make_intermediate_size(
                get_attached_file($id),
                $_wp_additional_image_sizes[$size]['width'],
                $_wp_additional_image_sizes[$size]['height'],
                $_wp_additional_image_sizes[$size]['crop']
            ))
                return false;

            // Save image meta, or WP can't see that the thumb exists now
            $imagedata['sizes'][$size] = $resized;
            wp_update_attachment_metadata($id, $imagedata);

            // Return the array for displaying the resized image
            $att_url = wp_get_attachment_url($id);
            return array(dirname($att_url) . '/' . $resized['file'], $resized['width'], $resized['height'], true);
        }


        add_filter('intermediate_image_sizes_advanced', 'ml_media_prevent_resize_on_upload');
        function ml_media_prevent_resize_on_upload($sizes) {
            // Removing these defaults might cause problems, so we don't
            return array(
                'thumbnail' => $sizes['thumbnail'],
                'medium' => $sizes['medium'],
                'large' => $sizes['large']
            );
        }

Filer này phải là tiêu chuẩn trong WordPress. Tại sao tạo mọi kích thước cho mọi hình ảnh? Tôi đang thêm mã này vào chủ đề tùy chỉnh của tôi. Cảm ơn
Michaelkay

2
Đẹp nhưng bây giờ nó vẫn sẽ tạo ra tất cả các hình ảnh nếu tôi chỉ cần một kích thước tùy chỉnh ..
Gijs

Nó xảy ra khi tôi sử dụng các đối tượng hình ảnh từ các trường tùy chỉnh nâng cao
Gijs

Không hoạt động NẾU add_image_size trước đây đã được xác định với kích thước hình ảnh vừa thay đổi
Benjamin Intal

@Michaelkay có một hình phạt hiệu suất trong phương pháp này. Khi hình ảnh được tải lên và sau đó được tạo cho mọi kích thước, có nghĩa là người tải lên là người kiên nhẫn. Mã này khiến khách truy cập của bạn phải kiên nhẫn hơn và Google đã chứng minh các trang web mất hơn 2 giây để tải, giảm 50% số người. Ngoài ra nếu trang web của bạn có hàng trăm lượt truy cập đồng thời, điều này sẽ làm sập các máy chủ của bạn.
Tom Roggero

2

Thật không may, câu trả lời của @ Patrick phá vỡ các chức năng srcset được giới thiệu trong WP 4.4. May mắn thay, chúng ta chỉ cần thêm hai chức năng bổ sung!

Trước tiên, chúng tôi cần tạm thời giới thiệu lại tất cả các kích thước hình thu nhỏ đã đăng ký cho siêu dữ liệu hình ảnh để có thể xem xét:

function bi_wp_calculate_image_srcset_meta($image_meta, $size_array, $image_src, $attachment_id){
    //all registered sizes
    global $_wp_additional_image_sizes;

    //some source file specs we'll use a lot
    $src_path = get_attached_file($attachment_id);
    $src_info = pathinfo($src_path);
    $src_root = trailingslashit($src_info['dirname']);
    $src_ext = $src_info['extension'];
    $src_mime = wp_check_filetype($src_path);
    $src_mime = $src_mime['type'];
    $src_base = wp_basename($src_path, ".$src_ext");

    //find what's missing
    foreach($_wp_additional_image_sizes AS $k=>$v)
    {
        if(!isset($image_meta['sizes'][$k]))
        {
            //first, let's find out how things would play out dimensionally
            $new_size = image_resize_dimensions($image_meta['width'], $image_meta['height'], $v['width'], $v['height'], $v['crop']);
            if(!$new_size)
                continue;
            $new_w = (int) $new_size[4];
            $new_h = (int) $new_size[5];

            //bad values
            if(!$new_h || !$new_w)
                continue;

            //generate a filename the same way WP_Image_Editor would
            $new_f = wp_basename("{$src_root}{$src_base}-{$new_w}x{$new_h}." . strtolower($src_ext));

            //finally, add it!
            $image_meta['sizes'][$k] = array(
                'file'      => $new_f,
                'width'     => $new_w,
                'height'    => $new_h,
                'mime-type' => $src_mime
            );
        }
    }

    return $image_meta;
}
add_filter('wp_calculate_image_srcset_meta', 'bi_wp_calculate_image_srcset_meta', 10, 4);

Sau đó, chúng ta cần chạy qua các trận đấu và tạo ra bất kỳ hình thu nhỏ bị thiếu:

function bi_wp_calculate_image_srcset($sources, $size_array, $image_src, $image_meta, $attachment_id){

    //get some source info
    $src_path = get_attached_file($attachment_id);
    $src_root = trailingslashit(pathinfo($src_path, PATHINFO_DIRNAME));

    //the actual image metadata (which might be altered here)
    $src_meta = wp_get_attachment_metadata($attachment_id);

    //an array of possible sizes to search through
    $sizes = $image_meta['sizes'];
    unset($sizes['thumbnail']);
    unset($sizes['medium']);
    unset($sizes['large']);

    $new = false;

    //loop through sources
    foreach($sources AS $k=>$v)
    {
        $name = wp_basename($v['url']);
        if(!file_exists("{$src_root}{$name}"))
        {
            //find the corresponding size
            foreach($sizes AS $k2=>$v2)
            {
                //we have a match!
                if($v2['file'] === $name)
                {
                    //make it
                    if(!$resized = image_make_intermediate_size(
                        $src_path,
                        $v2['width'],
                        $v2['height'],
                        $v2['crop']
                    )){
                        //remove from sources on failure
                        unset($sources[$k]);
                    }
                    else
                    {
                        //add the new thumb to the true meta
                        $new = true;
                        $src_meta['sizes'][$k2] = $resized;
                    }

                    //remove from the sizes array so we have
                    //less to search next time
                    unset($sizes[$k2]);
                    break;
                }//match
            }//each size
        }//each 404
    }//each source

    //if we generated something, update the attachment meta
    if($new)
        wp_update_attachment_metadata($attachment_id, $src_meta);

    return $sources;
}
add_filter('wp_calculate_image_srcset', 'bi_wp_calculate_image_srcset', 10, 5);

Chỉ cần một cái đầu để cho bạn biết rằng điều này sẽ phá vỡ khó khăn! Tôi đã mất nhiều giờ để biết rằng đây là thủ phạm. Tôi đang nghiên cứu giải pháp ...
Constantin Groß

1

Trên thực tế, add_image_size()không tạo ra hình thu nhỏ, nó chỉ đăng ký kích thước hình ảnh có sẵn cho WordPress.

Thông thường, hình thu nhỏ được tạo khi hình ảnh được tải lên lần đầu tiên. Đây là một quy trình tự động, do đó bạn không phải lo lắng về việc tạo chúng sau này. Hãy nghĩ về nó theo cách này - nếu mất 1-2 giây để tạo hình thu nhỏ trên máy chủ chậm và bạn đợi cho đến khi được yêu cầu, bạn buộc người yêu cầu phải đợi thêm 1-2 giây cho mỗi hình ảnh để xem nội dung. Làm điều này dễ dàng hơn nhiều trước thời hạn - tức là khi hình ảnh được tải lên.

Đồng thời, nếu bạn hoàn toàn phải xử lý các hình thu nhỏ tại một thời điểm khác nhau, bạn có thể muốn xem qua plugin Thumbener Regenerate của Viper's . Nó sử dụng một hành động theo yêu cầu để tạo lại tất cả các hình thu nhỏ hình ảnh của bạn ... nhưng bạn có thể sử dụng mã tương tự để tạo hình thu nhỏ chỉ khi cần thiết.


Tôi nghĩ rằng bạn đã không nhận được điểm. Anh ta muốn kiểm soát những hình ảnh mà một hình thu nhỏ là cần thiết. Vì vậy, một số hình ảnh không cần phải thay đổi kích thước.
Drunken Master

Hầu hết mọi người kiểm tra các trang khi chèn ảnh (tôi cảm thấy khá tiết kiệm khi nói tất cả) Chúng sẽ gây ra việc tạo các tệp cần thiết một lần và bạn đã hoàn tất. Trong trường hợp của tôi, tôi có một kích thước hình ảnh tiêu đề được đăng ký. Khoảng 1 trong 20 hình ảnh tôi tải lên thực sự là cho tiêu đề. Vì vậy, 19 trong 20 hình ảnh trong thư viện của tôi là một sự lãng phí không gian.
JpaytonWPD

1

Có cách nào để bắn add_image_size chỉ khi cần?

Không chính xác. Nhưng bạn có thể lọc danh sách các kích thước đã đăng ký ngay trước khi hình thu nhỏ được tạo. Hàm wp_generate_attachment_metadata () (gọi hàm tạo ra hình thu nhỏ) có một bộ lọc gọi là "trung gian_image_sizes_advified", cho phép bạn thao tác với mảng kích thước ngay trước khi tệp được tạo. Bạn có thể sử dụng bộ lọc này bất cứ khi nào bạn thêm hình ảnh của một "loại" nhất định, và sau đó xóa nó ngay sau đó.

Tôi đoán thử thách lớn nhất của bạn sẽ là tìm ra cách phân biệt giữa các hình ảnh cần kích thước phụ và những hình ảnh không có.


tôi sẽ phải thêm một tùy chọn hoặc hộp kiểm khi tôi tải phương tiện để chọn ngón tay cái tôi muốn tạo ví dụ. Nghe có vẻ hay nhưng tôi không biết làm thế nào để làm điều đó
chifliiiii

1

Bạn có thể sử dụng plugin "Dynamic Image Resize" 1) của tôi (không phải Ottos) .

Thay đổi kích thước hình ảnh động của điện tử là một plugin WordPress (MU-) cung cấp một mã ngắn và thẻ mẫu để thay đổi kích thước hình ảnh trên chuyến bay, không cần TimThumb, nhưng với các chức năng cốt lõi của WP.

Plugin đi kèm với thẻ mẫu và shortcode là tốt.

1) Chỉ cần tìm hiểu về plugin Ottos. Đặt tên va chạm không có ý định.



0

Plugin WP Performance Pack cung cấp "xử lý hình ảnh được cải thiện", dựa trên Ottos Dynamic Image Resizer, nhưng bao gồm nhiều cải tiến, ví dụ: Trước hết, nó tương thích với Phiên bản WordPress mới nhất (3.9.1), sử dụng WP_Image_Editor, lưu hình thu nhỏ có thể bị tắt (nhưng chúng có thể được lưu trong bộ nhớ cache và Hỗ trợ CDN đang hoạt động), tái tạo tích hợp Thumbails (để xóa hình thu nhỏ hiện có) và một số thứ khác.


-1

Bạn cũng có thể thử Aqua Resizer - https://github.com/syamilmj/Aqua-Resizer/

Nó chỉ là một tập tin.

Bạn có thể sử dụng nó như thế này:

$img_src = aq_resize( $img_src, $width = null, $height = null, $crop = null, $single = true, $upscale = false );

$img_src = aq_resize( $img_src, 150, 150); // resized
$img_src = aq_resize( $img_src, 150, 150, true); // cropped
$img_src = aq_resize( $img_src, 150, 150, null, null, true); // image with 120x120 for example will be upscaled up to 150x150

-1

Đây là một cách tiếp cận khác: Nó liên quan đến việc xử lý lỗi 404 HTTP. Đó là, khi hình thu nhỏ không có sẵn, hãy tìm hình ảnh gốc và tạo hình thu nhỏ. Lưu ý rằng điều này không thực sự giải quyết vấn đề của bạn, vì nó không tạo ra hình thu nhỏ trong quá trình tải lên.

Cũng lưu ý rằng plugin này có thể được sử dụng bởi người dùng độc hại để tạo bất kỳ số lượng hình thu nhỏ nào và do đó làm cạn kiệt dung lượng đĩa của bạn.

Lưu ý: Plugin này có thể dễ dàng được cài đặt bằng Pluginception .

<?php
/*
Plugin Name: Create thumbnails on demand
Plugin URI: 
Description: Create thumbnails instead of showing 404. Use in combination with "Broken Link Checker" to create all missing thumbnails.
Version: 0.1
Author: Jack Miller
Author URI: 
License: 
License URI: 
*/
add_filter('status_header', 'createThumbIf404');
function createThumbIf404($httpCodeString) //e.g. HTTP/1.1 200 OK 
{
    global $wp_query;
    error_reporting(E_ALL);
    ini_set('display_errors', 1);

    $httpCode = explode(" ", $httpCodeString);
    $httpCode = $httpCode[1];
    if ($httpCode == "404") {
        $requestUri = $_SERVER["REQUEST_URI"];
        $regex = '/^\/(wp-content\/uploads\/(?:[a-zA-Z0-9]*\/){2})(.*)-(.*)x(.*)\.jpg$/';
        preg_match($regex, $requestUri, $groups);
        if (sizeof($groups) === 5) {
            $baseDir  = $groups[1];
            $baseName = $groups[2];
            $sizeX    = $groups[3];
            $sizeY    = $groups[4];

            $oriImg = ctod_checkFile($baseDir, $baseName);
            if ($oriImg != null) {

                $image = wp_get_image_editor($baseDir . $oriImg);
                if (!is_wp_error($image)) {
                    $image->resize($sizeX, $sizeY, true);
                    $thumb = $baseDir . $baseName . '-' . $sizeX . 'x' . $sizeY . '.jpg';
                    $image->save($thumb);
                    ctod_sendImageAndExit($thumb);
                }
            }
        }
    }
}
//finds original image within $baseDir with $baseName.
//Returns file name including extension of original image or null.
function ctod_checkFile($baseDir, $baseName)
{
    $arr = array(
        ".jpg",
        ".JPG",
        ".jpeg",
        ".JPEG"
    );
    foreach ($arr as &$ext) {
        if (file_exists($baseDir . $baseName . $ext)) {
            return $baseName . $ext;
        }
    }
    return null;
}
//Read file at $path from disk and return it as HTTP JPG image request.
function ctod_sendImageAndExit($path)
{
    $fp = fopen($path, 'rb');
    header("Content-Type: image/jpeg");
    header("Content-Length: " . filesize($path));
    fpassthru($fp);
    exit();
}
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.