在您的WordPress網站中包含視覺元素是吸引訪問者注意力的好方法。此外，與綜合文章搭配時，良好的視覺元素可以顯著提升內容的資訊價值。
幸運的是，WordPress具有多種功能，可以將視覺效果整合到網站中，例如包括特色影象。
本教程將涵蓋您需要了解的有關特色圖片的所有資訊——它們是什麼，為什麼要使用它們，以及如何在您的網站上啟用它們。我們還將介紹一些外掛來優化特色影象。
什麼是特色圖片？
WordPress特色圖片，也稱為文章縮圖，可以代表您的文章、頁面或自定義文章型別。
從您網站的存檔或主頁檢視時，此類影象通常會伴隨您的文章。當您的文章在其他平臺上共享時，它也將可見。
但是，它們的位置取決於您選擇的WordPress主題。一些主題在標題上方或下方顯示影象，而其他主題會自動將其放置在文章的右側或左側。
特色影象也可能與最近或流行的出版物一起出現在小工具區域上。
為什麼使用特色圖片？
精選圖片既可以極大地增強您網站的外觀，又可以為原本平淡無奇的文章或部落格文章提供引人入勝的視覺效果。影象有助於向讀者傳達想法，幫助他們更好地理解內容。
始終如一地使用特色圖片不僅可以幫助您定義網站的視覺風格，而且還可以增加您的訪問量——研究表明，包含圖片的文章比不包含圖片的文章產生的瀏覽量高出94%。
更重要的是，在圖片的標題和替代文字中加入關鍵字可以提升您的WordPress網站的SEO。
在您的WordPress網站上啟用特色圖片
通常，大多數 WordPress 主題都支援“設定特色圖片”選項。然而，情況並非總是如此。
您可以通過使用主題開發人員方法並將以下程式碼插入主題的functions.php檔案來快速解決此問題。
add_theme_support( 'post-thumbnails' );
完成後，在建立或編輯部落格文章時應該可以使用 WordPress 特色圖片設定。
請記住，“釋出縮圖”功能不會自動讓您的主題顯示或分配影象。它僅在您網站的文章編輯器中啟用該選項。
要顯示影象，您需要將下面的程式碼片段新增到您希望顯示視覺效果的模板部分：
<?php the_post_thumbnail(); ?>
需要編輯的特定檔案將根據您的主題而有所不同。
如果您使用寶塔管理伺服器，請按照以下步驟訪問您的主題檔案。
1. 訪問寶塔面板的檔案選單。
2. 進入網站的根目錄，/www/wwwroot/www.inpandora.com/wp-content/themes。
3. 此資料夾包含您網站上安裝的所有WordPress主題。選擇當前活動的主題進行編輯。
4. 選擇您的主題的function.php，然後單擊選單欄上的編輯圖示。這將開啟文字編輯器，您可以在其中插入所需的程式碼。完成後，單擊“儲存”按鈕以儲存更改。
您現在應該可以在WordPress中使用特色圖片了。作為上述方法的替代方法，您可以安裝可以修復不相容問題的WordPress外掛，例如：
如何將特色圖片新增到文章中
要將特色圖片新增到文章中，請導航至文章。點選寫文章，或選擇現有文章進行編輯。
載入文字編輯器後，單擊螢幕選項並確保選中特色影象。
特色圖片選項通常位於側邊欄的底部。找到後，單擊設定特色圖片按鈕。
您可以從計算機上傳圖片，也可以從媒體庫中選擇一張。不要忘記新增圖片的替代文字和標題，然後點選設定特色圖片。
如果您按照這些步驟操作，您將成功新增WordPress特色圖片。如果要刪除影象，請單擊刪除特色影象按鈕。
設定WordPress特色圖片大小
每當您將影象上傳到WordPress時，您都會在設定中找到四種預設影象尺寸：
- 縮圖（150畫素正方形）
- 中等尺寸（最大300畫素的寬高）
- 大尺寸（最大1024畫素寬高）
- 全尺寸（原始影象）
這些選項可用，因此您可以將圖片放置在部落格文章的不同部分，而無需手動調整原始檔案的大小。但是，在某些情況下，這些尺寸可能不適合您的需求。
您可以通過訪問WordPress儀表盤來解決此問題。
導航到設定->媒體。在這裡，您將看到每種影象尺寸的幾種配置。根據您的需要輸入新尺寸，然後單擊Save Changes。
如果您需要更多尺寸，可以在functions.php檔案中使WordPress支援自定義影象尺寸。
在WordPress中自動設定特色影象
當部落格文章沒有特色圖片時，您可以對WordPress進行程式設計以自動將附加圖片顯示為文章縮圖。
這樣，每當您儲存新的部落格文章時，它都會檢查是否有特色圖片集。否則，它將檢索找到的第一張影象並將其顯示為特色影象。
要實現此功能，只需訪問主題的functions.php檔案並新增以下程式碼段。
function auto_featured_image() {
global $post;
if (!has_post_thumbnail($post->ID)) {
$attached_image = get_children( "post_parent=$post->ID&post_type=attachment&post_mime_type=image&numberposts=1" );
if ($attached_image) {
foreach ($attached_image as $attachment_id => $attachment) {
set_post_thumbnail($post->ID, $attachment_id);
}
}
}
}
add_action('the_post', 'auto_featured_image');
add_action('save_post', 'auto_featured_image');
add_action('draft_to_publish', 'auto_featured_image');
add_action('new_to_publish', 'auto_featured_image');
add_action('pending_to_publish', 'auto_featured_image');
add_action('future_to_publish', 'auto_featured_image');
但是，如果您在文章中不包含任何圖片，此功能將不會顯示任何通知，並且會簡單地釋出它而不包含任何圖片。為防止這種情況發生，請確保至少包含一張圖片。
或者，您可以使用以下功能在未設定特色影象時顯示彈出錯誤訊息。
add_filter( 'wp_insert_post_data', function ( $data, $postarr ) {
$post_id = $postarr['ID'];
$post_status = $data['post_status'];
$original_post_status = $postarr['original_post_status'];
if ( $post_id && 'publish' === $post_status && 'publish' !== $original_post_status ) {
$post_type = get_post_type( $post_id );
if ( post_type_supports( $post_type, 'thumbnail' ) && ! has_post_thumbnail( $post_id ) ) {
$data['post_status'] = 'draft';
}
}
return $data;
}, 10, 2 );
add_action( 'admin_notices', function () {
$post = get_post();
if ( 'publish' !== get_post_status( $post->ID ) && ! has_post_thumbnail( $post->ID ) ) { ?>
<div id="message" class="error">
<p>
<strong><?php _e( 'Please add featured image. This post is not published.' ); ?></strong>
</p>
</div>
<?php
}
} );
每當作者嘗試釋出沒有特色圖片的文章時，該函式將觸發錯誤訊息，如下例所示。
如果找到，將出現一條成功訊息，併發布該文章。
為您的文章和頁面新增縮圖預覽編輯列表
WordPress管理面板允許使用者管理作者、類別和日期等內容屬性。
但是，預設介面不包括特色圖片。這意味著您必須手動開啟每個文章以檢查文章是否具有影象集。
下面的功能將在管理面板上顯示特色影象，讓您更輕鬆地更有效地管理您的內容。
只需將程式碼複製並貼上到您的主題函式檔案並儲存更改即可。
if ( !function_exists('AddThumbColumn') && function_exists('add_theme_support') ) {
add_theme_support('post-thumbnails', array( 'post', 'page' ) );
function AddThumbColumn($cols) {
$cols['thumbnail'] = __('Thumbnail');
return $cols;
}
function AddThumbValue($column_name, $post_id) {
$width = (int) 50;
$height = (int) 50;
if ( 'thumbnail' == $column_name ) {
$thumbnail_id = get_post_meta( $post_id, '_thumbnail_id', true );
$attachments = get_children( array('post_parent' => $post_id, 'post_type' => 'attachment', 'post_mime_type' => 'image') );
if ($thumbnail_id)
$thumb = wp_get_attachment_image( $thumbnail_id, array($width, $height), true );
elseif ($attachments) {
foreach ( $attachments as $attachment_id => $attachment ) {
$thumb = wp_get_attachment_image( $attachment_id, array($width, $height), true );
}
}
if ( isset($thumb) && $thumb ) {
echo $thumb;
} else {
echo __('None');
}
}
}
add_filter( 'manage_posts_columns', 'AddThumbColumn' );
add_action( 'manage_posts_custom_column', 'AddThumbValue', 10, 2 );
add_filter( 'manage_pages_columns', 'AddThumbColumn' );
add_action( 'manage_pages_custom_column', 'AddThumbValue', 10, 2 );
}
要更改縮圖影象的大小，請根據自己的喜好編輯$width和$height值。
現在，重新整理管理面板。它應該在螢幕右側顯示特色影象。
什麼是Header圖片？
古騰堡編輯器帶來的新WordPress功能之一是封面區塊。正如其名，此功能允許您新增封面影象或標題影象。
與 WordPress 特色圖片不同，標題圖片僅出現在用作文章封面和部分分隔符的文章和頁面上。然而，這兩個元素有一個相似之處——不是每個 WordPress 主題都支援它們。
要將標題影象新增到您的WordPress文章，請轉到您的WordPress儀表盤，然後將選單導航到文章-> 寫文章。
將滑鼠懸停在編輯器主體上，然後單擊+按鈕。然後，從媒體選項卡中選擇封面。
從那裡，您可以從媒體庫中選擇一張圖片，或者通過單擊上傳按鈕上傳一張新圖片。使用工具欄向標題影象新增和修改文字，如下例所示。
優化您的特色圖片
請記住，較大的影象尺寸也會使網站載入速度變慢，從而導致使用者體驗不佳。
因此，影象優化是至關重要的一步。優化影象可以減小檔案大小，進而提高頁面載入時間。
優化特色影象的最簡單方法是安裝影象優化外掛——它們會自動壓縮影象大小並保持高質量。
以下是一些可用於您的網站的最佳影象優化器外掛：
- ShortPixel Image Optimizer –使用有損和無損影象壓縮來優化任何型別的檔案，例如.PNG、 .JPG和.GIF。
- Imagify –提供三種不同級別的壓縮——正常、激進和超強。
- WP Smush –掃描您網站和媒體庫中的影象，一次最多可以壓縮 50 個檔案。
- Optimole –提供延遲載入並通過CDN（內容交付網路）提供影象。
小結
通過充分利用特色圖片，您可以吸引訪問者的注意力，提供更多資訊內容，並堅持最佳SEO實踐。
為幫助您實現這一目標，WordPress包含多種功能和自定義選項，以及許多啟用WordPress特色影象功能的替代方法。
在標題影象的幫助下，使用者可以介紹和拆分他們的內容以獲得更好的使用者體驗。為了實現一致的視覺風格，特色影象及其縮圖的大小也可以自由配置。
如果您想優化影象，請考慮安裝為該任務設計的眾多外掛之一，或自行調整設定。請記住在您的特色圖片的替代文字中包含關鍵字，因為這將帶來更好的SEO。
我們希望本指南能幫助您更多地瞭解WordPress特色圖片及其對您網站的重要性。
評論留言