WordPress特色圖片未顯示的原因及解決方案

錯誤型別:
WP內部錯誤
錯誤名稱:
WordPress特色图片未显示
英文名稱:
WordPress Featured Image Not Showing
錯誤描述:
由于延迟加载、主题插件冲突及HTTP错误等原因,可能导致WordPress特色图片未能正常显示。

WordPress特色圖片未顯示的原因及解決方案

WordPress特色圖片顯示為您的WordPress文章或頁面的縮圖。其目的是吸引注意力並提供內容的先睹為快。擁有代表您的文章的特色圖片還可以為您的WordPress網站增加視覺興趣,從而使您的搜尋引擎優化工作受益。

特色圖片不應被誤認為是您部落格文章的第一張圖片。由於其目的是推銷您的內容,因此特色影象通常會在您的部落格文章列表或存檔頁面上以及當您在社交媒體上分享您的WordPress文章時可見。

本文將解決WordPress特色圖片無法正確顯示的問題。我們將提供七種解決方案來修復此錯誤以及在WordPress文章上自動顯示它的方法。

以下是WordPress特色圖片未出現在WordPress中的一些最常見原因:

  • 由WordPress記憶體限制導致的HTTP錯誤。
  • WordPress主題或外掛衝突。
  • 延遲載入外掛阻止顯示特色影象。
  • 活動主題不支援特色圖片功能。
  • 沒有檢視特色圖片的許可權。
  • 在儀表盤設定中禁用了特色影象功能。
  • 頁面模板中的位置不正確。

在某些情況下,瀏覽器開發人員工具可以檢測到問題的原因,尤其是當它是JavaScript錯誤或外掛衝突時。如果您使用的是Chrome ,我們建議您檢視我們關於使用瀏覽器的開發人員工具檢查元素的文章

根據錯誤的原因,有不同的方法可以修復未顯示的WordPress特色圖片。我們推薦這七種可能的解決方案——看看哪一種適用於您的WordPress網站。

如果您在將特色圖片上傳到WordPress時遇到HTTP錯誤,可能有兩種原因。

首先,您可能已經超出了PHP記憶體限制,從而阻止了您的WordPress站點執行所需的指令碼來顯示特色影象。由於預設記憶體限制只有32MB,增加它可以解決問題。

第二種可能是精選圖片超過了最大上傳限制。您的託管服務提供商通常會設定此值,因此它可能會有所不同。如果尚未將其設定為最大上傳大小,則可能是阻止您上傳影象的原因。

增加WordPress記憶體限制

此方法需要修改您的.htaccesswp-config.php檔案。兩者都可以通過FTP客戶端或類似寶塔的檔案管理器訪問。

如果您選擇修改.htaccess檔案,請在底部新增此程式碼段:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
php_value memory_limit 256M
php_value memory_limit 256M
php_value memory_limit 256M

否則,請在根目錄中找到wp-config.php檔案。找到包含WP_MEMORY_LIMIT的行並將其值更改為256M。如果該行不存在,則在上面插入以下程式碼/* That’s all, stop editing! Happy publishing. */ or /* That’s all, stop editing! Happy blogging. */:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
define ( ‘WP_MEMORY_LIMIT’, ‘256M’ );
define ( ‘WP_MEMORY_LIMIT’, ‘256M’ );
define ( ‘WP_MEMORY_LIMIT’, ‘256M’ );

wp-config.php檔案

寶塔使用者可以通過其控制面板更改PHP記憶體限制。這是如何做到的:

1. 從寶塔儀表盤導航到軟體商店-> 已安裝 。

2. 找到您當前使用的PHP版本,然後點選對應的設定選項。

寶塔修改PHP配置

3. 在彈出視窗中選擇“配置修改”,然後找到memoryLimit設定。您可以在現有的基礎數值下增加記憶體限制,比如從128M調整至256MB。

4. 單擊儲存

修改PHP最大上傳大小

要更改PHP的最大上傳大小,請將以下程式碼片段新增到.htaccess檔案的底部:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
php_value upload_max_filesize 256M
php_value post_max_size 256M
php_value upload_max_filesize 256M php_value post_max_size 256M
php_value upload_max_filesize 256M 
php_value post_max_size 256M

寶塔使用者使用者也可以參考上面的增加WordPress記憶體限制流程執行此操作。在PHP設定視窗修改uploadMaxFilesizepostMaxSize欄位對應的值。不要忘記儲存更改。

PHP配置修改

大多數WordPress主題都有不同的特色影象設定。一些WordPress主題需要網站管理員手動設定,而其他主題會自動顯示您的特色圖片。我們建議檢查您的WordPress主題設定或聯絡您的主題支援以尋求幫助。

至於外掛,過時的程式碼是外掛衝突的最常見原因。可以訪問您的媒體庫的外掛也可能會阻止特色影象正確顯示。

