內容更新於 — 2023-06-17 22:19
這是一個關於WordPress媒體庫圖片分別儲存在主機以及Amazon S3儲存桶的苦主,卻想要使用WP Offload Media Lite外掛免費將主機裡的舊圖片重新產生新增的自訂略縮圖之後上傳到S3儲存桶,再使用ShortPixel外掛壓縮圖片的故事。
這篇文章要討論的工具與外掛包含:
像我這種不懂指令也不會使用終端機訪問資料庫的人,想要將媒體庫搬到Amazon S3或Google Cloud Storage…等等的雲儲存裡面,通常都只能透過像是WP Offload Media Lite或者是Media Cloud這類型能夠《將媒體庫連接到雲儲存》的外掛。
如此一來,之後在WordPress後台所上傳的新圖片,都會直接被扔到S3儲存桶或GCS裡面了;當然,你可以選擇上傳到雲儲存之後,主機裡是否也要保留。
我目前就是使用WP Offload Media Lite這個外掛來連接媒體庫與S3儲存桶。
但是呢,使用外掛就意味著偶爾會伴隨著只能爽一半的遺憾!(笑)
因為這類型幫你把媒體庫連接到雲儲存的外掛,都會提供免費版與付費版;免費版的功能可以幫我們把新上傳的圖片扔到S3儲存桶裡面,我們只需要一如往常地從媒體庫或WordPress後台的任何地方上傳圖片即可,遺憾的是它們不處理以前就存在主機裡的那些舊圖片,也就是說,當你開始使用這類型的外掛將新上傳的圖片扔到S3儲存桶裡面,舊圖片還是一樣在主機裡面;如果想要把以前在主機裡的舊圖片也扔到S3儲存桶裡面,那就得購買外掛的付費版,這就是免費與付費之間最有感的差異。
我目前試過這三個圖片相關的外掛,都可以免費完成這件事情。雖然這並不是這些外掛的原意,但是我猜可能是因為它們所做的工作,剛好可以觸發那些《將媒體庫連接到雲儲存的外掛》認為這是一個《上傳新圖片》或者是《處理媒體庫圖片》的事件,於是便把那些透過這三個外掛處理過的主機裡的舊圖片認定為《新圖片》,進而將它們上傳到S3儲存桶裡面,我的蠢蠢理解大概是這樣的運作原理。
如果只是單純想要把主機裡的舊圖片也上傳到S3儲存桶裡面,Regenerate Thumbnails是最不容易出錯的選擇。
它其實是《重新產生略縮圖》的外掛,一共有2個地方+3種選擇作為產生略縮圖的途徑。
無論是從哪裡處理、處理所有或單一圖片,一定要記得以下這二個選項要勾選正確
第一項取消打勾(不勾)☞無論略縮圖是否已經存在,都要重新產生,所以不勾。
第二項一定要打勾(要勾)☞要刪除沒用的略縮圖,所以要打勾。
最後,點擊藍色按鈕《Regenerate Thumbnails》。
這裡有圖文教學
ShortPixel是我用過壓縮效果最有感的圖片優化外掛,而且它與WP Offload Media Lite能夠搭配使用。即使已經將新上傳的圖片透過WP Offload Media Lite扔進s3儲存桶,一樣可以使用ShortPixel壓縮S3儲存桶裡面的圖片。
雖然說ShortPixel能與WP Offload Media Lite搭配使用,壓縮S3儲存桶裡面的圖片;但是,如果你和我一樣,主機裡還有以前的舊圖片,又想要壓縮主機裡的舊圖片,就比較麻煩了。
假設在WP Offload Media Lite啟用的情況下,又想要使用ShortPixel壓縮主機裡的舊圖片,這時候就會發現,這些舊圖片被壓縮之後就會自動被上傳到S3儲存桶了! 是的,主機內的舊圖片就這樣透過壓縮圖片自動被《將媒體庫連接到雲儲存的外掛》上傳到S3儲存桶了。
但這不是一個完美的結局,因為隨後回到媒體庫列表中,就會發現圖片的小縮圖變成空白;除此之外,如果那張圖片同時也是文章的特色圖片,就會發現文章列表中的小縮圖變成破圖了!
但是也不用太擔心,只需要再透過【Regenerate Thumbnails】重新產生略縮圖,就可以讓讓小縮圖正常顯示囉~
但是要特別注意的是,Regenerate Thumbnails與ShortPixel這二個外掛可能會有衝突,所以請先停用其中一個,再啟用另外一個執行工作。
這裡有圖文教學
因為最後還是得靠【Regenerate Thumbnails】讓上傳到S3儲存桶的舊圖片恢復在媒體庫列表中的小縮圖。所以,如果想要靠ShortPixel優化舊圖片,建議先使用【Regenerate Thumbnails】來上傳主機內的舊圖片到S3儲存桶,再使用ShortPixel直接壓縮S3儲存桶裡面的圖片就可以了。
當然,如果已經先使用【Regenerate Thumbnails】將主機裡的舊圖片上傳到S3儲存桶了,那就可以正常使用ShortPixel來優化S3儲存桶裡面的圖片囉~
reGenerate Thumbnails Advanced也是重新產生略縮圖的外掛,但是它的功能比【Regenerate Thumbnails】還要更多一點,最有用的功能就是它可以新增自訂的略縮圖尺寸。除此之外,reGenerate Thumbnails Advanced是由ShortPixel所開發,所以二者完全相容,可以同時啟用,互相支援。
因為WordPress預設能夠更改的略縮圖只有3個尺寸,如果想要增加其他的略縮圖尺寸,就可以使用reGenerate Thumbnails Advanced新增想要的略縮圖尺寸,並且重新產生略縮圖。
reGenerate Thumbnails Advanced和【Regenerate Thumbnails】一樣,都是在重新產生略縮圖的時候,將主機內的圖片透過那些《將媒體庫連接到雲儲存的外掛》自動被上傳到S3。
但是reGenerate Thumbnails Advanced不太穩定,有時候主機裡的圖片上傳到S3儲存桶之後,會和ShortPixel一樣,媒體庫與文章列表中的小縮圖會變成空白或破圖。但是大家不用擔心,就和前面處理ShortPixel的做法一樣,先將reGenerate Thumbnails Advanced停用,再啟用【Regenerate Thumbnails】重新產生略縮圖就可以再次解決了。
雖然reGenerate Thumbnails Advanced可以創建新的自訂略縮圖,但是如果想要用來將主機內的舊圖片也上傳到S3儲存桶,它就沒那麼穩定,有時候媒體庫裡的小圖示還是會變成空白,但是有時候卻不會。
除非有特別需要創建新的略縮圖,否則,如果想要將主機內的圖片自動上傳到S3,還是使用Regenerate Thumbnails重新產生略縮圖會比較簡單。
在我目前使用過的外掛中,Regenerate Thumbnails、reGenerate Thumbnails Advanced以及ShortPixel,這三個外掛都能夠在啟用WP Offload Media Lite的前提下,將主機裡的舊圖片上傳到S3儲存桶,但是Regenerate Thumbnails才是最不會出錯的選擇。
除非有其他需求,否則會建議使用Regenerate Thumbnails就好。
因為Regenerate Thumbnails無法新增自訂的略縮圖尺寸,這時候就得靠reGenerate Thumbnails Advanced了。
反正最後的結果還是得派Regenerate Thumbnails來解決媒體庫小縮圖不顯示的問題,所以我測試過好幾種組合順序,歸納出以下的結論:
如果想要新增自訂的略縮圖,是可以靠reGenerate Thumbnails Advanced這個外掛。
但是如果在WP Offload Media Lite啟用的情況下,它似乎只對新上傳的圖片才能產生新增的自訂略縮圖,我試過對已經在S3儲存桶裡面的圖片似乎無效?
但若是將WP Offload Media Lite停用,那麼它就可以對主機裡面的舊圖片新增自訂的略縮圖。倘若停用WP Offload Media Lite,就會讓已經在S3儲存桶裡面的圖片在前台無法正常顯示…
後來我發現只要在ShortPixel外掛設定中的Advanced,將《Optimize media on upload》這個選項打勾,就能防止reGenerate Thumbnails Advanced在重新產生略縮圖的過程中,將主機內的舊圖片上傳到S3儲存桶!
雖然不知道為什麼,不過這確實有用。
《Optimize media on upload》在ShortPixel的設定中,是為了讓新上傳的圖片在上傳過程中同時壓縮。因為重新產生略縮圖並不是上傳新圖片,所以即使勾選開啟這個功能,也不會有任何圖片被壓縮。
也就是說,為了讓使用reGenerate Thumbnails Advanced新增的自訂略縮圖尺寸也能上傳到S3儲存桶,那就先在主機裡面完成《重新產生自訂略縮圖》的工作。
為了防止執行reGenerate Thumbnails Advanced的時候,主機裡的舊圖片被自動上傳到S3儲存桶,所以ShortPixel外掛設定中一定要記得勾選《Optimize media on upload》這個選項。
後面會有詳細的操作步驟。
因為若是想要直接使用reGenerate Thumbnails Advanced對主機裡面的舊圖片新增自訂的略縮圖,並且把它們上傳到S3儲存桶裡面,不但會發生媒體庫列表的小縮圖變成空白的問題之外,通常在上傳到S3儲存桶裡面之後,也沒有因此產生那些新增的自訂略縮圖;除此之外,當圖片已經在S3儲存桶,也無法再使用reGenerate Thumbnails Advanced產生新的略縮圖尺寸。
所以,如果想要使用reGenerate Thumbnails Advanced產生新增的自訂略縮圖,如果圖片在主機裡面,那就先在主機裡面完成這個工作,會比較順利。
這時候主機裡的舊圖片已經產生新的自訂略縮圖,再使用Regenerate Thumbnails將這些主機裡的主圖+略縮圖一次上傳到S3儲存桶。 在Regenerate Thumbnails重新產生略縮圖的頁面中,有二個選項一定要勾選正確,否則一樣會發生媒體庫小縮圖無法正常顯示的問題!
☐Skip regenerating existing correctly sized thumbnails (faster).
✔Delete thumbnail files for old unregistered sizes in order to free up server space. This may result in broken images in your posts and pages.
請注意,在啟用Regenerate Thumbnails之前,請先將reGenerate Thumbnails Advanced停用,因為這二個都是重新產生略縮圖的外掛,同時啟用一定會發生錯誤!除此之外,ShortPixel也一併停用
這時候主機裡的舊圖片(包含新增的自訂略縮圖)都被上傳到S3儲存桶了,這時候就可以正常使用ShortPixel去壓縮這些圖片。
請注意,在啟用ShortPixel壓縮圖片之前,請先將Regenerate Thumbnails停用,並且將reGenerate Thumbnails Advanced啟用。
因為已經使用reGenerate Thumbnails Advanced產生新的自訂略縮圖,如果沒有啟用reGenerate Thumbnails Advanced的話,那新的自訂略縮圖將不會被納入壓縮的名單中。
而Regenerate Thumbnails則是因為可能會與ShortPixel以及reGenerate Thumbnails Advanced產生衝突,所以也要先停用。
STEP 1|確認WP Offload Media Lite已啟用
STEP 2|確認Regenerate Thumbnails已停用
STEP 3|啟用reGenerate Thumbnails Advanced
STEP 4|在reGenerate Thumbnails Advanced設定好需要的略縮圖尺寸
STEP 5|啟用ShortPixel
STEP 6|
前往ShortPixel/ShortPixel Plugin Settings/Advanced
打勾Optimize media on upload(Automatically optimize Media Library items after they are uploaded.)
這裡一定要記得打勾(請放心,因為接下來要做的不是上傳新圖片,所以不會有任何圖片被壓縮。)
STEP 7|
到媒體庫列表中,在需要產生新的略縮圖的圖片下方點擊【Regenerate Thumbnails】。
因為在ShortPixel的設定中有勾選上傳時同時優化,所以這時候產生的新的略縮圖會出現在主機裡面,不會上傳到S3儲存桶。
STEP 8|停用reGenerate Thumbnails Advanced
STEP 9|停用ShortPixel
STEP 10|啟用Regenerate Thumbnails
STEP 11|
到媒體庫列表中,在需要上傳到S3儲存桶的主機裡的舊圖片下方點擊【Regenerate Thumbnails】。
接著會跳轉到【Regenerate Thumbnails】的頁面,以下二個選項一定要勾選正確,否則一樣會發生媒體庫小縮圖無法正常顯示的問題!
☐Skip regenerating existing correctly sized thumbnails (faster).
✔Delete thumbnail files for old unregistered sizes in order to free up server space.
第一個取消打勾(不勾)☞無論略縮圖是否已經存在,都要重新產生,所以不勾。
第二個一定要打勾☞要刪除沒用的略縮圖,所以要打勾 最後,點擊藍色按鈕《Regenerate Thumbnails》。
STEP 12|
這時候主機裡的舊圖片(包含新增的自訂略縮圖)都會被上傳到S3儲存桶,媒體庫裡面的小縮圖也能正常顯示。
可以到S3儲存桶裡面檢查圖片,網址後綴與以往在主機裡一樣,只有前面的域名不同。
比如說,原本舊圖片在主機的路徑為wp-content/uploads/2018/10/image.jpg,就可以在S3儲存桶裡面的wp-content/uploads/2018/10/的資料夾裡面找到那組圖片。
STEP 13|停用Regenerate Thumbnails
STEP 14|啟用ShortPixel
STEP 15|如果也想要壓縮新增的自訂略縮圖,請同時啟用reGenerate Thumbnails Advanced。
STEP 16|到媒體庫列表中,在需要壓縮的圖片右方點擊藍色按鈕【Optimize Now】。
STEP 17| 在S3儲存桶檢查,就能看到(包含新增的自訂略縮圖)都能正常被壓縮,因為是壓縮S3儲存桶裡面的圖片,所以媒體庫的小縮圖也能正常顯示。
如何使用ShortPixel壓縮主機裡的圖片,不需要將它們上傳到S3儲存桶?
在啟用WP Offload Media Lite的狀態下,主機裡的舊圖片無法直接用ShortPixel優化。
要嘛先暫時停用WP Offload Media Lite,但是S3儲存桶裡面的圖片會無法顯示;要嘛整個網站先開啟維護模式,但是訪客會無法瀏覽網站內容;要嘛將網站拉到Staging Site壓縮完再推送到Live Site,但是這個做法太大工程,而且會可能會影響購物網站的訂單。
即便各有難處,比較建議的做法還是將網站開啟維護模式;如果操作時間很短,暫時停用WP Offload Media Lite也是一個作法,大不了就是暫時性的S3儲存桶裡面的圖片無法正常顯示而已。
這裡有更詳細的說明
★延伸閱讀☞如何對S3儲存桶裡面的圖片重新產生略縮圖?
如何將主機裡的舊圖片也上傳到S3儲存桶的解套方式就介紹到這裡了!如果有任何問題,歡迎在下方的留言板討論指教囉!
Copyright ©miriammibao.com all rights reserved|Designed by MiriamMibao温唯 Since 2014.