WordPress 在 2019 年用一款名為 Gutenberg 的全新內(nèi)容編輯器取代了舊的經(jīng)典編輯器。該編輯器使用塊在 WordPress 中創(chuàng)建內(nèi)容，所以又常叫“塊編輯器”。

什么是 WordPress 塊編輯器？

WordPress 塊編輯器（或 Gutenberg）是 WordPress 5.0 版本中引入的內(nèi)容編輯器。從那時(shí)起，WordPress 改進(jìn)了編輯器并添加了新特性和功能。

與經(jīng)典編輯器相比，它提供了更多的自定義功能?？梢允褂貌煌膲K來向內(nèi)容中添加不同的元素，而無需編輯代碼來更改外觀和樣式。

它通過模仿WordPress 主題的相同字體和顏色來實(shí)時(shí)顯示博客和頁(yè)面的外觀。

例如，可以使用圖片塊將圖片添加到博客文章中。此外，還可以使用該塊獲得圖像樣式、大小、對(duì)齊方式等選項(xiàng)。

除此之外，許多WordPress 插件都會(huì)將其區(qū)塊添加到內(nèi)容編輯器中。這樣只需單擊幾下即可輕松嵌入表單、社交媒體源和內(nèi)容表等內(nèi)容。

隨著古騰堡編輯器的不斷升級(jí)完善，已經(jīng)越來越好用了。但是，早期的塊編輯器并不完美。和其他 WordPress 插件一樣，會(huì)遇到不同的錯(cuò)誤或缺陷。

1.修復(fù)WordPress塊編輯器不工作錯(cuò)誤

用戶面臨的最常見問題之一是“WordPress 塊編輯器不工作”。

出現(xiàn)這個(gè)錯(cuò)誤的原因有多種。例如，可能是由于主題版本過低、過時(shí)、插件有故障或其他技術(shù)錯(cuò)誤。

如果網(wǎng)站配置錯(cuò)誤，WordPress 塊編輯器也可能無法工作，例如在創(chuàng)建用戶配置文件時(shí)禁用可視化編輯器。

可以通過從 WordPress 儀表板轉(zhuǎn)到“用戶?個(gè)人資料”來檢查這一點(diǎn)。從這里，不要選擇“寫作時(shí)禁用可視化編輯器”選項(xiàng)。

如果問題仍然存在，那么可以嘗試停用網(wǎng)站上的所有插件。這有助于排除插件可能引起的沖突。

解決此問題的另一種方法是更新 WordPress 主題。版本過低的主題可能會(huì)導(dǎo)致塊編輯器無法正常工作的錯(cuò)誤。

2. WordPress 塊編輯器不斷崩潰

一些用戶面臨的另一個(gè)常見問題是WordPress 塊編輯器意外崩潰。

當(dāng)它崩潰時(shí)，會(huì)看到“編輯器遇到意外錯(cuò)誤”錯(cuò)誤消息。然后 WordPress 將顯示 3 個(gè)選項(xiàng)，包括嘗試恢復(fù)、復(fù)制帖子文本和復(fù)制錯(cuò)誤。

這個(gè)問題可能有多種原因。例如，插件可能會(huì)破壞塊編輯器并顯示此錯(cuò)誤，或者 WordPress 版本不是最新的。

可以通過停用所有插件并逐個(gè)重新激活來解決這個(gè)問題。另一個(gè)解決方法是將 WordPress 更改為默認(rèn)主題，例如 Twenty Twenty-F??our，然后查看問題是否還存在。

如果檢查 WordPress 插件和主題后問題還存在，請(qǐng)嘗試更新 WordPress 版本并清除 WordPress 緩存。

3. 刪除內(nèi)容編輯器中的無效 JSON 錯(cuò)誤

當(dāng)編輯博客文章或頁(yè)面時(shí)，單擊塊編輯器中的更新按鈕可能會(huì)出現(xiàn)“響應(yīng)不是有效的 JSON 響應(yīng)”錯(cuò)誤。

當(dāng)在WordPress 網(wǎng)站上編輯帖子時(shí)，WordPress 會(huì)在后臺(tái)與網(wǎng)站服務(wù)器持續(xù)通信。當(dāng) WordPress 無法從服務(wù)器收到響應(yīng)或響應(yīng)不是 JSON 格式時(shí)，會(huì)導(dǎo)致此錯(cuò)誤。

以下是可能收到無效 JSON 錯(cuò)誤的一些原因以及如何修復(fù)它們：

• 在設(shè)置中檢查 WordPress URL：需要確保網(wǎng)站設(shè)置中的 WordPress 地址和網(wǎng)站地址正確無誤。只需轉(zhuǎn)到設(shè)置?常規(guī)?頁(yè)面并檢查 URL 是否相同。如果網(wǎng)站地址不同，可能會(huì)觸發(fā) JSON 錯(cuò)誤。

