WordPress 5.7 詳細更新內容及實測

WordPress 5.7版本已經正式發佈一段時間,我們也嘗試了一段日子,筆者感覺5.7帶來了更多好東西。

重點更新的內容及懶人包:更多區塊編輯器功能、管理後台色彩更新、一鍵HTTP變為HTTPS、全新Robots API、簡單延遲載入 iframe及持續優化jQuery 3.5.1

現在我們來詳細說說到底今次WordPress 5.7更新了什麼及有什麼需要注意的地方。

目錄

  • 區塊編輯器
  • 全新Robots API
  • 一鍵HTTP變HTTPS
  • 簡單延遲載入 iframe
  • 後台色彩更新
  • 持續優化jQuery 3.5.1

區塊編輯器

拖拉區塊

首先WordPress 5.7的區塊編輯器終於能夠讓你"新增區塊"拖拉區塊到你的文章內容中,從而令您更輕鬆處理您的文章內容。

社交媒體圖示大小

WordPress 5.7將會允許您隨時更改社交媒體圖示的大小

開啟/關閉完整高度區塊

WordPress 5.7新增了開啟/關閉完整高度,有時候你們會喜歡用全幅寬度做封面設計,但好多時候也只是全寬如果想做全高就需要額外做其他麻煩設定。

現在只需要一鍵就能做到開啟/關閉完整高度 (就是CSS裹的height: 100vh)

按鈕排版優化

WordPress 5.7於按鈕組區塊新增了垂直排列功能,您還能夠從預設的寬度百分比中進行調整。

全新Robots API

WordPress 5.7引入了新的Robots API功能,該API將允許開發人員以編程方式控制及更新網站上的Robots meta tag。

Robots meta tag將會通知搜索引擎如何對網站進行爬蟲及索引,您可以透過新增robots.txt到網站根目錄或使用robots meta tag來實現。

WordPress 5.7中新增了一個名為wp_robots的新功能,

function wporg_wp_robots_add_follow( $robots ) {
    $robots['follow'] = true;
    return $robots;
}
add_filter( 'wp_robots', 'wporg_wp_robots_add_follow' );

WordPress 5.7也將默認在robot meta tag中添加一個max-image-preview:large指令。這將允許搜索引擎在搜索結果中使用大圖片進行預覽。

以下是在您網站的源代碼中的樣子。

<!DOCTYPE html>
<html>
    <head>
        <meta name="robots" content="max-image-preview:large" />
    </head>

對於在設定 – 閱讀中關閉了搜索引擎可見度的網站,WordPress將會自動隱藏這個meta tag。

如果你想關閉這個功能,讓搜索引擎決定使用哪張圖片進行預覽,那麼你可以在你的主題或functions.php檔案新增以下代碼。 (如對程式碼沒太大認識請採用插件或於更改前執行一次檔案備份

remove_filter( 'wp_robots', 'wp_robots_max_image_preview_large' );

一鍵HTTP變HTTPS

以前當您將WordPress從HTTP轉移到HTTPS時,您必須手動更新內容中的URL。

WordPress 5.7將使您的網站更容易遷移到HTTPS。

現在你只需要到工具 – 網站狀態,只要您的網站是沒有HTTPS,你將會得到一個建議改進項目,只需點擊裹面的更新您的網站至HTTPS即會自動調整您的WordPress網站URL設定及內容裹的URL至HTTPS,無需再透過其他插件協助更改。

簡單延遲載入 iframe

WordPress 5.7將自動設定為iframe嵌入延遲載入(Lazy Load)。延遲載入是一種在頁面加載過程中將重要性低的資源延遲載入,屬於一種提高網站速度的技術。

從WordPress 5.5開始,WordPress已經默認對圖片使用了延遲載入。現在連您的iframe都能夠得到iframe

這意味著所有使用iframe的嵌入,例如YouTube,都能夠使用延遲載入來提高您的頁面加載速度。

後台色彩更新

在WordPress 5.7中,CSS中使用的所有顏色都被折疊為12種藍色、綠色、紅色和黃色、13種灰色、純黑色和純白色中的一種。

這個新的精簡調色板將過去WordPress源碼中的所有顏色折疊為7種核心顏色和56種色調範圍,滿足WCAG 2.0 AA推薦的與白色或黑色的對比度。

每個範圍內的顏色從淺到深在感知上是統一的,也就是說,它們從白色開始,每一步都以相同的數量變深。一半的範圍對黑色有4.5或更高的對比度,另一半對白色保持相同的對比度。

對這套顏色進行標準化,將有助於貢獻者做出一致的、無障礙的設計決策。我們鼓勵主題和插件開發者使用這個新的調色板,以使他們的產品和WordPress Core之間有更好的一致性。

使用現有CSS Core類的插件作者應該需要為全部設置為新的調色板,因為每個Core類都進行了相應的更新。

持續優化jQuery 3.5.1

WordPress核心正在從jQuery 1.12.4跳轉到jQuery 3.5.1! 這是一件大事,原因有很多種例如更現代化的功能、更好的DX和安全改進等等。

由於5.7版本後台所需的jQuery更少,所以於後台操作時稍微會有加快的感覺。

分享至:
Share on facebook
Share on twitter
Share on pinterest
Share on linkedin