WordPress圖床教學|用 Digital Ocean 當圖床減輕網站空間

WordPress圖床教學|用 Digital Ocean 當圖床減輕網站空間

文章最後更新日期:2023年12月27日

前言

相信有再用 WordPress 寫部落格的人都有一個困擾就是圖片越來越多,網站速度變慢怎麼辦?上千張圖片到底要怎麼管理?

這一篇要跟大家分享 WordPress圖床教學,分享怎麼用 Digital Ocean當圖床,減輕你的 WordPress 網站空間。

Digital Ocean 是需要付費的唷,但是非常的便宜,雲端存儲 250 GB 一個月只要 5 美金,按量計費,我的網站用 Digital Ocean 當圖床後,加上上傳時的優化,幾千張照片根本用不到 1 GB,算下來一個月都不到 1 元美金。

使用推薦連結註冊,可免費獲得 200 元美金,使用限制 60 天。

DigitalOcean Referral Badge 


WordPress圖床教學

step 1

註冊 Digital Ocean

立即註冊 DigitalOcean

先註冊 DigitalOcean 帳號

WordPress圖床教學|用 Digital Ocean 當圖床減輕網站空間2 (11)

註冊完後在 Digital Ocean 操作介面中左邊的 API 創建 Generate New Key,這兩個框中的 Key 要先存好,接著我們要回到 Wordpress 中下載外掛進行設定。

WordPress%E5%9C%96%E5%BA%8A%E6%95%99%E5%AD%B8%EF%BD%9C%E7%94%A8 Digital Ocean %E7%95%B6%E5%9C%96%E5%BA%8A%E6%B8%9B%E8%BC%95%E7%B6%B2%E7%AB%99%E7%A9%BA%E9%96%932 1

step 2

下載 WP Offload Media Lite 外掛

這個外掛是「之後」 在 WordPress 網站有圖片上傳時,會直接將圖片存在 Digital Ocean 空間,而不是你的網站主機空間。

將剛剛在 Digital Ocean 複製的 Key 分別貼上來後儲存,可參考下圖進行設定。

WordPress%E5%9C%96%E5%BA%8A%E6%95%99%E5%AD%B8%EF%BD%9C%E7%94%A8 Digital Ocean %E7%95%B6%E5%9C%96%E5%BA%8A%E6%B8%9B%E8%BC%95%E7%B6%B2%E7%AB%99%E7%A9%BA%E9%96%932 2

step 3

創建一個新的容器,取你網站的名字就可以了,然後按儲存。

容器類似資料夾的概念,如果你有 2 – 3 個網站,可以分別創建不同的容器(資料夾)來儲存你的網站圖片。

WordPress%E5%9C%96%E5%BA%8A%E6%95%99%E5%AD%B8%EF%BD%9C%E7%94%A8 Digital Ocean %E7%95%B6%E5%9C%96%E5%BA%8A%E6%B8%9B%E8%BC%95%E7%B6%B2%E7%AB%99%E7%A9%BA%E9%96%932 3

step 4

上一步儲存完後會跳出這個畫面,都不需要改,按照預設的就可以了。

WordPress%E5%9C%96%E5%BA%8A%E6%95%99%E5%AD%B8%EF%BD%9C%E7%94%A8 Digital Ocean %E7%95%B6%E5%9C%96%E5%BA%8A%E6%B8%9B%E8%BC%95%E7%B6%B2%E7%AB%99%E7%A9%BA%E9%96%932 4

WordPress%E5%9C%96%E5%BA%8A%E6%95%99%E5%AD%B8%EF%BD%9C%E7%94%A8 Digital Ocean %E7%95%B6%E5%9C%96%E5%BA%8A%E6%B8%9B%E8%BC%95%E7%B6%B2%E7%AB%99%E7%A9%BA%E9%96%932 5

因為 WP Offload Media Lite 這個外掛只處理安裝後將圖片傳到 Digital Ocean 空間,所以接下來要來處理之前的照片,這時候要下載另一個外掛。

step 5

下載 reGenerate Thumbnails Advanced 外掛

這個外掛是將「之前」 已經上傳在 WordPress 網站的圖片都傳到 Digital Ocean 去。

下載後先在右邊進行設定,照著我的圖片設定,然後儲存。

WordPress%E5%9C%96%E5%BA%8A%E6%95%99%E5%AD%B8%EF%BD%9C%E7%94%A8 Digital Ocean %E7%95%B6%E5%9C%96%E5%BA%8A%E6%B8%9B%E8%BC%95%E7%B6%B2%E7%AB%99%E7%A9%BA%E9%96%932 6

接著左邊的按紐會變成藍色,按下Regenerate

WordPress%E5%9C%96%E5%BA%8A%E6%95%99%E5%AD%B8%EF%BD%9C%E7%94%A8 Digital Ocean %E7%95%B6%E5%9C%96%E5%BA%8A%E6%B8%9B%E8%BC%95%E7%B6%B2%E7%AB%99%E7%A9%BA%E9%96%932 7

跳出這個畫面就代表正在將你之前存在網站主機中的圖轉傳到 Digital Ocean Space,等待它傳完就可以了。

WordPress圖床教學|用 Digital Ocean 當圖床減輕網站空間2 (8)

step 6

