Croover.inc

<p>RTOC is a table of contents generation plugin from Japan that allows anyone to easily create a table of contents. Equipped with the functions of the conventional table of contents plugin, it is designed to thoroughly pursue design and ease of use.<br />
Introducing a real-time preview with an intuitive UI design allows you to create an ideal table of contents with a single button.It is definitely a plus factor for your blog or site.RTOC is easy to use, so please use it.</p>
<h3>Install</h3>
<p>【How to automatically install from the WordPress admin screen】<br />
    ①Click “Plugins” <span aria-hidden="true" class="wp-exclude-emoji">→</span> “Add New” from the WordPress administration screen.<br />
    ②Type “Rich Table of Contents” in the new search box.<br />③Activate after installation
</p>
<p></p>
<p>【How to install manually using FTP etc.】<br />
①Download this plugin from WordPress.org（There is a button called “Download” on the right side of the plugin title on this page, so download from there）<br />②Unzip the zip file called “rich-table-of-content” and download it to the / wp-content / plugins / directory.<br />③Click the plugin from the WordPress administration screen and click Activate.</p>
<h3>Basic settings</h3>
<p>Configure the basic settings for the table of contents.</p>
<ul>
<li>Table of contents title: You can freely decide the title of the table of contents.</li>
<li>Auto insert for the following content types: You can decide whether to show the table of contents on posts and pages.</li>
<li>Heading to be displayed: Set which heading (h2, h3, h4) to display.</li>
<li>Display conditions: Set the number of headings to display the table of contents.</li>
<li>Font: Set font.</li>
</ul>
<h3>Design settings</h3>
<p>You can freely set the table of contents design.</p>
<ul>
<li>Title display: Set whether the title position is left or center.</li>
<li>H2 list design: Set the H2 list design.</li>
<li>H3 list design: Set the H3 list design.</li>
<li>Frame design: Sets the table of contents frame design.</li>
<li>Animation: Set the animation when the table of contents is displayed。</li>
<li>Smooth scroll   : Set whether to scroll to the headline when clicking (tapping) the table of contents.</li>
</ul>
<h3>Preset color settings</h3>
<p>RTOC color preset added by default. Choose and set the preset that suits your site.</p>
<h3>Color settings(For advanced users)</h3>
<p>In addition to the preset colors, you can set your own colors. If you want to set your own color or modify the preset color partially, please change the color here.</p>
<ul>
<li>Title color: Set the title color.</li>
<li>Text color: Set the text color.</li>
<li>Back color: Set the back color.</li>
<li>Border color: Set the border color.</li>
<li>H2 list color: Set the H2 list color.</li>
<li>H3 list color: Set the H3 list color.</li>
<li>Back to table of contents button background color: Sets the background color of the back to table of contents button.（Available only when Back to Contents button is enabled）</li>
</ul>
<h3>Advanced settings</h3>
<p>If you want to do advanced customization such as the button to return to the table of contents and the exclusion of plugin CSS, please set here.</p>
<ul>
<li>Button to return to table of contents: (Only for smartphones) Display a button to return to the table of contents.</li>
<li>Button location to return to table of contents: (Only for smartphones) You can set the button to return to the table of contents to the left or right.</li>
<li>Up and down adjustment of the button to return to the table of contents: （example -20,40）</li>
<li>Excluded post ID: You can set posts that you do not want to show the table of contents. Set the table of contents not to be displayed in the article by entering the post article ID separated by commas.（Example 2,3,75）</li>
<li>Excluded page ID: You can set pages that you do not want to display the table of contents. By entering page IDs separated by commas, you can set the table of contents not to be displayed in articles.（Example 4,6,91）</li>
<li>Default table of contents settings: Select whether to display the table of contents open or closed.</li>
<li>Do not load plugin CSS: If checked, all CSS of RTOC will not be read and all design settings will be invalid. If you have customized the table of contents using CSS, JS, etc., please check here and operate.</li>
</ul>
<h3>RTOC shortcode</h3>
<p>You can display the table of contents by pasting this code anywhere in the article. If you do not enter a value (such as title = “”) and it is blank, the setting on the management screen will be reflected.<br />
For details, see the actual setting screen, so check that.</p>
<h3>Help</h3>
<p>If you have any problems, we will be glad to help you contact our support.<br />
Also, basic issues are listed in the “Help section” of the plugin, so please look there first.</p>