• 修復(fù) WordPress 中的固定鏈接設(shè)置：在 WordPress 中，可以為頁(yè)面和帖子設(shè)置 SEO 友好的 URL。但是，錯(cuò)誤的設(shè)置會(huì)使塊編輯器難以獲得有效的 JSON 響應(yīng)。只需確保選擇正確的固定鏈接格式即可。
• 檢查 WordPress .htaccess 文件設(shè)置：.htaccess 文件在 WordPress 中用作配置文件，用于管理 SEO 友好 URL（固定鏈接）。通常，WordPress 會(huì)自動(dòng)重新生成并更新它。但是，不正確的設(shè)置或過期的 .htaccess 文件可能會(huì)導(dǎo)致 JSON 錯(cuò)誤。
• 查看 REST API 調(diào)試日志：REST API是 WordPress 用于與站點(diǎn)服務(wù)器通信的一組技術(shù)。JSON 錯(cuò)誤也可能意味著 REST API 遇到了錯(cuò)誤?？梢酝ㄟ^查看 WordPress 中的站點(diǎn)健康頁(yè)面上的 REST API 日志來檢查這一點(diǎn)。
• 嘗試停用所有插件:不同 WordPress 插件之間的沖突也會(huì)導(dǎo)致無效 JSON 錯(cuò)誤。嘗試停用網(wǎng)站上的所有插件，看看錯(cuò)誤有沒有再次出現(xiàn)。
• 切換到經(jīng)典編輯器：如果仍然無法解決 JSON 錯(cuò)誤，則可以切換回 WordPress 中的經(jīng)典編輯器。舊內(nèi)容編輯器不依賴 REST API 從網(wǎng)站服務(wù)器獲取 JSON 響應(yīng)。

4. 解決更新失敗/發(fā)布失敗錯(cuò)誤

在 WordPress 塊編輯器中更新或發(fā)布博客文章或頁(yè)面時(shí)，可能會(huì)看到的另一個(gè)錯(cuò)誤是：“更新失敗。您可能處于離線狀態(tài)。”

當(dāng) WordPress REST API 無法與WordPress 數(shù)據(jù)庫(kù)通信時(shí)會(huì)出現(xiàn)這個(gè)問題。

如果塊編輯器無法發(fā)送和接收來自WordPress 數(shù)據(jù)庫(kù)的請(qǐng)求，則網(wǎng)站的不同部分將無法運(yùn)行。包括塊編輯器。

如果沒有未連接到互聯(lián)網(wǎng)或失去連接，REST API 可能會(huì)停止工作。要解決這個(gè)問題比較簡(jiǎn)單，確定互聯(lián)網(wǎng)連接正常，然后嘗試更新或發(fā)布頁(yè)面。

除此之外，還可以從 WordPress 儀表盤轉(zhuǎn)到“工具”?“站點(diǎn)健康”并查看 REST API 日志。如果 REST API 存在問題，那么會(huì)在“建議改進(jìn)”部分下看到它。

錯(cuò)誤日志將顯示 REST API 發(fā)生的情況，并為你提供有關(guān)問題原因的提示。

有關(guān)解決這個(gè)問題的信息，可以查看我們的指南，了解如何修復(fù) WordPress 更新失敗錯(cuò)誤。

5. 添加或刪除 WordPress 塊之間的空白

使用WordPress 塊編輯器創(chuàng)建自定義頁(yè)面和帖子時(shí)，可能會(huì)注意到塊之間的空間太多或太少。

通常，間距由 WordPress 主題控制。但是，塊編輯器中有一些選項(xiàng)可以控制頁(yè)面布局并提供更好的用戶體驗(yàn)。

例如，可以添加 Spacer 塊來添加空白。只需單擊“+”按鈕，然后在內(nèi)容中的任何位置添加 Spacer 塊即可。

這樣，可以在塊之間添加額外的空間。

WordPress 還可以調(diào)整間隔塊的大小?？梢酝ㄟ^上下拖動(dòng)塊來放大或縮小它。

如果想刪除塊之間的多余空白，那么需要在 WordPress 主題中輸入自定義 CSS或使用CSS Hero等 CSS 插件。

該插件可以編輯網(wǎng)站的 CSS，而無需編輯代碼。它提供不同的間距選項(xiàng)，可以使用這些選項(xiàng)來調(diào)整塊之間的空白空間。

還可以使用SeedProd在 WordPress 中創(chuàng)建自定義頁(yè)面并完全控制設(shè)計(jì)。

6. 復(fù)制粘貼內(nèi)容，避免格式問題