首先,嘗試更新所有外掛。如果這解決了問題,那麼過時的外掛很可能是罪魁禍首。否則,請停用所有外掛並一一重新啟用它們。

每次重新啟用後,檢查問題是否仍然存在。如果有,請從您的WordPress網站中刪除任何有問題的外掛。

Health Check外掛

如果您的特色圖片仍未正確顯示,我們建議您安裝執行Health Check外掛。這個免費外掛可以檢測主題和外掛中的常見配置錯誤和已知問題,並執行故障排除以建立乾淨的 WordPress 會話。

3.禁用延遲載入

延遲載入是一項有助於提高網站效能、提升移動體驗並優化最大內容繪製分數的功能。但是,某些具有此功能的外掛會將特色影象視為您網站上的任何其他影象,從而阻止它們顯示。

解決此問題的第一步是檢查您的WordPress站點是否具有配備延遲載入功能的外掛。密切關注直接延遲載入外掛影象優化工具網站優化外掛,因為它們通常帶有此功能。

延遲載入

關閉這些外掛中的延遲載入功能後,清除快取並檢視是否解決了特色影象問題。

如果您需要保留此功能,我們建議您為文章的第一張圖片禁用延遲載入。一些外掛提供了從該功能中排除某些圖片的選項,讓您可以從其他功能中受益,而不會影響您的特色圖片。檢視外掛的文件或聯絡其支援團隊尋求幫助。

4.配置WordPress儀表盤設定

不正確的WordPress儀表盤設定可能會導致特色影象不會顯示在您的文章和頁面列表以及WordPress編輯器中。好訊息是這兩種情況都很容易解決。

導航到您的WordPress儀表盤,然後單擊螢幕選項。選中特色圖片選項以在您的文章和頁面列表中顯示特色圖片列。

特色圖片列

特色圖片選項卡現在應該出現在您的內容編輯器中。單擊設定特色圖片按鈕,然後從媒體庫中選擇所需的圖片。

設定特色圖片

如果“螢幕選項”選項卡中不存在“特色圖片”選項,則您當前的主題可能不支援“特色圖片”功能。最好聯絡您的主題開發人員尋求幫助,或參考下面的步驟 7手動解決此問題。

WordPress提供了六個預設使用者角色來管理使用者在網站內的訪問和操作。您可能沒有所需的使用者角色來檢視或上傳特色圖片,從而導致問題。

大量使用者角色外掛允許您更改預設使用者角色的功能。以下是使用User Role Editor外掛向特定使用者角色授予特色影象檢視和上傳許可權的步驟:

  1. 安裝並啟用外掛。
  2. 從您的WordPress儀表盤轉到Users -> User Role Editor
  3. 從下拉選單中選擇要修改的使用者角色。對於本教程,我們將更改Author許可權。

User Role Editor

  1. 檢查upload_files選項並單擊Update。分配給此角色的WordPress使用者現在可以訪問媒體庫,並能夠在您的網站上上傳和設定特色圖片。

User Role Editor修改角色許可權

您還可以使用該外掛建立具有您選擇的許可權的新自定義角色。

6.修復特色圖片未顯示在部落格文章庫頁面上

許多部落格在部落格文章庫頁面上的每篇文章旁邊都顯示了一張特色圖片,以吸引訪問者的注意力。最近的部落格文章列表是使用Gutenberg編輯器提供的最新文章區塊製作的,放置在指定的主頁內。

最新文章區塊

以下步驟將向您展示如何設定主頁顯示,並在WordPress中顯示文章縮圖:

  1. 首先,您需要建立要指定為主頁的部落格頁面。從您的WordPress儀表盤轉到頁面-> 新建頁面。
  2. 新增頁面標題後,將“最新文章”區塊放置在頁面的任何位置。如果您需要有關該過程的幫助,請檢視我們關於使用WordPress區塊的文章。

WordPress區塊

  1. 開啟區塊選項卡並啟用顯示特色影象選項。根據需要隨意調整其他設定,例如特色影象大小、對齊方式和釋出元設定。完成後,單擊Publish

顯示文章特色圖片

  1. 返回儀表盤,然後導航到設定-> 閱讀。將您的主頁顯示設定為靜態頁面。單擊主頁下拉選單並選擇您之前建立的頁面。選擇儲存更改

WP靜態頁面

  1. 完成上述步驟後,您就可以開始了。這是新主頁的示例,其中包含最新部落格文章及其各自特色圖片的列表。對於此示例,我們將文章內容設定為包含摘錄以及釋出日期,並將影象大小更改為左對齊的縮圖

提示:啟用顯示特色影象選項會提示WordPress從最新文章中檢索特色影象。如果您沒有為相關文章分配特色圖片或設定預設特色圖片,則會出現一個空白區域。

7.編輯你的主題的functions.php檔案

如果您仍然無法在內容編輯器中看到特色影象元框或正確顯示文章縮圖,則您當前的主題很可能不支援特色影象。

