CM Table of Contents (CMTOC) - Style - Modifying TOC Button (Floating TOC, Show/Hide)


Modifying the Show/hide Table of Contents button

Back to User Guides

The  Show/hide button appears by default above and to the right of the Table of Contents. There are several options for this within the Plugin Settings.

Example

For these settings, navigate to  CM Table of Contents Pro → Settings → Table of Contents 


Hide Table of Contents by Default


To hide the TOC by default, enable the setting Default appearance → Collapse Table of Contents by default?


Appearance of the 'Show/Hide' button

The font size, color and style of Show/hide button can be manipulated inside the Title Style option.

Show/hide label alignment - Choose between:

  • Left edge
  • Near the title text
  • Right edge

Show/hide toggle styling - Define:

  • Size
  • Color
  • Weight
  • Decoration
  • Style


Floating Button

What Is It

The plugin also has a floating TOC option. This persistent button will be seen while the user navigates the content. Clicking it will trigger the TOC, as shown:

Example

Settings

Show Button - Turn on or off

Render button in content area - The TOC button will appear only when the article/post content is visible on screen during scrolling. When the content is out of screen, the  button will disappear

  • Hide main TOC - Hides the main Table of contents and only shows the floating TOC. Can only work if  "Render button in content area" is enabled

Button Text - Front-End label

Button styling:

  • Background color
  • Opacity
  • Border color
  • Border width

TOC styling:

  • Text font-size
  • Text color
  • Background color
  • Background opacity
  • Border width
  • Border color
  • Content height
    • Auto - Adapts the height based on the TOC
    • Full Height - Occupies the full page height
  • Position - Where it will appear on the page
    • Top
    • Middle

More information about the  CM Table of Contents Plugin

Other WordPress products can be found at CreativeMinds WordPress Store

Let us know how we can Improve this Product Documentation Page

To open a Support Ticket visit our support center
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us