Styling Section Lists on left panel

[linzi_harry]

Hi All

I have included the top level section list on the left hand panel (great new feature)

I want to style this list in a <ul><li>section link 1 </li><ul> etc.... So that these links will match my other two hand coded links.

How do I go about doing this??

I will be forever grateful to anyone who can help, just spent the last 3 hours trying to fathom it out ( I am a bit Actinic rusty)

Thanks in Advance

Linzi

[Darren]

Hi Linzi.

I presume you are using a theme such as 'Smart'. These use java script to lay out these sections which can be edited to create lists You will need to edit the Act_Primary.html and Act_Brochure.html templates.

Please take a look at by example code, I have highlighted the bits I have changed.

<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function YahooSections(ar)
{
var strIDs = '';
for (var i=1;i<=ar.length;i++)
{
if (ar[i].sURL != null)
{
strIDs += '<a href="' + ar[i].sURL + '"><span class="actxxsmall"><b><font color="NETQUOTEVAR:FGCOLORCSS"><ul><li>' + ar[i].sName + '</li></font></b></span></a><br>';
{
if (ar[i].pChild)
{
for (var j=1;j<=ar[i].pChild.length;j++)
{
if (ar[i].pChild[j].sURL != null)
{
strIDs += '<a href="' + ar[i].pChild[j].sURL + '"><span class="actxxsmall"><font color="NETQUOTEVAR:FGCOLORCSS"><ul><li>' + ar[i].pChild[j].sName + '</li></font></span></a>';
}
}
}
}
strIDs += '</ul></ul>'
}
}
return strIDs
}
//-->
</SCRIPT>


I hope this helps.

[linzi_harry]

Can't find that script Darren

No i am using layout 4 (clean layouts) should i change, wont this now overwrite all the templates i've edited??

What would happen if a user dosn't have java installed on their machine?

Linz

[Darren]

Hi there.

I wouldn't recommend changing the theme. Layout4 uses Act_SectionLineSmallText.html to bring in the section list on the left hand side. You can edit it as follows: New bits in bold again. Don't forget to make a backup first.

<!-- SectionLine HTML begin -->
<!-- Insert HTML for the beginning of a section title -->
<!-- NETQUOTEVAR:SECTIONIMAGE NETQUOTEVAR:SECTIONTEXT -->
<A HREF="NETQUOTEVAR:SECTIONLINK"><span class="actxsmall"><ul><li>NETQUOTEVAR:SECTIONNAME</li></ul></span></A>
NETQUOTEVAR:NEXT
<!-- Insert HTML for the end of a section title -->
<!-- SectionLine HTML end -->

If I have not understood you correctly, please provide a link to your site and let me know what you mean.

[linzi_harry]

Section Lists

Hi Darren

Thanks that works, except each link is in it's own <ul></ul> when really the whole list should be wrapped in a single <ul></ul> - tried putting the ul around the following in the Primary

<div id="listcontainer"><ul id="navlist">NETQUOTEVAR:TOPLEVELSECTIONSTOP


<li><a href="#">How To Order</a></li>
<li><a href="#">Security</a></li>
</ul></div>
then did this in the SectionLineText Small

<A HREF="NETQUOTEVAR:SECTIONLINK"><li>NETQUOTEVAR:SECTIONNAME</li></A>
NETQUOTEVAR:NEXT

But that didn't work so i swapped it back to what you said - it's 90% right.

Only other thing (you're probably fed up with me!!) is that even though the <ul> is picking up my styles eg arrow for bullet point the text links are not

any ideas??

Promise that will be the end of it

Linz

[Darren]

Hi there.

Rather than using NETQUOTEVAR:TOPLEVELSECTIONSTOP, perhaps you could try page 37 of the Advanced User Guide

Hope this helps.