I have a list of sections going down the right hand side of my page. At the moment the sections names are just in text. How do I change these to be images.
-
-
Hi Sylvia
If you paste the following code within the <HEAD></HEAD> tags of your Overall Layout template, then it will insert your top-level section images in a list, one underneath the other. When a customer clicks on a section image they will be taken into that section.
<!--@act NETQUOTEVAR:TOPLEVELSECTIONS_RAW -->
<SCRIPT LANGUAGE = JavaScript>
<!--
function ImageList(pItem)
{
var strIDs = '';
{
for (var i = 1; i <= pItem.length; i++)
{
strIDs += '<a href=' + pItem[i].sURL + '><img src="' + pItem[i].sImage + '" alt="'+ pItem[i].sName + '" width=' + pItem[i].nImageWidth + ' height=' + pItem[i].nImageHeight + ' border=0></a><br>';
}
}
return strIDs
}
-->
</SCRIPT>
And then insert the following code in the main body of the page where you want the image list to appear.
<script language=Javascript1.2>
document.write(ImageList(sections))
</script>
-
James, thank you for your advise.
Will this use the image that is assigned to the section? What I really wanted (but didn't explain well) was to use buttons created by me instead of the text links. These buttons are different to the section images.
I also wanted to have the rollovers working on these buttons too.
How would I do this.Comment
-
Hi Sylvia
Im afraid I dont know how you would go about doing this...
Does anyone else on here with java script knowledge know how this could be achieved?
________
Comment
-
Just create your own custom javascript rollover buttons and then link them to the Actinic sections using the full URL (if you have not got customer accounts) or a link of the following form (if you do have customer accounts):
http://your.URL/cgi-bin/ss00000x.pl?SECTIONID=Section%5fPage%2ehtml&NOLOGIN=1
Where Section_Page.html is the filename of the section you want to link to.
Note that you have to encode any non-alphanumeric characters so an underscore '_' becomes '%5f' and a full stop '.' becomes '%2e'Comment
-
Thanks Chris
Do you mean, create my buttons, edit the template in dreamweaver and add my buttons with the appropriate linking?Comment
-
You are correct, but I have just worked out a way to do this with templates and custom properties.
First of all, create two new custom properties in 'Advanced | Custom Properties' called 'SECTIONIMAGE' and 'SECTIONIMAGE2'.
Then, supply a value for 'SECTIONIMAGE' and 'SECTIONIMAGE2' within the 'Properties' tab of your top level sections. 'SECTIONIMAGE' should be the image you want to appear as standard, 'SECTIONIMAGE2' is your rollover image. Tick 'Use as Customvar' and 'Is file name' for each of them.
Then, use the following code in your top-level section list layout template (in 'Design Options | Layouts'):
That ought to do it.Code:<!-- SectionLine HTML begin --> <!-- Insert HTML for the beginning of a section title --> <!-- NETQUOTEVAR:SECTIONIMAGE NETQUOTEVAR:SECTIONTEXT --> <A HREF="NETQUOTEVAR:SECTIONLINK"> <img src="CUSTOMVAR:SECTIONIMAGE" alt="NETQUOTEVAR:SECTIONNAME" onMouseOver="src='CUSTOMVAR:SECTIONIMAGE2' " onMouseOut="src='CUSTOMVAR:SECTIONIMAGE' " border="0"> </A> NETQUOTEVAR:NEXT <!-- Insert HTML for the end of a section title --> <!-- SectionLine HTML end -->
Comment
-
Thank you Chris - you are a star!!!!Comment
-
I've just found and used Chris's solution with customvars above.....
...this should be in the knowledge base Chris!Comment
-
-
How about in the User Guides too.... This solution worked really well for me.Comment
Comment