如何通過程式碼或者TOC外掛新增WordPress文章目錄

如何程式碼或者外掛新增WordPress文章目錄

搜尋引擎優化 (SEO)的理想部落格文章長度約為2,000字,相當於四頁文字。然而,值得記住的是,43%的讀者表示他們只瀏覽部落格文章。

因此,提供目錄 (TOC) 是幫助讀者瀏覽您的帖子並防止他們在幾秒鐘內點選您的WordPress網站的絕佳方式。

與網站建設者相比,WordPress允許使用者使用外掛更自由地擴充套件網站的功能。本文將介紹手動和使用外掛將TOC新增到WordPress站點的步驟。我們還列出了五個WordPress TOC外掛供您參考。

什麼是TOC(內容目錄)?

從技術上講,錨連結(又稱錨文字或跳轉連結)是頁面中的任何超連結,通常指向同一頁面的另一個部分。

要建立錨連結,基本上是在 URL 的周圍編寫一段程式碼(別擔心,我們會教你如何編寫),使其成為某種書籤。然後,你可以將該書籤附加到同一頁面上的任何文字或圖片上。當有人點選書籤時,他們就會快速滾動到你用程式碼指定的頁面區域。如果還不太明白,請稍等片刻,我們會越講越清楚!

在很多情況下,你會在頁面或文章開頭的目錄(TOC)中遇到錨連結。

目錄(TOC)
其他常見的錨連結示例包括當你到達頁面底部時返回頂部的按鈕。您還可以使用錨連結幫助使用者瀏覽較長的登陸頁面。

無論您網站上的頁面或文章是否太長,不適合手動滾動,錨連結都能幫助您確保在提供所有精彩內容之前吸引訪客的注意力。

值得注意的是,搜尋引擎並不聲稱錨連結能直接提高你的搜尋引擎排名。不過,錨連結確實可以改善使用者和搜尋引擎的內容排名體驗。

什麼是WordPress目錄外掛?

您以前可能在實體書中看到過目錄。它們列出了書中的主要章節,因此您可以更有效地定位特定內容,而無需隨機翻閱所有頁面。因此,您可以在查詢必要資訊的同時節省時間和精力。

目錄在WordPress網站上起到類似的作用。但是,與實體書不同,WordPress文章或者頁面目錄將更具動態性和互動性。它們包含您文章的標題和副標題列表,帶有可點選的錨連結(或跳轉連結),可將讀者帶到這些特定部分。

目錄文字錨連結允許使用者跳轉到他們最感興趣的部分。因此,由於訪問者不必手動向下滾動,這種佈局增加了文章或頁面的使用者體驗。此外,它可以通過清楚地向使用者展示期望的內容來增強可讀性。

目錄中的錨連結也可以稍微提升 SEO。使用這樣的SEO連結將允許搜尋引擎在SERP中顯示這些連結。

通過使用WordPress目錄外掛(您也可以稱其為TOC外掛),您可以將此功能插入到您的文章和頁面中,而無需新增自定義程式碼。因此,這種型別的外掛可以成為您業務的使用者友好且省時的工具。

為什麼要新增WordPress目錄?

目錄可以幫助讀者跳轉到WordPress文章的相關部分,這可以提高其可讀性——尤其是對於長篇內容。

新增目錄還可以增強搜尋引擎優化。例如,它可能會降低您網站的跳出率,因為使用者可以輕鬆導航到符合其搜尋意圖的部分。

此外,TOC可以幫助您的網頁在搜尋引擎結果頁面 (SERP) 上看起來更具吸引力。提供目錄有助於Google自動生成指向文章不同部分的跳轉連結。

TOC谷歌搜尋結果展示

總的來說,設定錨連結有助於改善內容導航。不過,這並不全是陽光和彩虹–你可能需要考慮一些不利因素。

在此,我們將從正反兩方面進行探討。

優點

(1)更好的體驗

