Loading...
 
Skip to main content

The automatic table of content in a wiki page became unpractical

Status
Open
Subject
The automatic table of content in a wiki page became unpractical
Version
29.x
master
Category
  • Usability
  • Easy for Newbie Dev
Feature
Wiki (page view, edit, history, rename, etc)
Wiki Structure (book & table of content)
Resolution status
New
Submitted by
Bernard Sfez / Tiki Specialist
Volunteered to solve
joel.magene
Lastmod by
Ushindi Gedeon
Rating
(0)
Description

On a long wiki page with a lot of Headings (h1, h2, h3, etc) usage the automatic table of content (admin -> Wiki page) use to help navigating on the page as headings were styled.

H1: bigger/bolder than h2 bigger/bolder than H3, etc...

Now they all look the same and it is very hard to use on long pages.

Image

Solution
Workaround

My quick workaround:

Copy to clipboard
/* For autotoc in wiki pages */ /* Level 1 - Top level (h1) */ #autotoc > ul > li > a { font-size: 1.5rem; font-weight: 700; color: var(--bs-primary-dark); padding: 0.6rem 0; display: block; border-left: 3px solid transparent; padding-left: 0.75rem; transition: all 0.2s ease; } #autotoc > ul > li > a:hover { color: var(--bs-primary); border-left-color: var(--bs-primary); background-color: var(--bs-light); text-decoration: none; } /* Level 2 - Second level (h2) */ #autotoc > ul > li > ul > li > a { font-size: 1.45rem; font-weight: 700; color: var(--bs-dark); padding: 0.45rem 0 0.45rem 1.25rem; display: block; border-left: 2px solid transparent; transition: all 0.2s ease; } #autotoc > ul > li > ul > li > a:hover { color: var(--bs-secondary-dark); border-left-color: var(--bs-secondary); text-decoration: none; } /* Level 3 - Third level (h3) */ #autotoc > ul > li > ul > li > ul > li > a { font-size: 1.15rem; font-weight: 500; color: var(--bs-gray-dark); padding: 0.35rem 0 0.35rem 2rem; display: block; border-left: 2px solid transparent; transition: all 0.2s ease; } #autotoc > ul > li > ul > li > ul > li > a:hover { color: var(--bs-secondary); border-left-color: var(--bs-secondary-light); text-decoration: none; } /* Level 4 - Fourth level (h4) */ #autotoc > ul > li > ul > li > ul > li > ul > li > a { font-size: 1rem; font-weight: 400; color: var(--bs-gray); padding: 0.3rem 0 0.3rem 2.75rem; display: block; transition: all 0.2s ease; } #autotoc > ul > li > ul > li > ul > li > ul > li > a:hover { color: var(--bs-primary-light); text-decoration: none; } /* Active state */ #autotoc a.active { color: var(--bs-primary) !important; border-left-color: var(--bs-primary) !important; background-color: var(--bs-light); font-weight: 700 !important; }
Importance
7
Easy to solve?
8
Priority
56
Demonstrate Bug on Tiki 19+
Please demonstrate your bug on show2.tiki.org
Demonstrate Bug (older Tiki versions)
Ticket ID
8906
Reviewed by Wishlist Team On
20 Jan 26 08:16 UTC
Created
Sunday 18 January, 2026 08:55:55 UTC
by Bernard Sfez / Tiki Specialist
LastModif
Tuesday 20 January, 2026 08:15:21 UTC


Collapse/expand modules below
Show PHP error messages