Rich Table of Contents

RTOC is a table of contents generation plugin from Japan that allows anyone to easily create a table of contents. Equipped with the functions of the c …

WPJoli

<p>Joli Table Of Contents is the best table of contents plugin for WordPress. It is user-friendly and highly customizable, designed with performance in mind, it offers a seamless experience for both users and developers. With features like Gutenberg block support, auto-insert options, and multilingual compatibility, it’s the perfect solution for enhancing your website’s navigation.</p>
<p><a href="https://wpjoli.com/docs/joli-table-of-contents/" title="Documentation for Joli Table Of Contents" rel="nofollow ugc">Documentation</a></p>
<h3>⭐HIGHLIGHTS</h3>
<h3>🆕 GUTENBERG BLOCK</h3>
<p>Since v2, you can now use the block to insert a table of contents.<br />
The block lets you easily <strong>HIDE or EDIT</strong> specific headings.<br />
In addition, <strong>the block picks up on headings that would be generated by a third party shortcode or block</strong> but invisible in the actual editor.<br />
In the PRO version, you can override any setting for a specific block from the block settings panel.</p>
<h3>🚀 PERFORMANCE ORIENTED</h3>
<p>Joli Table of contents uses a combination of minified CSS and Javascript to run at maximum speed.<br />
It also does not depend on jQuery to improve performance.</p>
<h3>🧠 SUPERIOR HEADING PROCESSING</h3>
<p>Unlike its competitors, Joli Table of Content picks up on headings hidden behind third-party shortcodes and blocks. This means that it will show the headings that do not directly appear in the editor, but are still present in the front-end !</p>
<h3>🖌 THE MOST CUSTOMIZABLE TABLE OF CONTENTS PLUGIN</h3>
<p>Joli table of contents has been designed to really match your expectations.<br />
Every single part of the table of contents is highly customizable, and uses a CSS variable approach to make it even more customizable.<br />
You can adjust a large array of settings including:<br />
* Margin<br />
* Padding<br />
* Border radius<br />
* Border<br />
* Colors<br />
* Fonts<br />
* and more…</p>
<h3>🔽 ICON OR TEXT TOGGLE</h3>
<p>Choose between a <strong>Text toggle</strong> for a more classic look OR an <strong>Icon toggle</strong> for a more modern approach.</p>
<h3>📐 CUSTOM THEME READY</h3>
<p>Joli Table of contents now bundles a custom theme engine, that lets you <a href="https://wpjoli.com/docs/joli-table-of-contents/customizing/create-my-own-theme/" title="How to create your own theme for Joli Table of contents" rel="nofollow ugc">create your own theme</a>.<br />
There is a lot of CSS variables that you can override or/and create more complex styles.</p>
<h3>🚀 SHOW ONLY A FEW HEADINGS UPON PAGE LOAD (PARTIAL FOLD)  [PRO]</h3>
<p>Improve your page UX with the Partial Fold on load option.<br />
Only show the first few headings upon page load with a “View more” button to expand the table of contents fully.</p>
<h3>📑 ADVANCED AUTO-INSERT RULES [PRO]</h3>
<p>Auto-insert supports multiple additional rules:<br />
* Post type<br />
* Post title<br />
* Post ID</p>
<p>You can also EXCLUDE specific posts by Post title or Post ID</p>
<h3>🎛 DIFFERENT SETTINGS PER POST TYPE [PRO]</h3>
<p>Create different settings per post type for maximum flexibility.<br />
For example you can use Theme 1 for “post” post type, and use Theme 2 for the “page” post types.<br />
Good news is every single setting can be set differently per post type, not just themes !<br />
This also works with custom post types.</p>
<h3>✅ FLOATING TABLE OF CONTENTS [PRO]</h3>
<p>The floating table of contents widget is optionally displayed as the user scrolls the page. It remains hover your content and now features optional navigation buttons and advanced customization !</p>
<h3>✅ SLIDE OUT TABLE OF CONTENTS [PRO]</h3>
<p>The slide out table of contents widget brings more value to your page and makes it more readable. It shows the table of contents in a fixed position on the side of the screen.</p>
<h3>✅ PROGRESS BAR WIDGET [PRO]</h3>
<p>This new widget shows a fixed progress bar over the content and indicates the percentage of advancement throughout the reading.</p>
<h3>✅ STICKY SIDEBAR TABLE OF CONTENTS [PRO]</h3>
<p>Use the table of contents in a sidebar widget and have it sticky as the page gets scrolled.</p>
<h3>📃 Main Features</h3>
<ul>
<li>TOC Title icon (since v2.7.0).</li>
<li>Customizable Bullet points (since v2.4.0).</li>
<li>Page break <code></code> support (since v2.3.0).</li>
<li>Auto-insert table of contents (select post types and position in the content).</li>
<li>Manual insert table of contents by <strong>block</strong> or <strong>shortcode</strong>.</li>
<li>Hide specific headings (block)</li>
<li>Edit specific headings (block)</li>
<li>Folding/unfolding animation</li>
<li><strong>Customizable</strong> Table of Contents <strong>Title</strong>.</li>
<li>Show headings by custom depth (From <strong><em>H2</em></strong> to <strong><em>H6</em></strong>).</li>
<li>Customizable CSS Icons for expand/collapse buttons (4 free icons, 20 in pro version)</li>
<li>Show TOC only if a minimum of headings has been found in the content (Optional).</li>
<li>Disable headings per text/class</li>
<li><strong>Hierarchical</strong> (amount of empty space customizable) or <strong>Flat View</strong>.</li>
<li>Multiple numeration options (ex: 1. Title 1; 1.2. Subtitle 2, etc…).</li>
<li>Pretty hash in the actual URL (ex: mysite.com/my-article/#subtitle-2</li>
<li>Latin & non-latin characters support for hash  [since 1.3.2]</li>
<li>Multilanguage hash transliteration available (e.g. #История => #istoriya) [since 1.3.3]</li>
<li>Customizable numeration <strong>Separator</strong> (Ex: “.” => “1.1.2”; “-” => “1-1-2”).</li>
<li>Customizable numeration  <strong>Suffix</strong> (Ex: ).” => “1.1.2)”; “/” => “1.1.2/”).</li>
<li>Customizable Padding, Margin, Borders, etc…</li>
<li>6 Auto-insert positions available (See below for details).</li>
<li>Auto-insert to posts and/or pages.</li>
<li>Fully responsive.</li>
<li>Hide or Show Overflowing Headings when viewport cannot fit the whole title length.</li>
<li>Smooth scrolling available.</li>
<li>Customizable TOC Title alignment (left, center, right).</li>
<li>Customizable TOC Toggle button position (left, right) (when folded).</li>
<li>Customizable TOC Toggle button: Text/HTML/Custom icons (open & close states).</li>
<li>Themes included.</li>
<li>Themes settings can be overriden (Colors, size, etc).</li>
<li>Customizable Width: Min/Max Width or 100% Width.</li>
<li>Customizable Font Size, Font Weight.</li>
<li>Optional Shadow.</li>
<li>Colors fully customizable (Table of Contents, Title, Headings, Shadow, Numeration).</li>
<li>Custom CSS available.</li>
<li>Import / Export settings</li>
<li>Developer-friendly. Many hooks provided. (See below for details).</li>
</ul>
<h4>🚀 Joli Table of contents Pro Features include:</h4>
<p><a href="https://wpjoli.com/joli-table-of-contents/" title="Joli Table Of Contents Pro" rel="nofollow ugc">Get Joli Table Of Contents Pro</a></p>
<ul>
<li>All of the free features.</li>
<li><strong>Custom Post Type</strong> Support.</li>
<li><strong>Custom Post Type</strong> Settings.</li>
<li>Exclusive <strong>Floating Widget</strong> that shows the current section.</li>
<li><strong>Slide-out Widget</strong> that shows a fixed table of contents on the side of the screen.</li>
<li><strong>Additional exclusive themes</strong></li>
<li>Force <strong>Enable/Disable</strong> TOC per post settings.</li>
<li>Customizable <strong>Floating Position</strong> ( Top or Bottom ).</li>
<li>Customizable <strong>Floating Offset</strong> (Horizontally & Vertically).</li>
<li>Expands on <strong>Hover or Click</strong>.</li>
<li>Collapses on <strong>Leave hover or Click away</strong>.</li>
<li><strong>Multi-columns mode</strong> (since 1.1.0).</li>
<li>Customizable CSS Icons for expand/collapse buttons (choose from 20 icons)</li>
</ul>
<h4>Auto-insert</h4>
<p>The Auto-insert feature is optional and allows to automatically insert the Table of Contents to your content with the following options.</p>
<p><em>Supported post types:</em><br />
* Post<br />
* Pages<br />
* Custom Post Type <strong><em>[PRO]</em></strong></p>
<p><em>Auto-insert positions:</em><br />
* Before the content<br />
* After the content<br />
* Before H1<br />
* After H1<br />
* Before first H2<br />
* After first paragraph</p>
<h3>Shortcode</h3>
<p>Use the following shortcode within your content to have the table of contents display where you wish to:</p>
<pre><code>[joli-toc]
</code></pre>
<p>If you were using a different TOC plugin, you can use a different shortcode so that you don’t need to update all of your content:</p>
<pre><code>[toc]

