如何輕鬆地將標題屬性添加到WordPress中的圖像


您是否要將title屬性添加到WordPress中的圖像? title屬性使WordPress網站上的圖像更易於訪問且對SEO友好。

與替代文本相似,標題標籤允許您提供有關圖像的其他信息。 這有助於屏幕閱讀器和搜索引擎了解文章中圖像的上下文。

在本文中,我們將向您展示如何輕鬆地將標題屬性添加到WordPress中的圖像。

將標題屬性添加到WordPress中的圖像

圖片中的標題屬性是什麼?

圖像中的標題屬性使您可以添加圖像的文本描述。 這使屏幕閱讀器和搜索引擎機器人可以輕鬆理解圖像及其上下文。

我們將向您展示一些代碼示例,以解釋如何在HTML中使用title屬性。 但請放心,您無需在網站上添加任何HTML代碼。

通常,您可以顯示帶有HTML標籤的圖像,如下所示:


但是,網絡爬蟲,漫遊器和屏幕閱讀設備實際上無法查看您的圖像。 為了幫助這些設備,您可以在圖像中使用備用文本和標題文本屬性。

因此,為了幫助搜索引擎和漫遊器了解您的圖片,您可以在圖片標籤中添加替代文本屬性。

另外的標籤屬性描述了您的圖像,它比標題屬性重要。 看起來是這樣的:

水果籃

當圖像鏈接斷開,找不到或瀏覽器無法加載圖像時,也會顯示替代標籤。 您會看到帶有小標籤的小圖像圖標。

圖像路徑損壞

為了使具有屏幕閱讀器和可訪問性需求的用戶更容易使用,還可以向圖像添加標題屬性,如下所示:

水果籃

當您將鼠標懸停在圖像上時,此標題屬性將顯示在彈出窗口中。 使用屏幕閱讀器軟件的用戶可以配置其軟件以閱讀此標題。

圖片標題屬性

同時使用替代文本和title屬性有助於圖像SEO,因此您可以從搜索引擎為網站帶來更多流量。

在WordPress中為圖像添加標題屬性

WordPress使您可以輕鬆地在內容編輯器中添加替代文本和標題屬性。 首先,前往 帖子»添加新 並創建一個帖子。

單擊“ +”圖標,然後選擇“圖像”塊以將圖像插入您的帖子或頁面。

添加圖像塊

系統將提示您上傳或從媒體庫中選擇圖像。 選擇圖片後,您可以選擇為其指定標題並輸入替換文字。

向圖片添加alt和標題

重要: 該標題不是HTML中使用的title屬性。 WordPress內部使用此文件在媒體庫中顯示您的圖像。

要添加實際的標題屬性,您需要單擊圖像以查看右列中的圖像設置。

現在單擊以展開“高級”選項卡,然後輸入要用於title屬性的文本。 我們寫了“水果籃”,因為那是在告訴互聯網圖像是什麼。

添加標題屬性

現在,當您查看站點並將鼠標懸停在圖像上時,您將看到顯示“水果籃”的彈出窗口。

圖片標題屬性

在WordPress經典編輯器中為圖像添加標題屬性

如果仍在WordPress中使用較舊的經典編輯器,則仍可以通過執行類似的步驟來添加title屬性。

在傳統編輯器中,您將點擊“添加媒體”按鈕,然後選擇您的圖片。

添加圖像經典編輯器

現在,選擇要添加到帖子或頁面的圖像,然後填寫“替換文字”字段和“標題”字段。

請記住,此標題由WordPress內部使用,而不是圖像標題屬性。

選擇圖像經典編輯器

點擊屏幕底部的“插入帖子”按鈕,然後您將在經典的帖子編輯器中看到您的圖片。

編輯帖子中的圖片

從那裡,單擊以選擇您的圖像,然後單擊鉛筆小圖標。 這將彈出“圖像詳細信息”彈出窗口。 在這裡,您需要單擊高級選項下拉菜單以輸入圖像標題屬性。

圖片標題屬性字段

不要忘記單擊底部的“更新”按鈕,然後保存您的帖子並在瀏覽器中檢查它。 將鼠標懸停在圖片上時,您會看到顯示圖片標題屬性的彈出窗口。

圖片標題屬性彈出

我們希望本文能幫助您輕鬆地將title屬性添加到WordPress中的圖像。 您可能還想看看如何解決WordPress中最常見的圖像問題,以及如何保存針對網絡速度優化的圖像。

如果您喜歡這篇文章,請訂閱我們的YouTube頻道WordPress視頻教程。 您也可以在找到我們 推特 和Facebook。