zisoft.de

Page Navigation With Titles

This small plugin is an enhancement of the Joomla! navigation plugin. It replaces the previous/next navigation links by the titles of the corresponding articles.

pagenavigationtitles on github.

Plugin Parameters

• Turn on/off the left and right arrows (<,>)
• Position of the navigation bar can be set to above, below or both
• Configurable texts in front of the links

Download

	File	Notes
	pagenavigationtitles.zip	Version 1.4, 2012/03/17, Joomla! 2.5, 1.7, 1.6
	pagenavigationtitles_15.zip	Version 1.3, 2011/03/03, Joomla! 1.5

HTML Markup And css Styling

The navigation's HTML markup is built in the same way as the native Joomla navigation and uses the same css classes so its styling should work right out-of-the box with your template. The pretexts in front of the links can be styled separately. The following markup and css classes are used:

Joomla 1.6, 1,7, 2.5

<ul class="pagenav">
  <li class="pagenav-prev">
    left-arrow 
    <span class="pagenav-prev-pretext">pre-text (prev)</span>
    <a>prev link</a>
  </li>
  <li class="pagenav-next">
    <span class="pagenav-next-pretext">pre-text (next)</span>
    <a>next link</a>
    right-arrow
  </li>
</ul>

css Example

ul.pagenav, ul.pagenav li {
  list-style: none; list-style-type:none; list-style-image: none;
  margin:0; padding:0; border: 0;
  overflow: hidden;
  width: 100%;
}
ul.pagenav {
  border-top:1px solid #606060;
  border-bottom:1px solid #606060;
}
ul.pagenav li.pagenav-prev { float: left; width:auto; }
ul.pagenav li.pagenav-next { float: right; width:auto; }

Joomla 1.5

<table align="center" class="pagenav">
  <tr>
    <th class="pagenav_prev">
      <span class="pagenav_prev_pretext">pre-text</span></th>
      <a>prev link</a>
    </th>
    <th class="pagenav_next">
      <span class="pagenav_next_pretext">pre-text</span></th>
      <a>next link</a>
    </th>
  </tr>
</table>