diff --git a/docs/source/components.rst b/docs/source/components.rst index b2fba86a..8132a122 100644 --- a/docs/source/components.rst +++ b/docs/source/components.rst @@ -3,7 +3,7 @@ single: Plugins ############################ - Standard Component plugins + Standard component plugins ############################ ``djangocms-frontend`` adds a set of plugins to Django-CMS to allow for diff --git a/docs/source/index.rst b/docs/source/index.rst index 1c2e9349..75dd11f2 100644 --- a/docs/source/index.rst +++ b/docs/source/index.rst @@ -80,9 +80,9 @@ Contents :maxdepth: 3 getting_started - custom_components grid components + custom_components plugins/toc how-to/index reference diff --git a/docs/source/plugins/toc.rst b/docs/source/plugins/toc.rst index 196b1b06..f1ad71ff 100644 --- a/docs/source/plugins/toc.rst +++ b/docs/source/plugins/toc.rst @@ -89,30 +89,38 @@ To create a table of contents: Positioning at Top of Page ========================== +Table of contents at the top Example +------------------------------------ + Since the TOC must be placed after headings to collect them, use grid layouts to display it at the top: +1. Create a container +2. Add a row with two columns +3. In the first (bottom) column: Add your content with Heading plugins +4. In the second (top) column: Add the TOC plugin +5. Set the column width and order: Both columns should cover full width (typically 12/12), + the second columns should be shown before (i.e., at the top) the first (then at the bottom) + Two Column Layout Example ------------------------- 1. Create a container 2. Add a row with two columns -3. In the first (left) column: - - Add the TOC plugin -4. In the second (right) column: - - Add your content with Heading plugins +3. In the first (left) column: Add your content with Heading plugins +4. In the second (right) column: Add the TOC plugin 5. Set column widths appropriately (e.g., 3/9 split) Example Structure:: Container └── Row - ├── Column (col-3) - │ └── TOC Plugin - └── Column (col-9) - ├── Heading Plugin - ├── Content... - ├── Heading Plugin - └── More content... + ├── Column (col-9) + │ ├── Heading Plugin + │ ├── Content... + │ ├── Heading Plugin + │ └── More content... + └── Column (col-3) + └── TOC Plugin This creates a sidebar layout with the TOC always visible while scrolling through content.