不知道你們是否注意到，當(dāng)將內(nèi)容從桌面應(yīng)用程序或網(wǎng)頁(yè)復(fù)制并粘貼到塊編輯器中時(shí)，最終也會(huì)粘貼不需要的格式？

會(huì)發(fā)現(xiàn)粘貼內(nèi)容的字體和顏色與 WordPress 主題不匹配。如果使用 Microsoft Word 或Google Docs編寫內(nèi)容，然后將其輸入到塊編輯器中，這種情況很常見。

保留原始格式的一些簡(jiǎn)單技巧包括使用 Word 和 Google Docs 標(biāo)題樣式。這樣，當(dāng)將內(nèi)容粘貼到塊編輯器中時(shí)，WordPress 會(huì)自動(dòng)選擇標(biāo)題級(jí)別。

除此之外，粘貼內(nèi)容后，應(yīng)該檢查頁(yè)面或帖子的HTML 代碼。在 WordPress 內(nèi)容編輯器中，可以選擇一個(gè)塊，然后單擊 3 個(gè)垂直點(diǎn)選項(xiàng)。

從下拉菜單中，只需選擇“以 HTML 格式編輯”選項(xiàng)。

這樣，應(yīng)該能夠找到任何格式錯(cuò)誤，例如不正確的粗體和斜體、不需要的文本等等。

7. 修復(fù) WordPress 中的圖片上傳問題

接下來，可能會(huì)在 WordPress 塊編輯器中上傳圖片時(shí)看到錯(cuò)誤。這是WordPress 中最常見的圖片問題之一。

此錯(cuò)誤的主要原因是文件權(quán)限不正確。網(wǎng)站的所有文件都存儲(chǔ)在服務(wù)器上，需要特定的文件和目錄權(quán)限才能運(yùn)行。

如果這些權(quán)限不正確，可能會(huì)阻止 WordPress 讀取文件并將其上傳到服務(wù)器。因此，會(huì)注意到上傳時(shí)圖像會(huì)從媒體庫(kù)中消失，或者可能會(huì)看到一條錯(cuò)誤信息：

‘Unable to create directory wp-content/uploads/2019/04. Is its parent directory writable by the server?’

要解決此問題，需要編輯文件權(quán)限。可以使用FTP 客戶端并訪問 /wp-content/ 文件夾。從這里，可以右鍵單擊該文件夾并更改文件權(quán)限。

8.修復(fù) HTTP 圖像上傳錯(cuò)誤

在 WordPress 塊編輯器上傳圖像時(shí)可能會(huì)遇到的另一個(gè)問題是HTTP錯(cuò)誤。

當(dāng)在媒體庫(kù)中上傳圖像時(shí)，WordPress 將顯示通用的“HTTP”錯(cuò)誤，并且將無法看到圖片的預(yù)覽。

有多種原因可能導(dǎo)致這個(gè)問題。令人頭大的是，錯(cuò)誤消息并未提供實(shí)際原因的線索。

要解決這個(gè)問題，可以嘗試多種方法。首先，可以等待幾分鐘，然后嘗試重新上傳圖片。有時(shí)，網(wǎng)站服務(wù)器可能會(huì)遇到流量異常和服務(wù)器資源不足等問題。

除此之外，還可以增加WordPress 的內(nèi)存限制，防止內(nèi)存不足導(dǎo)致 HTTP 錯(cuò)誤?？梢試L試的其他方法包括更改 WordPress 使用的圖像編輯器庫(kù)和編輯 .htaccess 文件。

此此之外，登錄信息可能已過期，有時(shí)只需轉(zhuǎn)到登錄屏幕并再次輸入用戶名和密碼，這個(gè)錯(cuò)誤就會(huì)消失。

9. 刪除 WordPress 中錯(cuò)過的發(fā)布時(shí)間表錯(cuò)誤

是否知道 WordPress 提供了安排博客文章的內(nèi)置選項(xiàng)？

在WordPress 內(nèi)容編輯器中，可以更改發(fā)布博客文章的日期和時(shí)間。但是，有時(shí)候，預(yù)定的內(nèi)容可能不會(huì)在設(shè)定的時(shí)間發(fā)布。

這個(gè)錯(cuò)誤的主要原因是由于 WordPress 運(yùn)行環(huán)境或插件沖突。WordPress 使用一種名為“cron”的技術(shù)在預(yù)定時(shí)間自動(dòng)發(fā)布帖子。

如果插件或網(wǎng)站服務(wù)器影響了 cron 作業(yè)，那么就會(huì)導(dǎo)致 WordPress 中錯(cuò)過計(jì)劃發(fā)布錯(cuò)誤。

可以通過檢查 WordPress 網(wǎng)站的時(shí)區(qū)來解決此問題。網(wǎng)站時(shí)區(qū)可能與想要用于預(yù)定博客的時(shí)區(qū)不匹配。