傳完後,到媒體庫中看你的圖片網址,網址變成 Digital Ocean 就代表成功囉。

WordPress圖床教學|用 Digital Ocean 當圖床減輕網站空間2 (9)

step 7

接著回到 Digital Ocean 介面中的 Space,可以查看每個網站已使用的空間。

WordPress圖床教學|用 Digital Ocean 當圖床減輕網站空間2 (10)

以上步驟操作完,就可以把 reGenerate Thumbnails Advanced 外掛刪掉了。

之後上傳的照片,靠 WP Offload Media Lite 這個外掛就可以了。如果不放心的話,在設定完之後第一次上傳圖片,可以再次查看圖片網址是不是有自動存在 Digital Ocean。

為什麼網站需要圖床?

不管是部落格、電商、作品集網站,一定都會面臨到這個問題。當網站經營越久,圖片也越來越多,這時候整個網站資料都會變大,讀取速度就會變得很慢,如果網站載入太慢,網頁體驗都會被 Google 扣分,網站排名也會跟著下降。

這時候找個外部存儲空間讓網站圖片當圖床,使用外連而非占用網站空間,加快網站讀取速度,是網站經營長久的人都會進行優化的一個動作。

使用 Digital Ocean 當圖床的優點

就算你的網站圖片上傳到 Digital Ocean 後 Size 很大也不可能超過 250 GB,一個帳號可以添加到 100 個節點(網站),只收取合計性的費用,而且費用真的超級便宜,每個月幾乎花不到什麼錢。

對手上管理很多個網站的人來說,根本是節省網站空間的神助手。

結論

以上 7 個步驟 WordPress圖床教學是不是超簡單,還在煩惱 WordPress 圖片太多空間爆掉的人,趕緊把這招學起來!

我在 Google 搜尋 WordPress圖床文章時,資訊很少且看的不是很懂,操作又很麻煩,這個教學是花錢拜師學到後,再認真整理出來分享給大家的。

在此特別感謝電商修練站長路可的教學 😍

如果覺得文章對你有幫助,歡迎底下留言告訴我,就能幫助更多人看到這篇文章哦。

 

延伸閱讀:

5分鐘搞懂部落格新手如何寫出有人看的文章增加部落格流量

WordPress架站教學|如何購買網域?Gandi教學

WordPress架站教學|如何購買虛擬主機?Cloudways教學


歡迎追蹤我的 InstergramFB 粉絲專頁

對文章有任何問題也歡迎留言一起討論喔

在〈WordPress圖床教學|用 Digital Ocean 當圖床減輕網站空間〉中有 19 則留言

  1. 青青小樹

    最近也正好再思考這個問題呢!
    雖然有嘗試像波波黛利那種直接嵌入IG的圖片
    但是他上下都會顯示太多圖片以外的資訊有點不方便閱讀

    1. 哈哈如果你的文章有需要,是可以嵌入幾個,Popdaily有點太多了,我是覺得他是開放媒體,所以才需要這麼多分享圖^^

    1. 正常步驟是需要先把圖片都壓縮好在上傳會比較好,因為檔案太大在flickr讀取慢的話,嵌入的連結也會受到讀取的影響,但因為我的照片量不多,我就省略這個步驟了,裁切的話我個人是覺得不太需要,因為照片是讀整張,不太會被剪掉

  2. 您好~方便請教 網頁上的右下角的”統計 今日瀏覽次數跟總瀏覽次數”是使用什麼外掛?

    1. Sislin席斯琳

      哈囉,我是用WP Statistics這個外掛,加上sidebar側邊欄小工具讓他顯示出來的哦^^

    1. Sislin席斯琳

      哈囉,我是用convertkit這個電子報做的哦,再用側邊欄小工具插入語法

      1. aoc1210

        你好,如果用Flickr當圖床外連,照片的解析度都會降低,想問這個有辦法設定或解決嗎?

        1. 席斯琳(Sislin)

          你好,我現在改用 digitalocean 當圖床,直接上傳到 WORDPRESS,但是照片是存在 digitalocean,就不吃網站的大小速度哦,但是還沒有時間寫教學文章更新XD https://m.do.co/c/d66b0d4cecbe

        2. 席斯琳(Sislin)

          Hi,我更新了文章新的圖床教學,可以看看喔

  3. 您好 請問是每個月都要收5美的雲端費用嗎?謝謝您的回答!

    1. 加入會員開始使用,需要先儲值5美元,每月依照容量扣款,會用儲值的錢扣,我200多MB平均一個月扣1美元,供你參考

  4. 您好,因為我們公司網站圖片很多,有11GB,用digital ocean這個方式生成後,看媒體庫那邊的圖片網址應該都已經搬過去,但現在看WP後台還是顯示網站大小有11GB,想請問這是為什麼呢~我還以為圖片搬過去後,網站就會自動瘦身

    1. 圖片上傳後,會有兩個動作,一個動作是存在digital ocean,另一個動作一樣會存在網站中,但是圖片顯示改用抓取digital ocean的雲端顯示,需要將存在網站中的圖片都刪除,網站才會瘦身,但要確認都已經備份好了在刪喔~之後上傳的我記得外掛好像有個選項可以打勾定期刪除或自動刪除網站圖片

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

返回頂端