Gutenberg 古騰堡文章編輯
Gutenberg 古騰堡文章編輯

入門指南:使用 WordPress Gutenberg 古騰堡文章編輯器

WordPress Gutenberg 古騰堡文章編輯器是一個強大且直觀的工具,可幫助您更輕鬆地創建和編輯網站內容。無論您是新手還是有經驗的WordPress用戶,這篇文章都將為您提供簡單的教學,以確保您能夠充分利用Gutenberg古騰堡的功能。

目錄

WordPress 古騰堡編輯器是新編輯器的開發名稱,該編輯器現已合併到WordPress核心中,它取代了長期存在的視覺或「經典」編輯器。

一定要學會的 Gutenberg 古騰堡文章編輯,非常的簡單好用唷!

如何新增標題及段落?

點選左上角的方塊+號即可以新增你想要的區塊內容。標題的部分可以修改H2~H6。

文章編輯1
如何新增標題及段落

如果您網站的文章內文有設計目錄功能,那您就需要加上H2~H6的標題區塊!(H1通常是頁面標題或是文章標題,建議從H2開始設定)

截圖 2023 08 15 下午12.06.44
右側就是我們文章的目錄,左側則為H2標題,會出現在目錄之中。

直接在文字編輯區輸入文字時,後台會自己將此區塊定義為段落。點選第一個段落符號可以將這個區塊轉換成其他類型區塊。

文章編輯2
轉換成其他類型區塊

如何修改特定文字樣式、超連結、排版?

點選在文字段落或是標題時,會出現該區塊的小工具列,可以針對特定文字加上粗體斜體超連結等等。

也可以修改該段落的對齊方式。

文章編輯3
文字樣式。

由左至右分別為:

  • 區塊圖示
  • 拖放區塊(滑鼠移至此處即可拖移該區塊)
  • 上移或下移該區塊
  • 該段落對齊方式
  • 粗體(反白該區塊愈粗體的文字後點選)
  • 斜體(反白該區塊愈斜體的文字後點選)
  • 超連結(反白該區塊愈超連結的文字後點選,並輸入網址,可以設定是否另開新視窗)
  • 更多選項
文章編輯4
更多文字樣式。

點選更多選項,可以對文字進行更多編輯。

如何修改字型大小、顏色?

點選該區塊時,左邊會跑出設定欄,可以在這裡進行文字大小、色彩設定。色彩設定除了文字色彩也可以設定背景色彩。

文章編輯 5
文字大小、色彩、背景顏色設定。

測試:文字大小設定、文字色彩、背景色彩設定。

如何新增圖片或圖庫?

除了左上角的方塊+號,也可以點選區塊最後面的方塊+號,或是輸入斜線(/)選取區塊類型。

選擇圖片或圖庫後,即可上傳檔案或是從媒體庫選擇圖片。

文章編輯 6
新增圖片、圖庫。

圖庫測試:

選擇完照片後,可以修改圖片排列順序、圖片說明等等,右邊會出現圖庫設定欄位,可以修改圖庫的欄位設定、是否剪裁圖片、點選圖片時要連結到哪裏、圖片尺寸

如何嵌入YouTube影片?

選擇 YouTube 區塊後,貼上欲嵌入影片的 YouTube 網址即可,簡單又快速!

文章編輯 7
嵌入YouTube影片編輯區塊。

YouTube 影片嵌入測試:

使用 /(斜線)在編輯器中快速插入編輯區塊

要使用 「+」符號來插入編輯區塊,需要離開鍵盤點選,有時候會覺得使用起來沒有那麼流暢。因此,還有一種可以使用鍵盤快速插入編輯區塊的方法 :「/(斜線)」。

按下 「Enter」鍵換到新的段落編輯區塊後,輸入 / 然後是您想要插入編輯區塊中的第一個字母,可以看到與您的查詢匹配的所有編輯區塊的列表。

使用鍵盤上的箭頭選擇想要的編輯塊,然後按下 「Enter」即可選擇。新的編輯塊被會被插入!

使用 Markdown 語法

或許您就像大多數的開發人員一樣,習慣使用 Markdown 語法來創建內容,WordPress 古騰堡編輯器(Gutenberg)支持這種語法的有限使用,主要用於標題。例如,要插入 H3 標題可以直接輸入 “### + 空格”。古騰堡編輯器會自動將段落區塊轉換為 H3 級別的標題區塊。

延伸閱讀:

各種ChatGPT及AI工具應用、指令手冊、解決方案,每週更新。
學習最新AI工具,就上Learn AI
AI如何讓工作更輕鬆、更有效率?立刻學習!
LA廣告-1
LA廣告-2
LA廣告-3
Related Post
最新文章
google site:
Google 搜尋 site: 命令教學,精準搜尋特定網站

Google搜尋功能強大,但你知道如何限定搜尋範圍嗎?透過「site:」指令,你可以在指定的網站內進行搜尋,快速找到所需的資訊。這篇文章將帶你深入了解「site:」指令的用法,並提供實用的搜尋範例。

圖片優化、圖片格式
圖片優化新選擇!WebP、AVIF如何提升網站速度

網站圖片佔據了網頁的一大部分,圖片優化是提升網站速度的關鍵。傳統的 JPEG 和 PNG 格式雖然常見,但 WebP 和 AVIF 這兩種新興的圖片格式,在壓縮率和畫質上都有更出色的表現。本文將詳細介紹 WebP 和 AVIF 的特性、優缺點,並提供實用的優化技巧,幫助您打造一個快速、高效的網站。

Selected Post
精選文章
WordPress 維護
實用!16 個 WordPress 維護的技巧手冊

網站架好了要如何進行 WordPress 維護?你需要定期維護網站核心功能、安裝的外掛、主題和其他方面。WordPress 是一個很棒的內容管理平台,但做好網站維護是讓你的網站在市場上走得更久的關鍵。

WordPress SMTP
SMTP是什麼?收不到 WordPress 網站的信?

如果您注意到無法收到您的WordPress網站發送的郵件,這可能表示您的網站尚未設定SMTP(簡單郵件傳輸協定)。本文將解釋SMTP是什麼,並解釋為什麼它對您的郵件傳遞如此重要。讓我們來探討解決這個問題的方法!