This hack allows you to automatically generate the content of the article based on the headline tags used in the article.
Examples made in the image of Wikipedia.
Automatic creation of article content for DLE
Or here is an example with a lot of headings and subheadings:
Automatic creation of article content for DLE
HTML example
<ul class="h-menu">
<li id="hmenu-item-1"><a href="#hmenu-1"><span>1</span> History</a></li>
<li id="hmenu-item-2"><a href="#hmenu-2"><span>2</span> Differences in the description of the template concept</a></li>
<li id="hmenu-item-3"><a href="#hmenu-3"><span>3</span> Purpose</a></li>
<li id="hmenu-item-4">
<a href="#hmenu-4"><span>4</span> Concept</a>
<ul>
<li id="hmenu-item-5"><a href="#hmenu-5"><span>4.1</span> Model</a></li>
<li id="hmenu-item-6"><a href="#hmenu-6"><span>4.2</span> Representation</a></li>
<li id="hmenu-item-7"><a href="#hmenu-7"><span>4.3</span> Controller</a></li>
<li id="hmenu-item-8"><a href="#hmenu-8"><span>4.4</span> Functionality and discrepancies</a></li>
</ul>
</li>
<li id="hmenu-item-9"><a href="#hmenu-9"><span>5</span> Conditionally mandatory modifications</a></li>
<li id="hmenu-item-10"><a href="#hmenu-10"><span>6</span> The most common errors</a></li>
</ul>
The generated html code, if necessary, in principle, can be easily changed in the module file itself.
Attention: You should carefully monitor the hierarchy of tags used. For example, if the H3 tag is the first, and H2 is below, then it and everything below will not be displayed.
Installation:
Download the file headers_menu.php and unpack it to the engine/mods folder
headers_menu.zip [1.53 Kb] (downloads: 90)
MD5: e11307c64670e192a2c182f61422920e
Open File engine/modules/show.full.php
Find a line:
$tpl->set( '{navigation}', "<!--dlenavigationcomments-->" );
After it insert:
///////////////////////////////////////////////////////////////////////
include_once ENGINE_DIR . '/mods/headers_menu.php';
///////////////////////////////////////////////////////////////////////
In the fullstory.tpl template, use the code:
[hmenu]<div class="contents">
<h2>Content:</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]
Pay attention to the JS code. You can use it to indent from the top if a floating top menu is used. Well, a small scrolling animation. Also, the JS code can and should even be placed in a separate JS file connected to the template.
Information
Visitors who are in the group
Guests they can't download files.
Log in to the site under your
login and password or if you are a new user go through the process
registrations on the website.
Spain
Portugal
