Обзор и назначение плагина toc_page для Cotonti

Версия: 1.0.1
Автор: webitproff
Лицензия: BSD
Исходный код: github.com/webitproff/toc_page-cotonti

Оглавление

1. Назначение плагина
2. Какие задачи он решает
3. Ключевые возможности
4. Для кого предназначен
5. Общий принцип работы
6. Интерфейс администратора
7. Пример: база знаний для модуля фильтра товаров OpenCart
8. Пример: документация для шаблона сайта
9. Пример: справочник разработчика
10. Таблица в админке: как это выглядит
11. Вывод на сайте: как это видит посетитель
12. Мультиязычность и локализация
13. Сценарии использования
14. Мировые аналоги и практики
15. Преимущества перед автоматическими меню
16. Лицензия и исходный код
17. Заключение

Назначение плагина

Плагин toc_page создан для сайтов на CMF Cotonti. Он позволяет администратору вручную собирать и управлять оглавлением, навигационным деревом или структурой документации. Это не автоматический генератор списка страниц, а инструмент, который даёт полный контроль над порядком, вложенностью и составом разделов.

Основная идея проста: вы создаёте дерево, добавляете в него элементы — категории, отдельные страницы или произвольные ссылки, — расставляете их в нужном порядке и выводите на сайте в виде аккуратного списка. Всё это делается без изменения структуры самих страниц Cotonti и без привязки к автоматическому порядку категорий.

Плагин решает задачу, с которой сталкиваются владельцы и разработчики сайтов: как сделать удобную базу знаний, документацию продукта, справочный центр или просто структурированное меню, которое можно быстро менять и адаптировать под задачу. Он одинаково хорошо подходит для небольшого сайта-визитки и для крупного портала с десятками разделов.

Какие задачи он решает

Когда на сайте много страниц и категорий, рано или поздно возникает потребность показать их посетителю в понятном порядке. Штатная структура категорий Cotonti хороша, но она не всегда совпадает с логикой документации. Например, в категории «Модули» могут лежать страницы, которые пользователю удобнее видеть в разделе «Руководства». Автоматическое меню не сможет это сделать без переноса страниц между категориями.

Плагин toc_page решает эту проблему. Вы можете:

• объединять в одном дереве страницы из разных категорий;
• располагать их в любом порядке, независимо от даты публикации или алфавита;
• создавать многоуровневую иерархию: раздел, подраздел, страница;
• добавлять внешние ссылки на сторонние ресурсы;
• временно скрывать отдельные пункты без удаления контента;
• использовать несколько независимых деревьев для разных областей сайта.

Всё это делает плагин идеальным решением для построения разделов «Помощь», «Документация», «База знаний», «Руководство пользователя», «FAQ» и других справочных разделов, где порядок и структура важнее автоматической сортировки.

Ключевые возможности

toc_page предоставляет набор простых, но мощных возможностей, которые закрывают большинство задач по организации контента.

Ручное управление деревом

Каждый элемент дерева можно перемещать вверх или вниз, менять родителя и задавать порядок сортировки. Это позволяет выстроить структуру ровно так, как задумано, а не так, как диктует система.

Три типа элементов

• Категория — ссылка на категорию страниц Cotonti. Позволяет вывести все материалы категории одним пунктом или использовать категорию как заголовок для вложенных страниц.
• Страница — ссылка на конкретную страницу Cotonti. Можно добавить в дерево любые страницы, даже если они находятся в разных категориях.
• Произвольная ссылка — ссылка на любой URL: другой раздел сайта, внешний ресурс, файл, документ. Полезно для добавления внешних руководств, форумов, маркетплейсов.

Гибкая иерархия

Глубина вложенности не ограничена жёстко, но на практике достаточно 3–4 уровней, чтобы структура оставалась понятной. Вы сами решаете, что будет родителем, а что потомком.

Несколько деревьев

Можно создать неограниченное количество деревьев. Например, одно для документации по одному продукту, другое для справки по другому, третье для служебного меню в подвале сайта.

Локализация

Если на сайте включён плагин i18n, заголовки категорий и страниц автоматически подхватываются на языке текущей локали. Это экономит время при создании многоязычных справочников.

Управление видимостью

Каждый элемент можно временно отключить, не удаляя его. Это удобно при подготовке новых разделов или сезонных акциях.

Простой вывод на сайте

