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
最新文章
【2025 跨境網站營運必備!】從 Surfshark 購買指南看最強 VPN 選擇

如果你曾經試過在中國大陸更新公司網站、用 Google 查關鍵字、或想登入 Facebook 管理廣告帳號,那你一定知道,那種 “網路不通就是地獄” 的無力感。
別擔心,解藥叫 VPN。VPN(虛擬私人網路)不只是跨區看片的工具,它更是跨境網站運營者的秘密武器。今天,我們就來從 surfshark購買指南 開始,聊聊 2025 年網站運營者與設計師該怎麼選 VPN,才能在中國大陸、台灣、甚至歐美市場之間自由穿梭。

【教學】如何架設購物網站?電商WooCommerce WordPress設計指南

擁有一個專屬的購物網站是品牌走向電商化的關鍵之一,無論中小企業、創業者還是個人品牌,都可以透過WordPress購物網站架設及電商網站必備的WooCommerce外掛,設計出符合使用者邏輯的電商網站。本文將帶你了解電商網站架設流程、WooCommerce WordPress教學、從購物網站架設基礎觀念、電商平台比較到實際操作教學,幫助品牌打造高效又能帶來轉換的電商網站設計。

wordpress架站
WordPress網站架設步驟、費用整理!網頁設計與架站前先看

WordPress架站是什麼?在資訊快速發展的時代,幾乎每個品牌都有專屬品牌網站,並且多數人選擇WordPress架站,很多人最在意之一:WordPress架站費用是多少?WordPress網站架設自己做可以嗎?本文將帶你了解WordPress為什麼能成為全球最受歡迎的架站平台,分析不同架站類型的選擇方向,讓你實際了解WordPress架站與網站設計。

Selected Post
精選文章
網頁設計推薦
網頁設計推薦2025更新!13 個激發靈感的網站

正在設計網站卻靈感枯竭嗎?我們為你精選了 13 個超實用的網頁設計推薦網站,從歐美大膽前衛到日本極簡清新,匯集全球頂尖設計師的精彩作品,幫助你打破設計瓶頸,激發視覺靈感。每一個網站都可能與你的創意撞出新火花,無論是品牌、排版、配色或互動體驗,通通找得到!