[WordPress] 外掛分享: Fly Dynamic Image Resizer

WordPress 外掛 Fly Dynamic Image Resizer 的封面圖片。

前言介紹

  • 這款 WordPress 外掛「Fly Dynamic Image Resizer」是 2015-09-29 上架。 目前已經下架不再更新,不建議安裝使用。
  • 目前有 7000 個安裝啟用數。
  • 上一次更新是 2023-03-23,距離現在已有 771 天。超過一年沒更新,安裝要確認版本是否可用。以及後續維護問題!
  • 外掛最低要求 WordPress 3.0 以上版本才可以安裝。
  • 外掛要求網站主機運作至少需要 PHP 版本 5.6 以上。
  • 有 22 人給過評分。
  • 論壇上目前有 2 個提問,問題解答率 0%

外掛協作開發者

junaidbhura |

外掛標籤

images | resize | Dynamic | on the fly | media library |

內容簡介

進入 Github 倉庫 ♥

主題開發人員最大的問題之一是多個圖片尺寸的問題。當您在媒體庫上傳圖像時,WordPress 根據您使用 add_image_size() 定義的所有圖像尺寸自動創建縮略圖,無論您是否想使用它們。因此,wp-content/uploads 目錄中絕大多數圖像都是浪費,並且從未被使用過。這不是創建圖像尺寸的最佳方法。

透過本外掛,您可以創建任意數量的圖片尺寸,而無需擔心不必要的圖片尺寸佔用您的磁碟空間!

這是因為使用此外掛創建的圖像在第一次呼叫圖像時動態創建,而不是在上傳圖像時。您也可以單獨刪除每個圖像的緩存圖像,或刪除所有緩存圖像。

此外掛的運作原理

您可以透過使用 fly_add_image_size() 函數在代碼中定義圖片尺寸,或者在代碼中直接調用圖片尺寸
管理員上傳圖像到媒體庫,但fly動態圖像不會被創建
用戶對頁面進行第一次訪問,該圖像將動態創建並被存儲
用戶再次訪問該頁面,將提供圖像的存儲版本

文檔

以下是一些函數和示例代碼,可供您開始使用!

fly_get_attachment_image_src( $attachment_id, $size, $crop )

attachment_id (integer)(必填):圖像附件的ID
size (string/array)(必填):預定義的尺寸名稱,使用 fly_add_image_size 定義,或帶有寬度和高度的陣列。例如:array(500, 500)
crop (boolean / array)(可選):圖像是否應該剪裁,或剪裁位置

返回一個陣列:

array(
'src' => string,
'width' => integer,
'height' => integer
)

 

fly_get_attachment_image( $attachment_id, $size, $crop, $attr )

attachment_id (integer)(必填):圖像附件的ID
size (string/array)(必填):預定義的尺寸名稱,使用 fly_add_image_size 定義,或帶有寬度和高度的陣列。例如:array(500, 500)
crop (boolean / array)(可選):圖像是否應該剪裁,或剪裁位置
attr (array)(可選):一個屬性陣列。例如:array('alt' => 'Alt text', 'title' => 'Title text', 'class' => 'my-class', 'id' => 'my-id')

返回一個 HTML IMG 元素的字串:

Alt text

 

示例1:預定義的圖片尺寸

使用此方法在 functions.php 文件中定義所需的所有圖像尺寸。

if ( function_exists( 'fly_add_image_size' ) ) {
fly_add_image_size( 'home_page_square', 500, 500, true );
fly_add_image_size( 'home_page_square_2x', 1000, 1000, true );
fly_add_image_size( 'cropped_top_left', 1000, 1000, array( 'left', 'top' ) );
}

現在,使用我們剛剛定義的圖像尺寸來獲取文章縮略圖:

還有另一種方法可以完成這個任務:

原文外掛簡介

Check out the Github Repository ♥
One of the biggest problems theme developers face is the problem of multiple image sizes. When you upload an image in the media library, WordPress automatically creates thumbnails based on all the image sizes you have defined using add_image_size() whether you want to use them or not. So the vast majority of the images in wp-content/uploads directory are a waste, and are never used. This is not the optimum way of creating image sizes.
With this plugin, you can create as many image sizes as you want without the guilt of unnecessary image sizes taking up your disk space!
This is because the images created using this plugin are dynamically created when the image is called for the first time, rather than when it is uploaded. You can also delete the cached images for each image individually, or all the cached images.
How this plugin works

