WordPress Gutenberg編輯器的10個有用的技巧和技巧
已發表: 2025-04-17Gutenberg編輯已經改變了人們使用WordPress的方式。它比舊的經典編輯器更視覺，基於塊和靈活。但是，如果您是新手，即使您已經使用了一段時間，有些事情仍然會感到有些棘手。
好消息？有很多有用的技巧和技巧可以使事情變得更快，更輕鬆，更有趣。
在這篇文章中，我們將分享10個實用的Gutenberg技巧。這些將幫助您創建更好的內容，並在沒有通常的挫敗感的情況下完成更多工作。
WordPress Gutenberg編輯的演變
古騰堡（Gutenberg）於2018年12月首次在WordPress 5.0中引入。它取代了經典編輯，該編輯已經存在了多年。 Gutenberg背後的主要思想是通過基於塊的系統使用戶更多地控制其內容。
起初，許多用戶不確定更改。界面感覺不同。花了一些習慣了。但是隨著時間的流逝，古騰堡有了很多進步。它變得更快，更穩定，更靈活。
隨著每個WordPress的更新，Gutenberg都獲得了新功能。現在，您可以使用塊構建整個頁面佈局。您可以重複使用自定義塊。您甚至可以使用網站編輯器（用於塊主題）設計標題，頁腳和模板。
今天，古騰堡不僅僅是內容編輯。它已成為一個完整的編輯工具。每個版本都會變得更好。
WordPress Gutenberg編輯器的10個有用的技巧和技巧
Gutenberg提供的不僅僅是基本內容塊。一旦學習了一些智能技巧，就可以更快地工作並創建看起來更好的頁面而無需觸摸任何代碼。
這是一系列有用的技巧列表，可以提高您的古騰堡體驗：
- 使用Slash命令快速插入塊
- 將任何塊變成可重複使用的塊
- 拖放塊以重新排列內容
- 使用列表視圖以獲取易於塊導航
- 小組塊將它們移動或造型
- 鎖定塊以防止意外變化
- 使用鍵盤快捷鍵節省時間
- 使用圖案進行現成的佈局
- 在頁面之間複製和粘貼塊
- 將自定義CSS添加到特定塊
現在，讓我們了解細節！
01。使用斜杠命令快速插入塊
假設您正在寫博客文章，並且您想在段落後立即添加圖像。您將光標向下移動，擊中Enter鍵，然後…伸手拿到鼠標，單擊Little Plus圖標，滾動瀏覽塊選項，最後選擇圖像塊。聽起來很熟悉嗎？
現在，讓我們變得更聰明。
擊中Enter後，只需立即鍵入前向斜杠（ /），而不是單擊所有這些。當您做的那一刻，出現了一個塊列表。鍵入/image ，然後再次擊中輸入。完畢。您只是插入一個圖像塊而沒有觸摸鼠標。
這個技巧不僅用於圖像。嘗試/heading ， /quote ， /table ，甚至/columns 。一旦習慣了它，就會感覺就像將命令輸入增壓寫作工具一樣。
它快速，平穩，並保持您的寫作流程。沒有更多的重點。只需鍵入並構建即可。
02。將任何塊變成可重複使用的塊
是否曾經編寫要在多個帖子中重複使用的通話行動或通訊註冊框？每次抄襲它並不理想。您調整一個，忘記更新另一個，而繁榮 - 您的網站最終獲得了五個不同版本的同一內容。
這是可重複使用的塊派上用場的地方。
假設您設計了一個完美的CTA部分。也許是標題，簡短的句子和一個按鈕。選擇所有這些塊，單擊三點菜單（⋮），然後選擇“添加到可重複使用的塊”。給它一個名字，例如“ Post Pooter CTA”並保存。
現在，每次您撰寫新帖子時，只需搜索可重複使用的塊即可。一點擊插入。這是最好的部分 - 如果您有史以來更新該塊，則它在使用它的任何地方都會更改。
沒有更多的矛盾。不再浪費時間。
就像擁有自己的自定義模板一樣，隨時準備就緒。
03。拖放塊以重新排列內容
有時，您的內容不會像您想的那樣流動。
也許該圖像在文本上方看起來更好。也許這句話在結尾處感覺更強大。 Gutenberg中的重新安排內容與拖放塊一樣容易。
這是它的工作方式。
懸停在任何街區上。您會在左側看到一個六點手柄。抓住它，然後將塊拖動到您想要的任何地方。想要移動由多個塊製成的完整部分嗎？首先將它們分組，然後將整個組拖動一個平滑的運動。
這使您可以完全控制佈局 - 沒有切割，粘貼或處理任何混亂的代碼。
感覺就像是使用構建塊。移動東西，直到一切都合適。
簡單的。視覺的。立即的。
04。使用列表視圖進行輕鬆塊導航
是否曾經構建了一篇長的博客文章，其中包含大量圖像，文本，按鈕以及幾列？在某個時候，上下滾動以找到特定的塊變成頭痛。
這就是列表視圖節省一天的地方。
單擊編輯器頂部的左角中的三個堆疊線的小圖標。這將打開一個面板，顯示您帖子中的每個塊。您會看到一個乾淨，結構化的輪廓 - 就像內容塊的目錄一樣。
您可以單擊列表中的任何塊以直接跳到它。您還可以直接從列表視圖拖動塊。是否需要選擇一個組或列內的塊？列表視圖可讓您立即找到它，不再狩獵。
使用複雜的佈局或嵌套塊時，它特別有用。
05。小組塊移動或將它們造型
想像一下，您已經建立了一個帶有標題，段落，按鈕以及背景顏色的部分。看起來很棒。但是現在您想將整個內容移至頁面上的另一個位置。一次一個街區？沒有。太慢了。
只是分組。
選擇要保持在一起的所有塊。然後單擊三點菜單，然後選擇“組”。現在，這些塊被包裹在一個單個容器中。
您可以將它們作為一個單位移動。在小組中添加背景。調整填充。更改對齊。甚至一鍵重複整個部分。
組使復雜的佈局簡單。它們還可以使事情井井有條，尤其是當您在登陸頁面或定制部分上工作時。
06。鎖定塊以防止意外變化
您的設計就像想要的方式一樣。一切都完美排列。但是隨後，在編輯時，您不小心刪除了一個塊或將某些內容移出位置。煩人，對吧？
這是解決方案：鎖定塊。
單擊任何塊，打開設置（三點菜單），然後選擇“鎖定”。您可以防止運動，防止拆除或兩者兼而有之。這樣，沒有人，包括您在內，可以不先解鎖它就可以弄亂它。
當您使用可重複使用的佈局和共享頁面或只想保護自己的辛勤工作時，這非常有用。
07。使用鍵盤快捷鍵節省時間
單擊作品，但是鍵盤快捷鍵嗎？那是下一個級別的效率。
與其每隔幾秒鐘移動鼠標每隔幾秒鐘，就可以學習一些快速的連擊，您會瀏覽內容。例如：
- Ctrl + Shift + D（Mac上的CMD）：重複一個塊
- Ctrl + Alt + T：在上方插入一個塊
- ctrl + alt + y：在下面插入一個塊
- Shift + Alt + Z：刪除一個塊
- /（前向斜線）：立即打開塊插入器
還有更多，但即使只有幾個可以為您節省幾分鐘，尤其是當您定期構建長帖子或頁面時。
就像知道秘密作弊代碼一樣。一旦您的手指記住了它們，您就會想知道沒有它們的工作方式。
08。使用圖案進行現成的佈局
從頭開始設計頁面會感到不知所措。您知道您想要什麼，但是Block到達那裡需要時間。那就是模式進來的地方。
模式是預設的塊佈局。 WordPress默認包含一堆 - 例如英雄部分，推薦，CTA等。您只需選擇一個並將其放入您的頁面。完畢。
單擊加號圖標以添加新塊。然後切換到“模式”選項卡。您會發現諸如文本，圖像，列，標題之類的類別 - 您將其命名。選擇一個，整個佈局立即出現。
您可以編輯文本，替換圖像和調整樣式。但是結構已經存在。
這就像讓設計師將入門套件交給您。偉大的部分。沒有壓力。沒有空白頁焦慮。
09。在頁面之間複製和粘貼塊
在一個頁面上構建了一些不錯的東西，並想要另一個東西嗎？不要從頭開始。只需複製並粘貼塊即可。
這比您想像的要容易。
單擊塊（或一組塊），然後擊中CTRL + C （或Mac上的CMD + C ）。轉到您的另一頁或帖子。單擊您想要的位置，然後按Ctrl + V。繁榮 - 一切都像這樣。
所有格式，樣式，按鈕，圖像 - 一切都會出現。
是的，它甚至可以在瀏覽器選項卡上工作。因此，您可以並排打開兩個帖子，並在幾秒鐘內將內容移動。
10。將自定義CSS添加到特定塊
有時，內置樣式不會削減它。您想要更獨特的東西。這是Custom CSS發揮作用的地方。
Gutenberg使您可以將自定義CSS應用於各個塊，因此您可以使內容的特定部分突出而不會影響整個頁面。
這是這樣做的方法：
- 選擇要自定義的塊。
- 在右側的塊設置中，找到高級部分。
- 在其他CSS類中，添加自定義類名稱（例如，
my-custom-style）。 - 然後，轉到主題中的WordPress自定義器或自定義CSS部分，然後使用該類添加樣式（例如，
.my-custom-style { color: red; }）。
這樣，您就不會對全球風格感到困惑，而只是為該區塊量身定制它。
當您想要特定的按鈕，標題或部分以具有不同的外觀而不會影響其餘內容時，這是完美的。
結論
有了這些技巧和竅門，您就可以掌握WordPress Gutenberg編輯器。從用斜杠命令加速工作流程到輕鬆添加自定義樣式，Gutenberg為內容創建者提供了很大的靈活性。
請記住，關鍵是要嘗試並找到最適合您風格的工具。無論您是創建簡單的帖子還是複雜的佈局，這些功能都將幫助您節省時間，保持井井有條並為您的網站增添個人風格。
如果您想將Gutenberg與Elementor進行比較，可以查看我們有關Elementor vs Gutenberg的博客文章，以了解誰導致了路線。
是否想分享您與此博客文章有關的反饋？請使用下面的評論框進行。我們很想知道您的反饋。小心！