免費《Easy Table of Contents外掛》實現「浮動目錄側邊欄」

看到很多架站專家都使用 Fixed TOC 這款要價 20 美金的外掛，真的是非常美麗，而且可以跟著網站風格調整顏色到非常細節的地步。只是架站小白如我，目前還沒有預算購入。

於是就摸索出兩種可行的作法，配合 Blocksy 佈景主題，只需要單一個免費 TOC 外掛，就也能夠做到大約 8 成的效果！兩種作法都非常簡單喔！

第一種作法

步驟

1. 在小工具欄位找到「資訊欄固定位置內容目錄」
2. 放進「主要資訊欄 main bar」

優點

預設就會有很漂亮的動態追蹤閱讀進度效果，讀者能夠很清楚知道自己現在在瀏覽文章的哪一個位置。

不需要配合 Blocksy 佈景主題。

缺點

比較可惜的是，不適合再多放其他小工具，會變得不太美觀，容易出現重疊的情況。如果要放其他小工具，就要用下面第二種作法。

第二種作法：大推！需配合 Blocksy 佈景主題

步驟

1. 在小工具欄位找到「內容目錄」
2. 放進「主要資訊欄 main bar」
3. 外觀 → 自訂 Blocksy 佈景主題 → 資訊欄
4. 打開「吸附資訊欄」
5. 「黏附行為」選擇「最後 X 個小工具」
6. 加碼啟用「動態追蹤閱讀進度效果」：設定 → 內容目錄 → 一般設定 → 取消勾選「平滑捲動」

優點

這種作法能夠兼顧放其他小工具和往下滑時只顯示目錄，很平順又華麗。測試過後我個人選擇使用這種作法，所以也可以看看本站文章目錄呈現的效果唷！

缺點：不會有很漂亮的動態追蹤閱讀進度效果，讀者要自己確認現在在瀏覽文章的哪一個位置。

2023/10/28 更新：
我找到可以開啟「動態追蹤閱讀進度效果」的方法了！
步驟：設定 → 內容目錄 → 一般設定 → 取消勾選「平滑捲動」
比較可惜的是，不能像付費的 Fixed TOC 可以自訂動態追蹤閱讀進度的顏色，不過畢竟是免費版的外掛，我已經帶著感恩的心使用它，以免費外掛來說我已經是非常滿意效果的呈現。

第三種作法：不推薦

使用 Easy Table of Contents 外掛內建的「固定式內容目錄」

優點

在後台可以一鍵開啟。

缺點

我認為不是很美觀。

附加的 CSS

有時候文章一長，右邊的目錄就會超出螢幕範圍無法捲動，此時只要簡單加入一個 CSS 語法，就可以解決這個問題！

1. 登入 WordPress 後台
2. 外觀→自訂→附加的 CSS
3. 貼上下面的語法

#ezw_tco-2{
		overflow-y: scroll;
		max-height: 85vh;
	}

Easy Table of Contents 外掛還有這些優點

• 免費版本就已經功能強大
• 後台是繁體中文
• 更新頻繁

結語

一般來說，很常看到架站專家們推薦 Easy Table of Contents ( 實現目錄功能 ) + Q2W3 Fixed Widget ( 實現黏附功能 ) 。

但是有了 Blocksy 佈景主題，就只需要一個免費 Easy Table of Contents 目錄外掛就可以做到囉！