Дерево выводится одной функцией в любом шаблоне. Вы можете разместить его в сайдбаре, в шапке, в подвале или на отдельной странице.

Для кого предназначен

Плагин будет полезен разным группам пользователей Cotonti.

Разработчики продуктов

Автор модуля, плагина или шаблона может быстро создать публичную базу знаний для своего продукта. Например, разработчик модуля фильтра товаров для OpenCart может сделать раздел с инструкцией по установке, настройке, типовым ошибкам и ответам на частые вопросы.

Владельцы сайтов

Владелец интернет-магазина или сервиса может организовать раздел «Помощь» с руководствами по оплате, доставке, возврату, личному кабинету и другим темам.

Администраторы и контент-менеджеры

Тем, кто наполняет сайт статьями и инструкциями, больше не нужно помнить, в какой категории лежит материал. Они могут собрать удобное оглавление вручную и обновлять его по мере необходимости.

Веб-студии и фрилансеры

При сдаче проекта клиенту можно быстро подготовить документацию по управлению сайтом, собрав нужные страницы в одном дереве.

Общий принцип работы

Работа с плагином состоит из трёх простых шагов.

1. Создание дерева. Вы даёте ему название и описание. Это контейнер для будущего оглавления.
2. Добавление элементов. Вы добавляете категории, страницы или ссылки и сразу указываете, где они должны находиться в иерархии.
3. Вывод на сайте. В нужное место шаблона вставляется вызов дерева по его ID. Посетитель видит готовый структурированный список.

Никакого сложного программирования не требуется. Все операции выполняются в административной панели Cotonti.

Интерфейс администратора

В админ-панели плагин представлен двумя вкладками: «Деревья» и «Редактирование дерева».

Вкладка «Деревья»

Здесь находится список всех созданных деревьев. Для каждого дерева отображаются ID, название и описание. Можно сразу перейти к его содержимому, переименовать или удалить.

В этой же вкладке создаются новые деревья: достаточно ввести название и описание.

Вкладка «Редактирование дерева»

Это рабочее пространство для управления элементами. Сверху показано, какое дерево редактируется. Ниже расположена таблица всех элементов с колонками:

• ID элемента
• Тип (категория, страница или произвольная ссылка)
• Ссылка на объект (название категории, страницы или URL)
• Заголовок (можно изменить вручную)
• Родитель (выпадающий список для настройки вложенности)
• Порядок (числовое поле для сортировки)
• Включено (флажок видимости)
• Действия (кнопка удаления)

Под таблицей находится форма добавления нового элемента. Вы выбираете тип, указываете нужный объект или URL, при желании задаёте свой заголовок и родителя. Новый элемент сразу появляется в таблице, где его можно дополнительно настроить.

Пример: база знаний для модуля фильтра товаров OpenCart

Представьте, что вы разработали модуль фильтра товаров для OpenCart. У вас есть несколько страниц с инструкциями, которые лежат в разных категориях Cotonti: «Модули», «Настройки», «Частые вопросы». С помощью toc_page вы можете собрать их в единое дерево:

• Начало работы
  • Установка модуля
  • Активация и базовые настройки
  • Быстрый старт
• Расширенные возможности
  • Фильтры по цене
  • Фильтры по бренду
  • Комбинированные фильтры
• Частые вопросы
  • Почему фильтр не отображается?
  • Как кэшировать результаты?
  • Как перевести интерфейс?

Посетитель, зашедший в раздел документации, увидит эту структуру слева или сверху и сможет быстро перейти к нужной инструкции. Всё управление — в админке, без правки кода.

Пример: документация для шаблона сайта

Вы продаёте шаблон для Cotonti. К нему прилагается документация: как установить, как настроить цвета, как использовать виджеты, как обновлять. Страницы документации разбросаны по разным разделам, но с помощью toc_page вы объединяете их в одно дерево с логичной структурой:

• Установка
  • Загрузка файлов
  • Активация шаблона
  • Первичная настройка
• Настройка внешнего вида
  • Цветовая схема
  • Шрифты
  • Шапка и подвал
• Виджеты и блоки
  • Слайдер
  • Отзывы
  • Социальные кнопки

Такое оглавление удобно поддерживать: при выходе новой версии шаблона вы просто добавляете новую страницу в нужный раздел или меняете порядок.

Пример: справочник разработчика

Если вы ведёте сайт о какой-то технологии или фреймворке, toc_page поможет построить полноценный справочник. Например, для Cotonti можно создать такие разделы:

