必要なときにのみサムネイルを生成する方法は?


18

1000枚の画像があります。必要な場合にのみワードプレスで親指を生成するにはどうすればよいですか?たとえば、ホームスライダーは10個の画像のみを使用しますが、他の1000個の画像にはスペースとリソースの無駄としてサムネイルが生成されることは望ましくありません。

必要なときにだけadd_image_sizeを起動する方法はありますか?

ありがとう

更新あなたが言及したように、実際にadd_image_sizeは起動する必要があるものではありません。すばらしいのは、the_post_thumbnail( 'slider-thumb')を使用するときにイメージのサイズ変更を実行することです。 たぶんこれは画像の最初のビューを遅くしますが、そのビューは通常私が実際に投稿を確認するときに生成されますので気にしません。

だから私の投稿、スライダー、ブログのサムネイル、ポートフォリオのサムネイルなどの間に1000枚の画像があり、スライダー用に10個の画像だけをサイズ変更したいので、他の990個の画像のサムネイルサイズを生成するための多くの無駄なリソースがあります。

私の英語がすみません


2
余分な990個の画像からサムネイルが生成されるのは、そもそも990個の未使用の画像よりも多くのスペースとリソースの無駄です。積極的に使用している画像のみをアップロードする方が意味がありませんか?
-SickHippie

より熟練したプログラマーがあなたのアイデアに対して有効な議論を提示しているとしても、私はそれが面白いと思います。サムを生成せずに画像をアップロードするプラグインとテーマをいくつか見ました(現時点ではどちらが不明です)。しかし、あなたの質問に対する私の大きな疑問は、いつそれが必要になるのかということです。。フィルターは何になりますか?
ブラソフィロ

1
誤解しています。投稿で990個の画像を使用していますが、ホームスライダーでは使用しません。それらのいくつかは私がポートフォリオのために親指を必要とし、他のものはブログの親指のためなどを必要とします
chifliiiii

回答:


12

OttoのDynamic Image Resizerプラグインをご覧ください

このプラグインは、WordPressが画像を作成する方法を変更し、実際にどこかで使用されている場合にのみ画像を生成します。このようにして作成された画像は、通常のアップロードディレクトリに保存され、後でウェブサーバーによって高速送信されます。その結果、スペースが節約され(必要なときにのみ画像が作成されるため)、画像のアップロードがはるかに高速になります(アップロード時に画像が生成されなくなるため)。


2
このプラグインには、古い投稿への画像の追加に問題があることに注意してください。パッチを歓迎します。
オットー

それはまさに私が探していたものです。試してみます。新しい投稿でのみ機能しますか?
chifliiiii

1
今、この記事に出くわすものに、ここでは積極的に開発されているように見えると同様のプラグインです:wordpress.org/plugins/fly-dynamic-image-resizer
ティム・マローン

7

これをテーマ関数ファイルに入れてください。アップロード時にWordpressが3つのデフォルトサイズ以外を作成するのを停止します。

まだ生成されていない特定のサイズで画像が要求されると、その画像は一度だけ作成されます。

        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']
            );
        }

このファイラーはWordPressの標準である必要があります。すべての画像のすべてのサイズを生成する理由 このコードをカスタムテーマに追加しています。ありがとう
マイケルケイ

2
いいのですが、カスタムサイズが1つだけあれば、すべての画像が生成されます。
Gijs15年

高度なカスタムフィールドの画像オブジェクトを使用すると発生します
-Gijs

add_image_sizeが以前に定義され、画像の寸法が変更されたばかりの場合は機能しません
ベンジャミン

@Michaelkayこのアプローチにはパフォーマンスの低下があります。画像がアップロードされ、すべてのサイズで生成される場合、アップローダーが忍耐力を持っていることを意味します。このコードにより、訪問者はさらに忍耐する必要があります。Googleは、読み込みに2秒以上かかるサイトを実証しており、50%の人々を落としています。また、サイトに何百もの同時アクセスがある場合、サーバーがダウンします。
トムロジェロ

2

残念ながら、@ Patrickの答えは、WP 4.4で導入されたsrcset関数を破壊します。幸いなことに、2つの追加関数を追加するだけです!