只需從 WordPress 管理面板前往設(shè)置?常規(guī)，然后向下滾動(dòng)到時(shí)區(qū)部分。

還可以嘗試通過清除 WordPress 緩存和增加 WordPress 內(nèi)存限制來解決此問題。

10. 修復(fù) WordPress 塊編輯器中的對(duì)齊問題

可能會(huì)遇到的另一個(gè)常見的 WordPress 塊編輯器錯(cuò)誤是內(nèi)容和圖像可能未正確對(duì)齊。

例如，假設(shè)在博客文章中添加了一個(gè)項(xiàng)目符號(hào)列表并將其居中對(duì)齊。但是，在編輯文章時(shí)，列表在塊編輯器中顯示為左對(duì)齊。同樣，居中對(duì)齊的圖像塊可能會(huì)顯示為左對(duì)齊或右對(duì)齊。

如果在 WordPress 網(wǎng)站上安裝并激活了 Gutenberg 插件，則可能會(huì)導(dǎo)致塊對(duì)齊問題。我們建議停用 Gutenberg 插件，看看它是否能解決問題。

另一個(gè)解決方案是為想要居中對(duì)齊的文本添加以下自定義 CSS 代碼：

.has-text-align-center {
text-align: center;
}

11.解決Facebook不正確的縮略圖問題

是否有注意到，當(dāng)在 Facebook 上分享文章時(shí)，帖子縮略圖不正確？

該問題可能是由插件沖突、內(nèi)容分發(fā)網(wǎng)絡(luò) (CDN)問題或 Facebook 缺少 Open Graph 元標(biāo)記引起的。

現(xiàn)在，這不是在 WordPress 塊編輯器中看到的問題。但是，可以使用內(nèi)容編輯器為 Facebook 指定 Open Graph 圖像。

可以使用All in One SEO (AIOSEO)插件快速修復(fù)此問題。它是一個(gè)WordPress 的 SEO 插件，可幫助針對(duì)搜索引擎和社交媒體優(yōu)化網(wǎng)站。

激活后，在 WordPress 內(nèi)容編輯器中看到 AIOSEO 設(shè)置元框。只需轉(zhuǎn)到“社交”選項(xiàng)卡即可。

接下來，可以向下滾動(dòng)到“圖像源”部分。

從下拉菜單中，可以選擇在分享文章時(shí)在 Facebook 和其他社交媒體網(wǎng)站上顯示哪些圖片。

12. 修復(fù) Facebook 和 Instagram oEmbed 問題

將面臨的另一個(gè)與社交媒體相關(guān)的塊編輯器問題是將 Facebook 和 Instagram 內(nèi)容添加到 WordPress。

以前，可以輕松地在 WordPress 中嵌入 Instagram 或 Facebook 的帖子。然而，F(xiàn)acebook 現(xiàn)在已經(jīng)改變了 oEmbed 的工作方式。

無法再在 WordPress 中嵌入視頻、圖片、更新和其他內(nèi)容。它將改為顯示內(nèi)容的純 URL。

可以使用Smash Balloon等社交媒體 WordPress 插件解決這個(gè)問題。它可以幫助使用 oEmbed 輕松嵌入來自 Facebook 和 Instagram 的內(nèi)容，并且還可以在網(wǎng)站上顯示社交媒體提要。

13. 無法在塊編輯器中看到嵌入內(nèi)容預(yù)覽

這是在 WordPress 5.7 版本中出現(xiàn)的問題。每當(dāng)嵌入來自 YouTube 和 Vimeo 的視頻或添加來自 Spotify 和 SoundCloud 的音頻時(shí)，預(yù)覽都不會(huì)出現(xiàn)在塊編輯器中。

相反，只會(huì)看到塊中寫著“預(yù)覽不可用”或“此塊遇到錯(cuò)誤，無法預(yù)覽”。此問題的主要原因是默認(rèn)的延遲加載功能。

在WordPress 5.5中，iFrames 默認(rèn)是延遲加載的，這意味著嵌入的內(nèi)容（如圖片）只有在訪問者向下滾動(dòng)到內(nèi)容位置時(shí)才會(huì)加載。

解決這個(gè)問題的一個(gè)簡(jiǎn)單方法是更新 WordPress 版本。這個(gè)錯(cuò)誤現(xiàn)已解決。

希望本文能幫助你們了解常見的塊編輯器問題及其解決方法。

聯(lián)系我們
教程看不懂？聯(lián)系我們?yōu)槟赓M(fèi)解答！免費(fèi)助力個(gè)人，小企站點(diǎn)！	客服微信
① 電話：020-2206-9892
② QQ咨詢：1025174874
③ 郵件：info@361sale.com
④ 工作時(shí)間：周一至周五，9:30-18:30，節(jié)假日休息