• Основные концепции
  • Маршрутизация
  • База данных
  • Кэширование
• Расширение системы
  • Плагины
  • Модули
  • Темы
• API и справочники
  • Функции ядра
  • Классы
  • Хуки

В отличие от автоматического списка категорий, вы сами решаете, что включить, а что скрыть. Устаревшие материалы можно оставить в отдельном «Архиве», не удаляя их из базы.

Таблица в админке: как это выглядит

Ниже показан упрощённый пример того, что видит администратор при редактировании дерева.

Администратор видит сразу всю структуру и может изменить любой параметр прямо в таблице, затем нажать «Сохранить изменения».

Вывод на сайте: как это видит посетитель

На фронтенде дерево отображается как вложенный список. Если элемент имеет URL, он становится ссылкой. Если URL пустой и при этом у элемента есть дочерние пункты, он работает как заголовок-разделитель.

Пример вывода:

• Начало работы
  • 1.1. Установка модуля
  • 1.2. Активация и настройка
• Частые вопросы

Внешний вид легко настраивается через CSS. Вы можете задать отступы для уровней, цвета для ссылок, маркеры и другие стили под дизайн вашего сайта.

Мультиязычность и локализация

Если на сайте используется плагин i18n, toc_page автоматически подставляет переведённые названия категорий и страниц. Это особенно важно для международных продуктов, где документация должна быть доступна на нескольких языках.

Для каждого элемента можно указать свой заголовок вручную, который будет одинаков на всех языках. Но если оставить заголовок пустым, плагин возьмёт локализованное название из системы. Таким образом, одна и та же структура дерева может обслуживать несколько языковых версий без дублирования.

Сценарии использования

toc_page подходит для разных ситуаций. Рассмотрим несколько распространённых кейсов.

Документация плагина или модуля

Разработчик создаёт страницы с инструкциями и собирает их в дерево. Покупатели получают понятное руководство, а автор — простой способ его обновлять.

База знаний интернет-магазина

Владелец магазина объединяет страницы о доставке, оплате, возврате, гарантии. Посетитель быстро находит ответы на вопросы, что снижает нагрузку на службу поддержки.

Справочный центр сервиса

Сервис по бронированию или фриланс-биржа размещает в одном дереве правила, тарифы, обучающие материалы и контакты.

Корпоративная wiki

Внутренний портал компании может использовать toc_page для структурирования инструкций для сотрудников: регламенты, шаблоны, политики.

Персональный блог или портфолио

Даже на личном сайте удобно иметь оглавление по рубрикам, составленное вручную.

Мировые аналоги и практики

Идея ручного управления деревом документации широко применяется в популярных системах. Например, в WordPress с помощью плагинов типа SimpleTOC или LuckyWP Table of Contents можно вывести оглавление страницы, а меню документации часто строят вручную через стандартные меню WordPress.

В Bootstrap документация организована как вложенное меню с чёткими разделами: «Getting Started», «Components», «Utilities». То же самое в Next.js, Vue.js, React — их официальные сайты используют древовидную навигацию, где порядок задаётся вручную.

Плагин toc_page приносит тот же принцип в Cotonti: полный контроль над структурой, без привязки к автоматическим алгоритмам.

Преимущества перед автоматическими меню

Автоматические меню строятся по категориям, датам или алфавиту. Это удобно для блога, но плохо для документации, где важна логическая последовательность. toc_page устраняет этот недостаток.

Вы сами решаете, что показать первым, а что спрятать в конце. Вы можете смешивать категории и страницы, добавлять внешние ссылки и менять структуру за пару кликов. Никаких ограничений, кроме вашей фантазии.

Лицензия и исходный код

Плагин распространяется по лицензии BSD. Это значит, что вы можете свободно использовать, изменять и распространять его, в том числе в коммерческих проектах.

Актуальный исходный код всегда доступен по ссылке: github.com/webitproff/toc_page-cotonti. Там же можно сообщить об ошибке или предложить улучшение.

Заключение

Плагин toc_page — это простой и гибкий инструмент для создания структурированных оглавлений, баз знаний и документации на Cotonti. Он не требует программирования, даёт полный контроль над содержимым и легко вписывается в любой проект.

Если вам нужно быстро навести порядок в контенте, представить продукт понятной навигацией или организовать справочный центр — этот плагин станет надёжным помощником.