WordPress 區塊編輯器進階技巧 – 高速寫文、製作頁面教學

在了解區塊編輯器的基礎功能後,接著就可以學習一些進階技巧,能夠有效提高撰寫文章的速度、加快工作效率,要做個漂亮首頁也不是問題。包含經典好用的快速鍵 (快捷鍵) 功能、Markdown 語法,能夠讓你的手一放上鍵盤,就完全停不下來!

YouTube 影片教學

WordPress 區塊編輯器進階操作教學

快速鍵 (快捷鍵)

想要更快的寫文章,比起鍵盤敲一敲,還要改成用滑鼠去點對應按鈕,直接按下鍵盤快速鍵肯定速度快不少,大家應該都是直接 Ctrl+C / Ctrl+V 複製貼上,沒有人會用滑鼠右鍵再點複製的吧?

在此分享幾個我寫文章相當常用的 WordPress 快速鍵:

  • Ctrl + Shift + D:再製一份相同的區塊。
  • Ctrl + Z:復原回上一個操作。
  • Ctrl + K:將選取的部分插入連結。
  • Ctrl + B:將選取的部分改粗體。
  • Ctrl + I:將選取的部分改斜體。

以上這些會是 WordPress 撰寫文章時比較常用到的快速鍵,如果想要了解更多,也可以在文章編輯頁面中,按下右上角的三個點,就可以找到鍵盤快速鍵的清單了。

斜線 / Slash

區塊編輯器中使用斜線可以直接搜尋區塊
使用斜線可以直接找區塊

我們在編輯區中按下 斜線 之後,系統會推薦你一些區塊,而這時我們可以直接打字搜尋我們要的,比方說如果這是想放個影片進去,就可以直接輸入 youtube;更進階的,只要你知道這些區塊的英文名稱,其實全部都可以用英文搜尋,比方說要用圖片區塊,那就輸入 image。

用英文的好處是大概只要輸入前三個英文字,就可以找到區塊,速度會快非常多!

Markdown 語法

這裡不會詳細解釋 Markdown 是什麼,有興趣的可以直接查閱 Markdown 文獻

WordPress 有支援部分 Markdown 語法,簡單說各位可以把它當作編輯文章時很厲害的快速鍵功能,都是用半形符號輸入,特點是非常直觀,以下分享幾個,各位應該會覺得輸入的符號就是在表達它的意思:

  • 兩個井號 (##) + 空格:新增「標題二」區塊。
  • 三個井號 (###) + 空格:新增「標題三區塊」。其他的標題以此類推。
  • 三個減號 (—) + Enter:新增「分隔線」區塊,並直接跳到下一行。
  • 星號 (*) + 空格:新增「清單」區塊。
  • 數字一 (1) + . + 空格:新增「數字清單」區塊。

區塊版面配置

區塊版面配置提供眾多預設範本
區塊版面配置提供眾多預設範本

業配產品的文章寫到中途,想要新增個漂亮的按鈕引導大家到購買頁,但卻沒靈感怎麼設計嗎?系統有提供一些還不錯的範本喔!

在功能區按下 + 號之後,旁邊有個 [區塊版面配置],裡面有非常多已經做好的組合區塊們可以直接使用,像是上面講到的案例,就可以從「行動號召」的那邊找個喜歡的按鈕形式放進來。

而這功能我也很常用在製作首頁、活動頁,畢竟整個範本都做好了,直接叫出來換個文字就能用,效率很高的!詳細的話可以看看這個首頁設計教學影片

自訂區塊版面配置

WordPress 自訂區塊版面配置
WordPress 自訂區塊版面配置

這功能的前身叫做「可重複使用區塊」。我們在寫文章時,可能有些區塊的設定會重複使用,比方說我的分隔線固定就是上下間距要有 50 px,那麼每篇文章都要重新設定一次似乎也有點太累了,所以 WordPress 有提供你自訂的功能,讓我們自己設計常用區塊。

一開始要先點右上角控制區的三個點,接著點 [管理區塊版面配置] 就會出現這介面了,直接按新增後就能在這裡幫區塊做設定;設定好並發佈之後,回到文章編輯介面,功能區的 + 號打開,就會出現囉!

但特別要注意的是這個功能建議直接做完全固定的區塊,不要任意調整,因為有可能你動了 A 區塊的設定,其他篇文章的 A 區塊們也會跟著一起改動,所以推薦用法就是像我剛才提的分隔線那樣子,上下 50 px 常駐,如果哪天想幫網站換個風格,只要把這個可重複使用區塊的間距換一下,整個網站就會一起換,這可是很方便的喔~

常見問題

區塊版面配置在哪裡設定?

如果第一次使用,要在文章編輯介面點右上角三個點 > [管理區塊版面配置] 進去設定;而如果已經有做過了,那其實按下 + 號,可重複使用的區域就可以直接點進去管理囉!

WordPress 區塊編輯器是什麼?

「區塊編輯器 (Block Editor)」是現今撰寫網路文章相當方便好用的編輯方式,新增各式區塊填入內容並組合,最後變成一篇吸引人的文章。而區塊的種類也相當多元,有文字編輯的段落區塊、放影片的 YouTube 區塊、更進階的程式碼區塊都有。

文章類別
建議文章