有了錨文字,讀者可以快速瞭解您的內容,從而減少跳出的可能性,提高參與的積極性。此外,網路爬蟲(幫助搜尋引擎理解網際網路內容的機器人)可以更快、更清晰地處理列表。

讓我們更深入地瞭解一下這一優勢。

當富片段出現在排名靠前的谷歌搜尋結果旁時,通常會包含頁面目錄的一部分,而目錄通常是通過錨連結建立的。谷歌還可能從目錄中提取內容,填充到搜尋結果頁面頂部的 “People also ask” 部分。在某些情況下,Google 甚至會在元描述下方使用可點選連結來顯示文章的錨文字。

Google特色搜尋結果
谷歌使用錨文字和目錄的所有這些方式,都有助於訪客在點選之前就瞭解他們將找到什麼,從而有助於降低網站的跳出率。這是因為你讓使用者的生活變得更輕鬆,他們可能會訪問頁面,但因為沒有馬上看到他們想要的東西而認為這不是他們要找的,然後離開。相反,你可以讓他們停留更長的時間–有更多的時間進行轉化!- 告訴他們在帖子或頁面中能找到什麼,甚至將他們連結到帖子或頁面。

(2)更容易分享內容

通過錨文字,可以輕鬆分享指向文章特定部分的連結。這對於釋出文章的社交媒體經理和需要與客戶分享幫助文章關鍵部分的支援團隊尤其有用。

缺點

(1)縮短網站停留時間

如果您衡量內容和網站效能的指標是在站時間,那麼錨連結實際上可能會減少訪客在您網站上花費的平均時間,因為他們可以直接跳到他們想要的內容,而不是閱讀整篇文章。

如何在讓訪客滿意和達到某些關鍵績效指標(KPI)之間取得平衡,這取決於您。

(2)以後可能更難更新內容

隨著時間的推移,您可能需要更新網站域名建立 301 重定向,這很可能會改變整個網站的連結。在更改連結時,可能很難跟蹤和更新您建立的所有錨文字,以確保每個連結仍然新鮮和準確。

如何手動或者通過外掛新增TOC目錄或者錨連結

1. 使用HTML新增錨連結

您在 WordPress 頁面和文章上看到的所有文字都是由 HTML 程式碼驅動的。HTML 與 CSS 和 JavaScrip t都是最常用的程式設計和標記語言。如果您能對其中任何一種語言稍加熟悉,您就能在 WordPress 網站上做更多的事情,減少更多的挫折!- 在您的 WordPress 網站上做更多的事情,減少更多的挫折。

因此,我們將首先向你展示解讀和編輯 HTML 是多麼容易!

首先,選擇要新增錨連結的頁面或文章。我們將使用部落格文章。

要建立錨連結,首先需要設定錨點。為此,請選擇要連結的小標題,然後點選浮動選單右側顯示的三個點

建立錨連結
選擇底部附近的 “以 HTML 編輯”。

以 HTML 編輯
我們需要做的是新增一個 HTML ID。這個 ID 就是我們稍後要連結的錨點。它將出現在您點選的副標題名稱之前,在我們的例子中是 >Headline 3< 。

格式為:id="anchor-name" 。我們的錨點名稱將是 “headline-3″。下面是程式碼完成後的樣子:<h2 class="wp-block-heading" id="headline-3">Headline 3</h2>.

錨點名稱將是 "headline-3"
一旦 ID 就位,你就可以將它附加到目錄中的文字(或其他你想放置它的地方),建立一個錨連結!

在我們的示例中,我們將向上滾動到目錄中的 Headline 3選中它,然後點選懸浮編輯面板中顯示的連結圖示

編輯面板中顯示的連結圖示
在連結 URL 框中,輸入我們建立的 ID,前面加上#

輸入我們建立的 ID
回車鍵使其正式生效,儲存你的工作,然後釋出你的更改。你無法在 WordPress 編輯器中看到它的操作,所以去看看你網站上的成品頁面,確保一切正常。

