Шаблоны для DLE » Модули » Вывод содержания статьи

Представляем вам модуль вывод содержания статьи для DLE 12.x - 13.x который позволит в авто режиме формировать содержание статьи на основании использованных в статье заголовков, формируемый код html при надобности если нужно достаточно легко можно заменить на свое в самом файле модуля, также смотрите наши и другие модули для dle. Смотрите примеры самой реализации на скриншотах, на первом из них пример по образу Википедии.


Пример с большим количеством заголовков и подзаголовков ( Смотрите скриншот 2 )



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


Установка:


1. Если используется DLE версии ниже 13.0, то следует залить из архива папку engine/ в корень сайта. Если DLE версии 13.0 и выше, то следует загрузить плагин headers-menu.xml через Систему управления плагинами.


2. В DLE версии ниже 13.0 следует открыть engine/modules/show.full.php и найти:

$tpl->set( '{navigation}', "<!--dlenavigationcomments-->" );



Добавить выше:

include_once ENGINE_DIR . '/mods/headers_menu.php';



3. Необязательно - для использования в статических страницах, следует открыть engine/modules/static.php и найти:

$tpl->set( '{static}', $template );



Добавить выше:

include_once ENGINE_DIR . '/mods/headers_menu.php';
$menulist = HeadersMenu::init($template);
$template = $menulist . $template;



4. Необязательно - для формирования содержания статьи при Предварительном просмотре на сайте engine/preview.php и в админке engine/inc/preview.php, следует найти в этих файлах:

$tpl->set('{short-story}', stripslashes($short_story));



Добавить выше:

include_once ENGINE_DIR . '/mods/headers_menu.php';
$menulist = HeadersMenu::init($full_story);
$full_story = $menulist . $full_story;



5. В шаблоне fullstory.tpl, в нужное место добавить:

[hmenu]<div class="contents">
	<h2>Содержание:</h2>
	<ul class="h-menu">{hmenu}</ul>
</div>
<script>
$(document).on('click', 'a[href*=hmenu-]', function(e){
	e.preventDefault();
	var id = $(this).attr('href');
	var top = $(id).offset().top - 90;
	$('html,body').animate({scrollTop:top + 'px'});
})
</script>
<style>
.contents{
	background: #F8F9FA;
	border: 1px solid #A2A9B1;
	padding: 15px 20px 10px 5px;
	display: table;
	border-radius: 2px;
	margin-top: 15px;
}
.contents>h2{
	margin: 0;
	padding: 0 0 15px;
	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;
}
</style>
[/hmenu]



Все!


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


Скачать Вывод содержания статьи
Если файл не прогрузился, обновите страницу F5!
vyvod-soderzhanija-stati.zip | 0 | 5.28 Kb | 27-08-2022, 8:33
  • Версия DLE: 12.x - 13.x
  • Кодировка: utf-8
  • Категория: Модули
  • Автор: Sander
  • Источник:

собрано 3030.00 рублей Поддержать автора

Войдите на сайт


Все собранные средства будут переданы автору этой статьи - DEN
Сумма перевода от 10.00 рублей
00
63
0
27-08-2022, 08:33
Обсудить (0)
Похожие модули
Комментарии
Минимальная длина комментария - 10 знаков. комментарии модерируются
Комментариев еще нет. Вы можете стать первым!
Помощь в публикации комментариев:
1.) Если вы хотите задать вопрос, тогда просто оставьте комментарий, не нужно вопрос добавлять в ответ.
2.) Если вы хотите ответить на комментарий, для этого есть кнопка "ответить" под нужным вам вопросом.
  • bowtiesmilelaughingblushsmileyrelaxedsmirk
    heart_eyeskissing_heartkissing_closed_eyesflushedrelievedsatisfiedgrin
    winkstuck_out_tongue_winking_eyestuck_out_tongue_closed_eyesgrinningkissingstuck_out_tonguesleeping
    worriedfrowninganguishedopen_mouthgrimacingconfusedhushed
    expressionlessunamusedsweat_smilesweatdisappointed_relievedwearypensive
    disappointedconfoundedfearfulcold_sweatperseverecrysob
    joyastonishedscreamtired_faceangryragetriumph
    sleepyyummasksunglassesdizzy_faceimpsmiling_imp
    neutral_faceno_mouthinnocent
Мы ценим вашу конфиденциальность
Мы используем файлы "cookie" на нашем веб-сайте, чтобы предоставить вам наиболее релевентный результат, помня ваши предпочтения и повторные посещения.
Нажимая "Принять" вы соглашаетесь на использование всех файлов "cookie".
Принять
Не принимаю
Показать цели
X

Платные услуги новостей