Navigation links

[Bridget]

Hi Folks

Having spent the best part of today sorting out the navigation of the site using info from the AUG and other posts on the community (some of which I almost understood) I now have a fuctioning homepage with the links I want. However, before I try to replicate my changes on the other pages I have two (probably minor) issues to sort.

Firstly, the links I have made up show up in blue/purple whereas the NETQUOTEVAR links are black. How do I change them all to black please?

Secondly, because I have typed in a space and then the divider (eg. FAQ |) when the link is used the underlining goes under the space as well as the letters. I just think this looks a bit naff. How can I sort this out?

Finally, in the hope of saving myself another day or more of research, can some kind person please point me in the direction of instructions to add a link at the bottom of a page to get straight back up to the top, and another to add small text links at the bottom of the page the same as the ones I have made for the top.

I know from many hours reading the community pages that I need to sort things out so that I have one product on a page (more than a few days work there but I am making new sections properly first - eg. coasters). If anyone has any constructive comments they would be gratefully received, although please could you bear in mind that I am an insolvency practitioner not a web designer, know next to nothing about html, have spent the last 9 months working on this site and have absolutely no idea what free time or a good nights sleep are anymore!

Cheers.

Bridget
www.militaryfigures.co.uk

[jont]

To stop the vertical space being part of the link and to convert them to black you need to use something like the following:

<a class="BlackLink" href="[link]">FAQ</a> |

note that the spacer "|" is outside of the closing </a> tag

in the actinic.css add the following:

.BlackLink a {
color: #000000;
text-decoration: none;
}

.BlackLink a:hover {
text-decoration: underline;
}

in essence the first part makes all anchors (hyperlinks) with the class of "BlackLink) to be black in colour with no underline. The second part tell all links in the hover state with a class of "BlackLink" to have an underline

[jont]

To link to the top of the page from the bottom and to add links in to the bottom of tha page you will need to edit the Act_Primary.html and Act_BrochurePrimary.html templates as follows.....

Linking to top of page.

You first need to create a named link at the top of the page .. this can be anywhere at the top eg next to the top banner. Add the following

<a name="0"></a>

At the bottom of the page to link back to the to the top add in

<a href="#0">top of page</a>

The links at the bottom of the page as per the top can just be a straight forward copy and paste of the exisiting code at the top. This is a little be pointless IMHO and most sites use the area to link to main pages / sections on the site for Search Engine Optimisation reasons eg: home | site map | main section 1 | main section 2 | main section 3 etc.

You can set this up in the bottom of the above primaries as follows:

<a class="BlackLink" href="[LINK]">home</a> | <a href ....... etc ....>

note the use of the same class to create the black links.

if you wanted to make these smaller you can create a slightly modified version of the class eg:

.BlackLinkSmall a {
font-size: 8px;
color: #000000;
text-decoration: none;
}

HTH

[Bridget]

Thanks Jont

Have sorted the separators but having trouble with the colour. It's late so will try again in the morning!

Bridget
www.militaryfigures.co.uk

[jont]

Glad you got the seperator sorted. With the colour note the following common mistakes:

1. "color" NOT "colour" .. the internet is American so American-English

2. there is a "dot" in front of the style class in actinic.css eg: ".BlackLink"

HTH

[Bridget]

Sorry Jonty, still not getting it.

My code looks like this:
<a class="BlackLink" href="CUSTOMVAR:CGI_BIN_URLssCUSTOMVAR:SCRIPTID.pl?SECTIONID=Information%2dpages%2ehtml&NOLOGIN=1"><b>Info pages</a> |</b>

(it appears all on one line)

I have cut and paste your code for the css file so as not to get it wrong. Is where it appears in the file critical? I have put it in above the other similar commands.

Where am I going wrong?

Thanks for your help - much appreciated.

Bridget
www.militaryfigures.co.uk

[jont]

Hi,

you need to close the tags properly first ... the <b> tag is not properly nested.

Remove the <b> and </b> from the above and use the following CSS instead in the actinic.css

a.BlackLink {
color: #000000;
text-decoration: none;
font-weight: bold;
}

a.BlackLink:hover {
text-decoration: underline;
}

[jont]

That is a very complex way to create the link - why the use of CUSTOMVAR's?

[Bridget]

Hi Jont