まず、登録されているすべてのサムネイルサイズをイメージメタデータに一時的に再導入して、それらが考慮されるようにする必要があります。

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

次に、一致を実行して、不足しているサムネイルを生成する必要があります。

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

これはハードクロップを壊すことをお知らせするためのヘッズアップです!これが犯人だとわかるのに何時間もかかった。私は...解決策に取り組んでいます
コンスタンティン・グロース

1

実際にadd_image_size()は、サムネイルを生成するのではなく、WordPressで使用可能な画像サイズを登録するだけです。

通常、サムネイルは画像が最初にアップロードされたときに生成されます。これは自動プロセスなので、後で生成することを心配する必要はありません。このように考えてください-遅いサーバーでサムネールを生成するのに1〜2秒かかり、リクエストされるまで待つ場合、コンテンツを見るために画像ごとにさらに1〜2秒待つよう要求者に強制します。事前にこれを行う方がはるかに簡単です。つまり、画像がアップロードされるときです。

同時に、絶対に別の時間にサムネイルを処理する必要がある場合は、Viperのサムネイル再生成プラグインをご覧ください。オンデマンドアクションを使用してすべての画像サムネイルを再生成ます...しかし、必要な場合にのみ同様のコードを使用してサムネイルを生成できます。


あなたはポイントを得なかったと思います。彼は、サムネイルが必要な画像を制御したいと考えています。そのため、一部の画像のサイズを変更する必要はまったくありません。
酔ったマスター

ほとんどの人は、写真を挿入するときにページをテストします(すべてを言ってかなり保存されていると感じています)。私の場合、ヘッダー画像のサイズが登録されています。アップロードする画像の20枚に1枚は実際にはヘッダー用です。したがって、私のライブラリの20枚の画像のうち19枚はスペースの無駄です。
JpaytonWPD 16

1

必要なときにだけadd_image_sizeを起動する方法はありますか?

ではない正確に。ただし、サムネイルが生成される直前に登録済みサイズのリストをフィルタリングできます。wp_generate_attachment_metadata()関数(サムネイルを生成する関数を呼び出す)には、 "intermediate_image_sizes_advanced"というフィルターがあり、ファイルが生成される直前にサイズの配列を操作できます。特定の「タイプ」の画像を追加するときはいつでもこのフィルターを使用し、その後すぐに削除できます。

あなたの最大の課題は、余分なサイズが必要な画像とそうでない画像を区別する方法を見つけることだと思います。


たとえば、メディアをアップロードするときにオプションやチェックボックスを追加して、生成したい親指を選択する必要があります。音の良いしかし、私はそれを行う方法についての手掛かりはないだ
chifliiiii

1

私の(Ottosではない)"Dynamic Image Resize" 1)プラグインを使用できます。

「Dynamic Image Resize」は、TimThumbを必要とせずにWPコア機能を使用して、「飛行中」に画像のサイズを変更するショートコードとテンプレートタグを提供するWordPress(MU-)プラグインです。

プラグインには、テンプレートタグとショートコード付属しています。

1)Ottosプラグインについて知りました。衝突の命名は意図されていません。



0

WP Performance Packプラグインは、Ottos Dynamic Image Resizerに基づく「改善された画像処理」を提供しますが、多くの改善が含まれています。オフにする(ただし、キャッシュすることができ、CDNサポートが有効になっている)、サムネイルの統合を再生成する(既存のサムネイルを削除する)など。


-1

Aqua Resizer- https://github.com/syamilmj/Aqua-Resizer/も試すことができます

それはただ一つのファイルです。

次のように使用できます。

$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

ここでさらに別のアプローチ:404 HTTPエラー処理へのフック。つまり、サムネイルが使用できない場合は、元の画像を見つけてサムネイルを作成します。アップロード中にサムネイルの生成が妨げられることはないため、これで問題が実際に解決されるわけではないことに注意してください。

また、悪意のあるユーザーがこのプラグインを使用して任意の数のサムネイルを作成し、ディスク領域を使い果たす可能性があることに注意してください。

注:このプラグインは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();
}
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.