Textpattern Drop Downs:

Here is a nice piece of code that I found on the web, tweaked unsuccessfully but was lucky enough to have Els make it work on a forum post.
It creates drop downs from a section’s articles. You can designate what sections have drop downs. It’s very handy for sites without 3 levels of navigation.

<txp:section_list exclude="" default_title='<txp:text item="home"/>'
include_default="1" wraptag="ul" break="li">
<txp:if_section name='<txp:section />'>
   <span class="arrow">&raquo;</span></txp:if_section>
   <txp:section link="1" title="1" />
   <txp:article_custom section='<txp:section />'>
      <txp:if_article_section name="sectionwithdropdowns1,etc">
         <txp:if_first_article><ul></txp:if_first_article>
         <li><txp:if_article_id>&raquo;</txp:if_article_id>
         <txp:permlink><txp:title /></txp:permlink></li>
         <txp:if_last_article></ul></txp:if_last_article>
      </txp:if_article_section>
   </txp:article_custom>
</txp:section_list> 

Here is a drop down menu that uses category lists if you require a 4th level of navigation. It requires a parent category with the same name as the section that the drop down comes under.
This is an effective way of doing 3 or 4 levels of navigation or pages in Textpattern.
This was all done by Mary

<div id="topnav">
<ul id="nav">
<txp:section_list break="li" exclude="...">
<txp:section link="1" title="1" />
<txp:php>
// sections to test for
$sections = array('sectionwithdropdowns1,sectionwithdropdowns2,etc');
global $thissection;
if (in_array($thissection['name'], $sections))
{
echo category_list(array(
		'parent'  => $thissection['name'],
		'section' => $thissection['name'],
		'wraptag' => "ul",
		'break'   => "li"
	));
	}
</txp:php>
</txp:section_list> 
</ul>
</div><!-- topnav -->

Both of the above examples list the links alphabetically but are helpful in many situations.


And some CSS for a blue menu

#nav, #nav ul { display:block;
padding: 0;
margin: 0;
list-style: none;

padding-top:2px; width:1080px; z-index:22222;
}

#nav{ border:0px solid #FF00FF;
/*height:35px;*/

}

#nav a { padding:0px 2px 0 3px; text-decoration:none; display: block;
}

#nav li { font-size:13px;
font-family:Georgia, “Times New Roman”, Times, serif;
font-weight: bold;
padding:0px 5px;
border-right:1px solid #074063;border-left:1px solid #0A7CAF;
color:#EEBF15;
float: left;
}

#nav li a, #nav li a:link, #nav li a:visited{color:#FDF6BA;} #nav li a:hover{color:#83CEED;}

#nav li ul { display:inline-block;
background-image:none;
position: absolute;
padding:0; width:16em;
left: -999em;
background-color:#248ec0;
font-size:11px;
line-height:1.1;
border:1px solid #0A7CAF;
border-top:0px;
}

#nav li ul li{display:inline-block; border-bottom:1px solid #074063; border-top:1px solid #0A7CAF; border-right:0; width:165PX;}

#nav li ul li a { display:inline-block; padding:5px 5px 5px 5px; font-size:12px; color:#003399; }

ul .section_list a, ul .section_list a:visited
{color:#003399; }

#nav li:hover ul { left: auto;
}

And the IE Fix

<!--[if lte IE 7]>
<style>

#nav, #nav ul {
padding: 0;
margin: 0;
list-style: none;
border:0 solid #000; padding-top:2px;
z-index:22222;
}

#nav, #nav ul
{
padding: 0;
margin: 0;
list-style: none;
border:0 solid #000;
padding-top:2px;
}

#nav a {
padding:0px 2px 0 3px;
text-decoration:none;
display: block;
}

#nav li { padding:1px 10px; border-right:1px solid #ccc;
float: left;
}

#nav li {
font-size:13px;
font-family:Georgia, “Times New Roman”, Times, serif;
font-weight: bold;
padding:0px 5px;
border-right:1px solid #074063;border-left:1px solid #0A7CAF;
color:#EEBF15;
float: left;
}

#nav li a, #nav li a:link, #nav li a:visited
{
color:#FDF6BA;
}

#nav li a:hover
{
color:#83CEED;
}

#nav li ul {
background-image:none;
position: absolute;
padding:0; width:16em;
left: -999em;
background-color:#248ec0;
font-size:11px;
line-height:1.1;
border:1px solid #0A7CAF;
border-top:0px;
}

#nav li ul li{ border-bottom:1px solid #ccc;
border-right:0;
width:14em;
}

#nav li ul li{ border-bottom:1px solid #074063; border-top:1px solid #0A7CAF; border-right:0; width:165PX;}

#nav li ul li a { padding:5px 5px 5px 5px; font-size:12px; color:#003399; }

#nav li:hover ul { left: auto;}

</style>
<![endif]-->

Past Entries

Use Flickr to critique your art
2010-04-01
Textpattern Drop Downs:
2009-12-23
My SEO strategy.
2009-12-08
Watercolor Painting & Illustrator
2009-09-07
Polar Bear at the Detroit Zoo
2009-07-18
Death of a Forest.
2009-04-22