前言介紹
- 這款 WordPress 外掛「TOC Builder by RobertIvan」是 2025-12-01 上架。
- 目前尚無安裝啟用數,是個很新的外掛。如有要安裝使用,建議多測試確保功能沒問題!
- 上一次更新是 2025-12-02,距離現在已有 85 天。
- 外掛最低要求 WordPress 6.0 以上版本才可以安裝。
- 外掛要求網站主機運作至少需要 PHP 版本 7.4 以上。
- 有 1 人給過評分。
- 還沒有人在論壇上發問,可能目前使用數不多,還沒有什麼大問題。
外掛協作開發者
外掛標籤
toc | headings | gutenberg | navigation | table of contents |
內容簡介
總結:TOC Builder by RobertIvan 是一款內容條目表格的外掛程式,可以自動從您的內容標題生成導覽選單。它包含管理介面進行配置,適用於長篇內容、文件站點和部落格。
問題與答案:
1. TOC Builder by RobertIvan能夠自動掃描內容的標題範圍是什麼?
- 回答:可以自動掃描內容的標題範圍為H1-H6。
2. 這個外掛程式在滾動時如何突出顯示目前所在部分?
- 回答:TOC Builder具備SpyScroll功能,可以在滾動時突出顯示目前所在部分。
3. 未來的架構中,TOC Builder的管理介面將容納哪些功能?
- 回答:包括自訂配色方案和字型選項、進階CSS自定義、性能優化控制、分析追踪能力、預建設計模板和多語言支持基礎架構。
原文外掛簡介
TOC Builder by RobertIvan is a Table of Contents plugin that automatically generates a navigation menu from your content’s headings. It includes an admin interface for configuration and is suitable for long-form content, documentation sites, and blogs.
Core Features
Auto-Detection – Automatically scans content for headings (H1-H6)
Smooth Scroll – Animated scrolling to sections
SpyScroll – Highlights the current section in the TOC while scrolling
Gutenberg Ready – Includes a native block with live preview in the editor
Configurable – Customize position, colors, heading levels, and more
Performance – Assets loading and caching optimized
Responsive – Compatible with desktop, tablet, and mobile devices
Admin Interface
TOC Builder by RobertIvan features an admin settings page for configuration:
Design System
Gradient color scheme
Animations and transitions
Card-based layout
System typography
WordPress Sidebar Menu Structure
Dedicated Sidebar Menu – Menu in WordPress sidebar with a custom icon
General Settings – Core TOC functionality with live preview
Appearance Settings – Visual customization options (coming soon)
Advanced Settings – Options for developers (coming soon)
Premium Features – Planned functionality
Bookmarkable URLs – Direct URLs for each section
User Experience
Live Preview – Preview updates based on selected heading levels
Heading Selection – Click on heading boxes (H1-H6) to toggle selection
Visual Hierarchy – Preview shows TOC structure based on heading selections
Interactive Demo – Collapsible TOC preview with hide/show functionality
Visual Feedback – Checkboxes with gradient backgrounds when selected
2-Column Layout – Settings on left, sticky live preview on right (desktop)
Responsive Design – Stacked layout on smaller screens
Future Architecture
The admin interface is designed to accommodate upcoming features:
Custom color schemes and typography options
Advanced CSS customization
Performance optimization controls
Analytics and tracking capabilities
Pre-built design templates
Multi-language support infrastructure
Suitable For
Long-form blog posts and articles
Documentation and knowledge bases
Educational content and tutorials
Product guides and manuals
Any content with multiple headings
Technical Details
File Structure
toc-master/
├── assets/
│ ├── css/
│ │ ├── style.css (Frontend TOC styles)
│ │ └── admin-premium.css (Admin interface styles)
│ └── js/
│ ├── script.js (Frontend functionality)
│ ├── admin-settings.js (Admin interface interactions)
│ └── block.js (Gutenberg block)
├── includes/
│ ├── class-toc-generator.php (Core TOC generation logic)
│ ├── class-toc-settings.php (Settings page with UI)
│ └── class-toc-block.php (Gutenberg block registration)
└── toc-builder.php (Main plugin file)
Admin Interface Architecture
The settings pages use a component-based architecture:
CSS Design System – CSS custom properties, modular components, responsive breakpoints
WordPress Sidebar Navigation – Individual pages for each settings section
Live Preview System – TOC rendering with dynamic heading selection
Color Palette
Primary Colors:
* Primary Gradient: #4F46E5 → #7C3AED
* Accent Cyan: #06B6D4
* Accent Purple: #A855F7
Neutral Colors:
* Gray Scale: #F1F5F9 → #0F172A
* Success: #10B981
* Warning: #F59E0B
Support
For support, feature requests, and bug reports, please visit the plugin’s support forum on WordPress.org.
Credits
Developed with ❤️ for the WordPress community.
各版本下載點
- 方法一:點下方版本號的連結下載 ZIP 檔案後,登入網站後台左側選單「外掛」的「安裝外掛」,然後選擇上方的「上傳外掛」,把下載回去的 ZIP 外掛打包檔案上傳上去安裝與啟用。
- 方法二:透過「安裝外掛」的畫面右方搜尋功能,搜尋外掛名稱「TOC Builder by RobertIvan」來進行安裝。
(建議使用方法二,確保安裝的版本符合當前運作的 WordPress 環境。
延伸相關外掛(你可能也想知道)
Add Anchor Links 》此外掛會在選定文章內容中的標題標籤建立錨點連結,就像 Github 在 Readme.md 檔案中所做的一樣。, 歡迎加入 Github,參與開發:https://github.com/vyskoczi...。Notice Boxes with Shortcodes 》使用短代碼在您的文章中製作美觀且顯著的框,例如資訊框、警告框、成功框等等。這些框非常容易添加,非常吸引人。, 特點:, , 通知框的關閉按鈕,可以在點擊...。
tinyTOC 》這是一個微小和簡單的 WordPress 外掛,可以幫助長文獻的導覽,自動生成類似於維基百科目錄的表格。, 它的工作原理是掃描文本中的標題 (<h1> - <h6&...。
Copy Link to Heading – Easily add Anchor links for Headings 》總結:「Copy Link to Heading」是一個 WordPress 外掛,讓您可以輕鬆復制特定文章標題部分的直接連結,方便書籤、分享或直接跳轉至標題而不需滾動整個頁面。...。Stimulate Correct Headings 》這個外掛鼓勵 WordPress 編輯人員使用正確的標題以符合無障礙性與 SEO 標準。 WordPress 的所見即所得編輯器預設隱藏標題標籤,並且在非「所見即所得」的文字...。
Headings 》使用類別,在您的文章中製作樣式化的筆記框、警報框、幫助框、提示框、重要框和許多其他框。 。
Correct My Headings 》如果您的副標題出現在存檔搜尋頁面,它們需要從 H3 開始(因為存檔搜尋頁面上的 H2 標籤已被文章標題使用)。, 這個外掛會在副標題在您的網站上顯示前,進行...。
NanoTOC — Fast Lightweight Table of Contents 》HTML 標籤的符號是這樣的 <>, 請注意以下的格式。, , <h3>摘要:</h3>, <ul>, <li>NanoTOC 是一款快速、輕量級的 WordPress...。Ajejey Smart Table of Contents 》總結:Ajejey Smart Table of Contents 是一個專業的目錄外掛,可以從你的內容標題 (H1-H6) 中自動生成表格目錄,並具備流暢的滾動導航和多個設計模板。, , ...。
Link to Headline – Anchor Link Generator 》總結:Link to Headline 是一個 WordPress 外掛,能自動在標題元素(H2、H3、H4)旁加入錨點連結圖示。點擊時,這些圖示會將直接 URL 複製到剪貼簿,讓讀者輕...。
Protos TOC Generator 》總結:Protos TOC Generator是一個WordPress外掛,能夠自動掃描標題標籤(<h1>至<h6>),並為文章和頁面創建目錄。同時,它添加錨...。
XTND Table Of Content 》總結:Xtnd Table Of Content 是一個 Gutenberg 區塊外掛程式,可將強大而動態的目錄(TOC)添加到您的文章和頁面中。它自動偵測內容中的標題,生成錨點連結...。
Simple Sticky TOC 》總結:Simple Sticky TOC是一個輕量且移動端友好的WordPress外掛,通過解析<h2>、<h3>和<h4>標籤,自動生成單篇...。
AT – Table Of Content 》總結:此外掛可根據標題標籤自動插入文章內容的目錄。您可以在編輯器中使用核取方塊按文章啟用此功能。, , 問題與答案:, <ul>, <li>, <...。
SmoothTOC 》```html, <!DOCTYPE html>, <html>, <body>, , <h2>外掛介紹總結:</h2>, <p>SmoothTOC根據您選擇的標題(H2、H3等)自...。