// Add this code to your theme's functions.php
add_filter('jolitoc_shortcode_tag', function(){ return 'toc';});
</code></pre>
<h3>🎣 Hooks</h3>
<p>You can use any of the hooks provided to add custom content to the actual Table Of Contents.<br />
List of [all the hooks available here](https://wpjoli.com/docs/joli-table-of-contents/developer-hooks/”Joli Table Of Contents Hooks”).</p>
<p><strong>Examples & How to use ?</strong></p>
<p>Copy & paste the code examples below into your theme’s functions.php file:</p>
<ul>
<li><code>joli_toc_disable_autoinsert</code></li>
</ul>
<p>Globally disables Joli Table Of Contents site-wide.</p>
<pre><code>add_filter('joli_toc_disable_autoinsert', function(){ return true; });
</code></pre>
<ul>
<li><code>joli_toc_disable_js</code></li>
</ul>
<p>For some reason if you do not want the js/css/inline styles to load (could break functionnalities).</p>
<pre><code>//disables js
add_filter('joli_toc_disable_js', function(){ return true; });

//disables css
add_filter('joli_toc_disable_styles', function(){ return true; });
</code></pre>
<ul>
<li><code>jolitoc_shortcode_tag</code></li>
</ul>
<p>Customizes the shortcode tag ( <em>Useful if you were using a different plugin before</em> ).</p>
<pre><code>add_filter('jolitoc_shortcode_tag', function(){ return 'custom-tag';});
</code></pre>
<p>Customizes the title (collapse).</p>
<pre><code>add_filter('joli_toc_toc_title', 'my_custom_title', 10, 1);

function my_custom_title( $title ){ 
    if ($a == $b){
        $title = "My Custom TOC Title";
    }else{
        $title = "My Alternate TOC Title";
    }

    return $title;
}
</code></pre>
<h4>⭐ CHECK OUR OTHER PLUGINS</h4>
<ul>
<li><a href="https://wordpress.org/plugins/smart-auto-featured-image/" rel="ugc">Smart Auto Featured Image</a></li>
<li><a href="https://wordpress.org/plugins/zenform/" rel="ugc">ZenForm</a></li>
<li><a href="https://wordpress.org/plugins/joli-faq-seo/" rel="ugc">Joli FAQ SEO</a></li>
<li><a href="https://wordpress.org/plugins/joli-clear-lightbox/" rel="ugc">Joli CLEAR Lightbox</a></li>
</ul>

Joli Table Of Contents

The Best Table of Contents Plugin for WordPress. User-friendly. Gutenberg Block. Fast & Highly customizable. Auto or manual insert.

Rich Table of Contents vs Joli Table Of Contents