Автоматическое создание блока Оглавлений на странице контенета
Содержание:
В этой статье хочу рассказать, как я делал автоматическое создание Оглавления (Содержания) на страницах статей этого сайта, работающего на CMS DLE (DataLife Engine). Для реализации этого потребуется добавить в скрипты движка сайта небольшой модуль и провести небольшие изменения в шаблоне сайта. Уверяю, что сделать эти манипуляции совсем не сложно, и для этого не нужно быть программистом, хотя некоторые понятия в структуре сайта все же потребуется.
↑ Зачем нужно Оглавление на странице контента?
Тексты с оформленным Оглавлением, включающим пункты и подпункты смысловых разделов, имеет несколько полезных моментов:
- Удобство для читателей сайта благодаря быстрому переходу к нужному разделу контента;
- Благодаря Оглавлению во многих случаях улучшается дизайн страницы;
- Поисковые системы лучше воспринимают страницы с Оглавлениями, так как на них присутствуют дополнительные внутренние ссылки и тэги подзаголовков.
↑ Как работает модуль автоматического создания Оглавлений?
При создании контента страницы сайта, следует в текст включать подзаголовки H2-H6. На основании этих подзаголовков и будет впоследствии формироваться оглавление. Причем пункты Оглавления будут создаваться с учетом иерархии. Единственное, о чем следует помнить при создании контента, это то, что первый тэг подзаголовка в тексте должен быть H2. Если же, к примеру, первым будет тег H4, а далее будет подзаголовок H2, в этом случае, то что ниже тэга не будет выводиться в Оглавлении. Так же, если в тексте совсем не будет подзаголовков, то блок Оглавления формироваться не будет.
↑ Установка и настройка модуля Оглавлений
↑ Копирование и размещение модуля на сервер
Далее предлагаю пошаговую инструкцию по установке и настройке модуля автоматического создания Оглавления (Содержания) на страницах статей в CMS DLE. Последовательность следующая:
- Скачиваем модуль к себе на компьютер;
- Распакуйте скачанный архив;
- Найдите в папке файл headers_menu.php и залейте его на сервер своего сайта в папку: engine/modules/
- Далее в этой же папке найдите файл show.full.php (его полный адрес engine/modules/show.full.php). Этот файл необходимо открыть либо прямо на сервере, либо предварительно скопировав себе на компьютер;
- В этой папке нужно найти следующую запись:
$tpl->set( '{navigation}', " " );
- И после нее необходимо добавить следующие строки:
///////////////////////////////////////////////////////////////////////
include_once ENGINE_DIR . '/modules/headers_menu.php';
///////////////////////////////////////////////////////////////////////
↑ Оформление и стили Блока Оглавления
↑ Файл полной новости - fullstory.tpl
Далее зайдя в админку своего сайта, через раздел «Шаблон сайта», заходим в файл кода отображения контента полной новости - fullstory.tpl . В место вывода блока Оглавления необходимо вставить код:
[hmenu] <div class="contents"> <p class="zagl">Содержание:</p> <ul class="h-menu"> <li>{hmenu}</li> </ul> </div>[/hmenu]
↑ Стили шаблона
В файл стилей вашего шаблона (обычно это style.css) в любом месте, например, в самом конце, нужно вставить стили блока объявлений
/* BLOK_MENU_TEXT ----------------------------------------------- */
.contents{background: #F8F9FA;border: 1px solid #A2A9B1;padding: 15px 20px 10px 5px;display: table;border-radius: 2px;margin-top: 15px;} .zagl{margin: 0;padding: 0 0 3px;font: bold 17px 'Trebuchet MS';text-align: center;} .contents ul{margin: 0;padding: 0 0 0 20px;list-style: none;} .contents ul li{margin: 0;padding: 1px 0;} .contents ul li span{color: #444;font-size: .9em;}
Разумеется, что все параметры стилей: размеры шрифтов и отступов, цвет фона и прочее, можно отредактировать по своему усмотрению.
Скачать модуль автоматического создания Блока Оглавления можно здесь