在某些情況下,啟用特色影象功能的程式碼可能會丟失。您可以通過FTP客戶端或檔案管理器將以下程式碼新增到主題的functions.php檔案的底部來解決此問題:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
add_theme_support('post-thumbnails', array(
'post',
'page',
'custom-post-type-name',
));
add_theme_support('post-thumbnails', array( 'post', 'page', 'custom-post-type-name', ));
add_theme_support('post-thumbnails', array(
'post',
'page',
'custom-post-type-name',
));

重新載入您的管理儀表盤並清除網站快取,以檢視在編輯文章或頁面時是否出現特色影象部分。

WordPress初學者最常犯的錯誤之一是使用一張圖片作為特色圖片和封面圖片。它會導致重複影象在存檔頁面上堆疊在一起,從而導致視覺體驗不佳。

特色圖片和封面圖片

開啟文章或頁面編輯器,然後在文章選項卡下找到特色圖片部分。如果它顯示的影象與您的內容的第一張影象相同,那就是導致問題的原因。

文章特色圖片

此問題的解決方案是從內容中刪除文章縮圖或影象塊。雖然您可以上傳新檔案來替換兩張相同圖片中的一張,但同時顯示每個文章的文章縮圖和封面影象可能會使您的文章列表不堪重負,從而損害使用者體驗。

在弄清楚如何在 WordPress 中正確設定特色影象之後,下一步是確保它看起來正確。影響特色圖片外觀的一些最常見問題通常涉及尺寸不正確和使用未經優化的照片。

在調整大小之前,最好確保所選影象可以代表您的部落格頁面。為特色圖片挑選照片時需要考慮的一些因素包括:

  • 尺寸‒ WordPress 網站的理想特色圖片尺寸為1200 x 628畫素。
  • 照片方向‒ 寬度大於高度的圖片作為特色圖片效果更好。
  • 相關性——特色圖片必須與其所代表的文章或頁面相關。
  • 真實性——選擇的圖片應該是引人注目的並且可以免費使用。

如何更改WordPress中的預設影象大小

WordPress會自動建立以縮圖、中號和大尺寸上傳到媒體庫的每個影象的副本。雖然這種影象大小調整方法簡化了將視覺效果新增到頁面或文章所需的過程,但尺寸並不總是適用於特色影象。

幸運的是,您可以手動編輯預設影象尺寸。一些WordPress主題有自己的影象尺寸,因此我們建議您先檢查您的主題設定。如果沒有,請按照以下步驟通過WordPress設定修改影象尺寸:

  1. 從您的 WordPress 儀表盤轉到設定->媒體。
  2. 在縮圖大小欄位中為您的特色影象輸入新尺寸。

WordPress預設影象大小

  1. 選擇儲存更改

提示:檢視我們關於WordPress影象大小的文章,以建立新的自定義影象尺寸或使用外掛實現更改。

您網站的所有視覺效果,包括特色圖片,都有助於您的網站效能、使用者體驗和整體SEO工作。因此,優化它們至關重要。通過使特色影象更易於抓取,您將能夠在搜尋引擎結果頁面 (SERP) 上排名更高。

有幾種方法可以優化WordPress影象:

  • 壓縮大檔案以加快載入速度。
  • 使用上述方法調整影象尺寸。
  • 通過內容交付網路提供影象。
  • 從您的 WordPress 媒體庫中刪除未使用的影象。
  • 優化圖片的替代文字。

閱讀我們關於優化WordPress影象的詳細文章,其中我們分解了每種方法。它還展示了一些用於影象優化的最佳WordPress外掛。

由於它們是您的頁面和文章的面孔,因此您必須確保您的特色圖片正常工作且質量高。也就是說,您可能會忘記設定特色圖片。

為您的WordPress網站設定預設特色圖片將有助於避免在您的頁面上出現尷尬的空白區域,或者如果您未能設定一個則釋出。以下是分配預設特色圖片的方法:

  1. 安裝並啟用Default Featured Image外掛。
  2. 從您的 WordPress 儀表盤導航到設定->媒體。
  3. 單擊選擇預設特色影象按鈕並選擇您想要的影象。

the-default-featured-image-option-enabled-after-installing-the-plugin-1.webp

  1. 完成後,選擇Save Changes

WordPress目錄中有很多預設的特色圖片外掛。它們允許您將內容片段的第一張圖片分配為特色圖片或通過URL新增外部圖片。隨意使用符合您需求的外掛。

小結

特色圖片是一項有用的WordPress功能,可為您的WordPress網站增加視覺價值並吸引訪問者。在您網站的首頁和社交媒體上釋出縮圖將有助於增加流量並促進您的SEO工作。因此,您的主映像必須正常工作。

我們已經介紹了導致特色圖片不顯示的最常見原因,並討論瞭解決該問題的七種解決方案。您還學習瞭如何在您的網站上顯示正確大小的特色影象並自動顯示它們。

評論留言