Textpattern CMS support forum
You are not logged in. Register | Login | Help
- Topics: Active | Unanswered
Site Navigation with subsections for TP newbie
Hi there,
This, I’m sure is a common problem but I haven’t been able to find an answer to it yet…
I am building my first TP site so apologies in advance.
This is a brochure site. The structure is as follows:
Home
About
Music Classes
> Sub Navigation 1
> Sub Nav 2
Children’s Parties
> Sub Navigation 1
> Sub Navigation 2
> Sub Navigation 3
Gallery
Contact
I can see how the 1st tier of the navigation maps neatly to a section in TP but I don’t know how to structure the sub navigation in the admin or how to build the ensuing left navbar using TXP.
Any help or links to existing resources would be appreciated…
Offline
#2 2008-08-30 16:02:28
- uli
- Moderator
- From: Cologne
- Registered: 2006-08-15
- Posts: 4,306
Re: Site Navigation with subsections for TP newbie
This can’t be achieved with on-board tags. For hierarchical sections there are two plugins, cnk_section_tree and adi_menu.
In bad weather I never leave home without wet_plugout, smd_where_used and adi_form_links
Offline
#3 2008-08-30 16:03:32
- charlynoa
- Member
- From: Essen/ Germany
- Registered: 2008-08-13
- Posts: 18
Re: Site Navigation with subsections for TP newbie
I haven’t tried out, yet… but those are the resources I found:
adi_menu
cnk_section_tree
oops, uli’s been faster
Last edited by charlynoa (2008-08-30 16:04:57)
Offline
Re: Site Navigation with subsections for TP newbie
There is quite a bit of material on this kind of thing in the FAQ’s and elsewhere explaining how to achieve this with and without a combination of plugins.
One way to do it, without any plugins, assuming that your sections are home (default), about, music_classes, childrens_parties, gallery and contact, is simply to write a ‘Sticky’ Article for each of the ‘1st tier’ items assigning them to the appropriate section and a ‘live’ article assigned to the appropriate section for your ‘Sub Navigation’ items. Assign a Custom Field to bear a sort value for the ‘Live’ articles so that you can have them appear in the sub menu in the order that you require.
Code the navigation bar along the following lines either in a form or in the page template:
<div id="navigo">
<ul class="nav">
<li id="first"><a href="http://yoursite">Home</a></li>
<li><a href="http://yoursite/about">About</a></li>
<li><txp:recent_articles break="li" label="Music classes" labeltag="a" section="music_classes" sortby="custom_1" sortdir="asc" wraptag="ul" /></li>
<li><txp:recent_articles break="li" label="Children's Parties" labeltag="a" section="childrens_parties" sortby="custom_1" sortdir="asc" wraptag="ul" /></li>
<li><a href="http://yoursite/gallery">Gallery</a></li>
<li><a href="http://yoursite/contact">Contact</a></li>
</ul><!-- end .nav -->
</div><!-- end #navigo -->Include the following two lines in the appropriate page template to distinguish between a call to a live and a sticky article.
<txp:article form="single" limit="1" status="Sticky" />
<txp:article form="single" limit="1" pgonly="1" status="Live" />The ‘single’ article form doesn’t have to be much more than:
<h2><txp:title /></h2>
<txp:body />This method provides nested ULs that are easy to style with CSS and there is scope for adding an ‘active’ class for contextual navigation. The ‘1st tier’ items with sub items don’t have an active link because you likely don’t have a page at http://www.yoursite.com/music_lessons, for instance, but you still need to provide a ‘sticky’ there to cope with visitors who invoke that URL, say by deleting backwards from http://www.yoursite.com/music_lessons/sub_item1.
It makes adding subsequent ‘live’ articles straightforward. Write it, assign it to the appropriate section, give it a sort value and publish. From what you say, I think that may be the kind of thing you are looking for and it’s similar to what I did here.
Last edited by joebaich (2008-08-30 17:08:13)
Offline
Re: Site Navigation with subsections for TP newbie
Thanks everybody for your help on this. I decided as it was my first textpattern site to do it the hard way – minus the plugins! I’ve learnt a little more…
I’ve made a small change to joebaich (thanks joe!) navigation which might be useful to others. I only show the subsections on the nav when present in the parent section… as opposed to the entire navigation tree.
Here is the final navigation.
<ul id=“navlist”>
<li id=“first”><a href=”<txp:link_to_home />”>Home</a></li>
<txp:if_section name=“music-classes”>
<li><a href=”<txp:site_url />music-classes”>Music Classes</a>
<ul id=“subnavlist”>
<txp:recent_articles break=“li” label=”“ section=“music-classes” sortby=“custom_1” sortdir=“asc” />
</ul>
</li>
<txp:else />
<li><a href=”<txp:site_url />music-classes”>Music Classes</a>
</li>
</txp:if_section>
<txp:if_section name=“corporate-entertainment”>
<li><a href=”<txp:site_url />corporate-entertainment”>Corporate Entertainment</a>
<ul id=“subnavlist”>
<txp:recent_articles break=“li” label=”“ section=“corporate-entertainment” sortby=“custom_1” sortdir=“asc” />
</ul>
</li>
<txp:else />
<li><a href=”<txp:site_url />corporate-entertainment”>Corporate Entertainment</a>
</li>
</txp:if_section>
<txp:if_section name=“childrens-parties”>
<li><a href=”<txp:site_url />childrens-parties”>Children’s Parties</a>
<ul id=“subnavlist”>
<txp:recent_articles break=“li” label=”“ section=“childrens-parties” sortby=“custom_1” sortdir=“asc” />
</ul>
</li>
<txp:else />
<li><a href=”<txp:site_url />childrens-parties”>Children’s Parties</a>
</li>
</txp:if_section>
<li><a href=”<txp:site_url />news”>News</a></li>
<li><a href=”<txp:site_url />gallery”>Gallery</a></li>
<li><a href=”<txp:site_url />contact”>Contact</a></li>
</ul><!— end .nav —>
Offline