如果你不習慣使用程式碼,手動建立 HTML 錨點連結可能會讓你感到害怕。不過,正如你所看到的,新增錨標籤非常簡單。一旦你知道了這個過程是如何工作的,手動新增這些連結應該只需要幾秒鐘。

如果要建立指向位於不同頁面或新標籤頁上的錨點 ID 的連結,請確保包含以 https 開頭的絕對 URL。

2. 如何通過區塊編輯器建立WordPress目錄

在本節中,我們將介紹如何使用 WordPress 的 Gutenberg 區塊編輯器 建立目錄。

這種方法並沒有提供太多的靈活性,但對於那些想要避免安裝太多外掛的人來說,它是一個不錯的選擇。

  1. 登入到您的WordPress儀表盤並訪問您希望新增目錄的文章。
  2. 為要包含在TOC中的每個部分新增一個標題區塊。如果標題已經存在,請跳過此步驟 – 您可以通過標題和正文之間的不同字型大小來判斷。

H標題區塊

  1. 然後,將游標放在標題上並在高階設定下為其編寫HTML錨點。請注意,錨文字應該沒有空格。對所有標題重複此步驟,並確保每個錨名稱不同。
  1. 在要插入目錄的頁面部分新增一個列表區塊。然後,連續插入所有TOC標題。

列表區塊

  1. 使用游標突出顯示列表中的條目,然後單擊工具欄中的連結圖示。

TOC標題連結設定

  1. 在彈出框中使用井號標籤鍵入標題的目標HTML錨點,然後按Enter
  2. 對列表中的所有條目重複步驟5和6,以便它們每個都在內部連結到目標部分。

目標HTML錨點

請注意,如果您使用其他頁面構建器,上述教學將不起作用,在這種情況下,請考慮使用WordPress外掛來建立目錄。

3. 如何使用外掛新增WordPress目錄

對於包含許多標題的長文章,手動建立目錄可能會很耗時。幸運的是,一個WordPress外掛可以幫助簡化這個過程。

例如,我們將演示使用Easy Table of Contents建立TOC的步驟:

  1. 安裝並啟用外掛。
  2. 導航到WordPress儀表盤上的設定->目錄
  3. General -> Auto Insert下,選擇您希望外掛自動新增TOC的文章型別。在這裡,我們選擇了Posts

在同一部分下,您還可以配置表格的位置、標題標籤以及要顯示的標題數量。

Easy Table of Contents設定

  1. 然後,在外觀部分自定義TOC的寬度和對齊方式。也可以更改TOC的字型大小、表格主題和顏色。

Easy Table of Contents樣式

  1. 導航到高階配置設定以定義TOC的顯示條件。例如,僅選擇H1、H2和H3標題將從目錄中排除H4及以下標題。

Easy Table of Contents高階設定

  1. 點選儲存更改按鈕。

這個免費工具會在釋出時自動生成目錄。但是,我們建議在釋出之前預覽TOC,以確保沒有配置錯誤。

許多WordPress SEO外掛已經包含一個目錄建立工具。但是,如果您更喜歡使用專用的WordPress TOC外掛,這裡有我們的七個建議。

1.Easy Table of Contents

Easy Table of Contents外掛

Easy Table of Contents是下載次數最多的WordPress TOC外掛之一。它可以幫助使用者輕鬆建立目錄,而無需編輯任何HTML程式碼。您需要做的就是如上所述配置外掛的設定,目錄將自動出現在您的文章中。

這個外掛沒有高階版本,所以它的所有功能和工具都是免費的。

2.Table of Contents Plus

Table of Contents Plus

如果您執行一個包含多頁WordPress文章的更復雜的網站,這個外掛是一個合適的選擇。

受Wikipedia的TOC格式的啟發,Table of Contents Plus的開發者使使用者能夠在其帖子的側邊欄上索引和顯示TOC。