You either define an image size in your code using the fly_add_image_size() function, or directly call the image size in the code
The admin uploads the image in the media library, but the fly dynamic images are not created
The user visits the page for the first time, and the image is dynamically created and is stored
The user visits the page again for the second time, and the stored version of the image is served

Documentation
Here are some functions and example code to get you started!
fly_get_attachment_image_src( $attachment_id, $size, $crop )

attachment_id (integer)(required) : The ID of the image attachment
size (string/array)(required) : Either the name of the pre-defined size defined using fly_add_image_size, or an array with the width and height. Ex: array( 500, 500 )
crop (boolean/array)(optional) : Whether the image should be cropped, or the crop position

Returns an array:
array(
'src' => string,
'width' => integer,
'height' => integer
)

 
fly_get_attachment_image( $attachment_id, $size, $crop, $attr )

attachment_id (integer)(required) : The ID of the image attachment
size (string/array)(required) : Either the name of the pre-defined size defined using fly_add_image_size, or an array with the width and height. Ex: array( 500, 500 )
crop (boolean/array)(optional) : Whether the image should be cropped, or the crop position
attr (array)(optional) : An array of attributes. Ex: array( 'alt' => 'Alt text', 'title' => 'Title text', 'class' => 'my-class', 'id' => 'my-id' )

Returns a HTML IMG element string:
Alt text

 
Example 1: Pre-defined Image Sizes
In this method, you define as many image sizes as you want in your functions.php file.
if ( function_exists( 'fly_add_image_size' ) ) {
fly_add_image_size( 'home_page_square', 500, 500, true );
fly_add_image_size( 'home_page_square_2x', 1000, 1000, true );
fly_add_image_size( 'cropped_top_left', 1000, 1000, array( 'left', 'top' ) );
}

Now, lets get the post thumbnail using the image sizes we just defined:

Here’s another way you can do this:
'; ?>

Let’s get the image from our example above which has a crop position defined:

 
Example 2: Dynamic Image Sizes
Lets get the post thumbnail using some dynamic image sizes:

Here’s another way you can do this:
'; ?>

Lets get the post thumbnail cropped from the bottom right:

 
A note on Crop Positions
Crop positions are set using an array. The first parameter of the array needs to be the x-axis crop and the second parameter needs to be the y-axis crop. This feature will not work the other way around.
For example:
✓ fly_get_attachment_image( get_post_thumbnail_id(), array( 500, 500 ), array( 'right', 'bottom' ) ) Will work! 🙂
✘ fly_get_attachment_image( get_post_thumbnail_id(), array( 500, 500 ), array( 'bottom', 'right' ) ) Will not work! 🙁
Detailed Documentation
Check out the GitHub repository’s Wiki page for the full documentation: https://github.com/junaidbhura/fly-dynamic-image-resizer/wiki

各版本下載點

  • 方法一:點下方版本號的連結下載 ZIP 檔案後,登入網站後台左側選單「外掛」的「安裝外掛」,然後選擇上方的「上傳外掛」,把下載回去的 ZIP 外掛打包檔案上傳上去安裝與啟用。
  • 方法二:透過「安裝外掛」的畫面右方搜尋功能,搜尋外掛名稱「Fly Dynamic Image Resizer」來進行安裝。

(建議使用方法二,確保安裝的版本符合當前運作的 WordPress 環境。


1.0.0 | 1.0.1 | 1.0.2 | 1.0.3 | 1.0.4 | 1.0.5 | 2.0.0 | 2.0.1 | 2.0.2 | 2.0.3 | 2.0.4 | 2.0.5 | 2.0.6 | 2.0.7 | 2.0.8 | trunk |

延伸相關外掛(你可能也想知道)

  • JE Editable 》這個外掛可以讓您在您的網頁上建立可編輯的區域。只需要將願意要編輯的元素添加類名稱即可。它會即時地用新文字替換原始文字。, 原始文字不會遺失。當停用外...。

文章
Filter
Apply Filters
Mastodon