Still not getting the colour. There is code under the part I am putting in which has a colour of 660066 which is the offending colour. If I change these to 000000 and then preview they change back to 660066.

I used the custom variables because I read this in another thread, although I can't find it again right now. Rest assured I didn't work it out for myself!

Bridget

[jont]

There is something else along the cascade affecting the code.

Check in Act_NavigationItem.html for any class there.

For my own sites I wrapped my navigation inside of a <div id="n"> container and styled it that way eg:

#BlackLink a {
color: #000000;
text-decoration: none;
font-weight: bold;
}

#BlackLink a:hover {
text-decoration: underline;
}

and doing away with the class="x" in the link html

The "id" takes greater importance over the "class" and inline styling so does away with any Actinic styling. Specificity is a pain with some of the Actinic templates so an "id" will thereby overrule

[Bridget]

Not much in Act_NavigationItem.html

Just this:

<!-- NavigationItem HTML begin -->
<!-- This file is used to build the navigation item markup. -->
NETQUOTEVAR:TEMPLATEBEGINXML
<B><A HREF="NETQUOTEVAR:NAVLINK" TARGET="NETQUOTEVAR:NAVTARGET" class="actxxsmall" NETQUOTEVAR:MOUSEOVERCALL><span class="actxxsmall">NETQUOTEVAR:NAVTEXT</span></A>&nbsp;|&nbsp;</B>
NETQUOTEVAR:TEMPLATEENDXML
<!--not used NETQUOTEVAR:NAVTEXT NETQUOTEVAR:NAVIMAGE-->
<!-- This file is used to build the navigation item markup. -->
<!-- NavigationItem HTML end -->

Is there anything in here to cause the problem?

Bridget

[cdicken]

The offending commands here are

<B><A HREF="NETQUOTEVAR:NAVLINK" TARGET="NETQUOTEVAR:NAVTARGET" class="actxxsmall" NETQUOTEVAR:MOUSEOVERCALL><span class="actxxsmall">NETQUOTEVAR:NAVTEXT</span></A>&nbsp;|&nbsp;</B>

Try removing the two instances of class="actxxsmall" from the template.

[jont]

Try removing the two instances of class="actxxsmall" from the template.

Bridgit - wrapping everything into a named <div id="n"> as outlined above will over ride any inline css or class="n" statements due to the higher specificity

[Bridget]

Sorry Guys but still not getting there.

I have removed both of the class="actxxsmall" references from Act_NavigationItem.html but it made no difference that I could see.

I don't understand what you mean by wrapping your navigation inside of a <div id="n"> container so haven't been able to try anything with that.

Have upgraded to Business and bought cover since asking the original question. Should I be using the cover support to get some help with this? Can't believe how frustrating it is just trying to get something to look black instead of purple! It has certainly put me off doing any serious customisation.

Bridget
www.militaryfigures.co.uk

[Bridget]

Seem to have cracked it with:
<td align="right"><div id="Blacklink">NETQUOTEVAR:NAVBHOME NETQUOTEVAR:NAVBSITEMAP NETQUOTEVAR:NAVBSEARCH <a href="CUSTOMVAR:CGI_BIN_URLssCUSTOMVAR:SCRIPTID.pl?SECTIONID=Information%2dpages%2ehtml&NOLOGIN=1">Info pages</a><b> |</b>NETQUOTEVAR:NAVBINFO NETQUOTEVAR:NAVBMAIL <a href="CUSTOMVAR:CGI_BIN_URLssCUSTOMVAR:SCRIPTID.pl?SECTIONID=FAQ%2ehtml&NOLOGIN=1">FAQ</a><b> |</b>NETQUOTEVAR:NAVBCART NETQUOTEVAR:NAVBCHECKOUT <a href="CUSTOMVAR:CGI_BIN_URLssCUSTOMVAR:SCRIPTID.pl?SECTIONID=Debra%2dRaymond%2dMilitary%2dFigures%2dand%2dGifts%2dLinks%2ehtml&NOLOGIN=1">Links</a><b> |</b></td>

Is this OK? Should I be restoring the parts I took out of Act_NavigationItem? Is it safe to copy this to the main brochure pages etc now? Could anything I have done be causing the problem I am having not being able to see the fragments on the Info Pages section? (Put forum query out on that last night but no joy yet).

Thanks for your help.

Bridget
www.militaryfigures.co.uk