這個外掛的功能也都是免費的。

3. SimpleTOC——Table of Contents Block

SimpleTOC外掛

如果您是Gutenberg的狂熱使用者,請考慮使用此外掛來建立TOC。它直接從側邊欄小部件設定中提供Gutenberg的原生樣式選項。

值得注意的是,該外掛具有多種語言選項,並且與阿拉伯語和日語等非拉丁文字相容,為執行多語言或非英語網站的使用者提供了方便。

您可以免費將所有這些功能整合到您的WordPress儀表盤中。

4. LuckyWP Table of Contents

LuckyWP Table of Contents

LuckyWP與多個WordPress頁面構建器外掛相容。使用者可以通過調整寬度、懸停顏色和字型大小來自定義TOC的外觀。它甚至可以選擇浮動TOC。

該外掛提供了對SEO友好的功能和流暢的使用者體驗,並且所有工具都是免費的。

5.Ultimate Blocks

Ultimate Blocks

Ultimate Blocks是一個多功能外掛,為WordPress的Gutenberg編輯器提供47種型別的塊,包括目錄區塊。所有塊都是免費的,並且與WordPress 5.0及更高版本相容。

如果您有各種內容型別的冗長網站文章,此外掛是一個方便的選擇。例如,除了目錄區塊之外,它非常適合希望建立號召性用語塊和推薦區塊的博主或營銷人員。

6. Fixed TOC

Fixed TOC目錄效果展示

接下來,Fixed TOC是一個高階WordPress目錄外掛,具有更高階的樣式選項。您可以將外掛設定為自動建立表,或使用簡碼手動插入它們。此外,您可以配置Fixed TOC的表格並更改其連結、背景、懸停效果等的顏色。

FixedTOC的主要特點:

  • 根據頁面或帖子型別自動化您的目錄。
  • 建立移動響應的固定(或浮動)目錄。
  • 自定義表格的外觀以匹配您的主題。
  • 啟用平滑滾動和可摺疊標題。
  • 從一系列動畫效果中進行選擇。
  • 將外掛與Google AMP一起使用。

Fixed TOC外掛demo

使用FixedTOC,目錄將位於您的側邊欄中。這使訪問者可以隨時輕鬆跳到其他部分。您還可以選擇讓使用者隱藏表格以獲得更好的使用者體驗。

7. Magicpost

Magicpost

Magicpost 不僅僅用於為 WordPress 文章生成 TOC目錄,該外掛還整合了眾多文章編輯管理功能。

  • 文章定時釋出-Magicpost提供了更加個性化的文章定時釋出管理功能,支援批量新增草稿文章至定時釋出列表。
  • 文章搬家功能-支援批量修改、新增或者刪除文章的分類及為文章批量刪除或者新增標籤。
  • 文章翻譯支援-支援通過谷歌或者百度翻譯介面實現中英或者英中翻譯文章。
  • HTML清洗-支援配置規則,一鍵清洗文章HTML程式碼以移除無效程式碼標籤及屬性。
  • 下載管理功能-支援為文章新增檔案下載,且配合付費內容外掛實現付費資源。
  • 社交分享支援-支援為文章新增社交分享、微海報、點贊及贊助等支援。

要利用Magicpost外掛為文章新增TOC目錄,你只需要Magicpost-內容目錄,將功能開關開啟,然後根據網站情況配置自動目錄、目錄標題、目錄結構及目錄風格即可。

Magicpost外掛TOC設定

小結

新增目錄是降低跳出率和改善WordPress網站整體SEO的絕佳方法。

幸運的是,在您的WordPress文章中新增一個相對簡單。正如我們在本文中所討論的,使用者可以手動或藉助外掛建立TOC。

為了幫助您入門,我們還回顧了目錄外掛的前五名選擇。如果您是WordPress初學者,我們建議您選擇Easy Table of Contents,因為它免費且易於使用。

評論留言