Hyperlinks

C

Chad

I created a page using a dynamic web template. The dwt has the title and the
links on it. I attached the dwt to all of the pages that I have links to. I
want the active link to be yellow and the rest of the links to be silver. I
cannot seem to accomplish this with the dwt. I have tried using page
properties and styles. Here is a link to my site:
https://netfiles.uiuc.edu/cabrown4/www/index.htm
Any help would be much appreciated.

Thank you
 
R

Ronx

In the DWT, change

<style fprolloverstyle>A:hover {color: #FFFF00}
</style>
<style>
<!--
-->
</style>

To

<style type="text/css">
body {background: black url('slate.gif');}
a:link {color: silver;}
a:visited {color: silver;}
a:hover {color: yellow;}
a:active {color: yellow;}
</style>


Then on each page, change the <body .....> tag to <body>

The colours in the style block can be changed to suit your pages.
 
C

Chad

This is the code for the dynamic web template after I followed your
instructions. When I uploaded the updated version to the web, the background
turned completely black instead of the slate background, and the only link
property that worked was hover. Do you have any other suggestions. Thank
you for your help.

<html>

<head>

<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<!-- #BeginEditable "doctitle" -->
<title>FUSION</title>
<!-- #EndEditable -->

<style type="text/css">
body {background: black url('slate.gif');}
a:link {color: silver;}
a:visited {color: silver;}
a:hover {color: yellow;}
a:active {color: yellow;}
</style>


<body>

<div align="center" style="padding-left: 4px; padding-right: 4px;
padding-top: 1px; padding-bottom: 8px">
<table border="0" width="950" id="table1">
<tr>
<td>
<div style="border: 4px double #FFFF00; padding-bottom: 8px">
<p align="center"><font color="#FFFF00" size="7" face="Impact">
â•—FUSIONâ•”</font></p>
<p align="center">
<font size="4"><font face="Verdana"><a target="_self"
href="index.htm">HOME</a></font>
</font><font face="Times New Roman" color="#FFFF00"
size="4">♦</font><font size="4">
</font><a href="Members.htm"><font size="4"
face="Verdana">MEMBERS</font></a><font size="4">
</font><font size="4" color="#FFFF00">
<font face="Times New Roman">♦</font></font><font size="4">
</font><a href="Officers.htm"><font size="4"
face="Verdana">OFFICERS</font></a><font size="4">
<font color="#FFFF00"> <font face="Times New Roman">♦</font></font>
</font><a href="Mission.htm"><font size="4"
face="Verdana">MISSION</font></a><font size="4">
<font color="#FFFF00"> <font face="Times New Roman">♦</font></font>
</font><a href="Events.htm"><font size="4"
face="Verdana">EVENTS</font></a><font size="4">
<font color="#FFFF00"> <font face="Times New Roman">♦</font></font>
</font><a href="Join.htm"><font size="4"
face="Verdana">JOIN</font></a></div>
</td>
</tr>
</table>
</div>

<!-- #BeginEditable "Sub%20Header" -->
<p> </p>
<!-- #EndEditable -->

</body>

</html>
 
R

Ronx

<style type="text/css">
body {background: black url(slate.gif);}
a:link {color: silver;}
a:visited {color: silver;}
a:hover {color: yellow;}
a:active {color: yellow;}
</style>

Make sure the path to the background image is correct in the DWT.
All the link colours work correctly in my tests on my system, and all
the link properties are working in your page as well. - Link is silver,
Visited is Silver, Hover is Yellow and Active will not show unless the
clicked page is opened in a new window, then Active is Yellow in the
original page.

Apart from the background image (which is not in the same folder as
index.htm) what does not work for you?
--
Ron Symonds - Microsoft MVP (FrontPage)
Reply only to group - emails will be deleted unread.
FrontPage Support: http://www.frontpagemvps.com/
http://www.rxs-enterprises.org/fp
 
R

Ronx

<grumble>
I am beginning to dislike my newsreader which has placed all the CSS on
the same line.
</grumble>
All the CSS rules should be on separate lines (though all on one line
does not make any difference.)

<style type="text/css">

body {background: black url(slate.gif);}

a:link {color: silver;}

a:visited {color: silver;}

a:hover {color: yellow;}

a:active {color: yellow;}

</style>

--
Ron Symonds - Microsoft MVP (FrontPage)
Reply only to group - emails will be deleted unread.
FrontPage Support: http://www.frontpagemvps.com/
http://www.rxs-enterprises.org/fp
 
S

Stefan B Rusynko

Not w/o a lot of custom coding

--

_____________________________________________
SBR @ ENJOY (-: [ Microsoft MVP - FrontPage ]
"Warning - Using the F1 Key will not break anything!" (-;
_____________________________________________


| Is there a way to make the active link color show without opening a new page?
|
| "Ronx" wrote:
|
| > <grumble>
| > I am beginning to dislike my newsreader which has placed all the CSS on
| > the same line.
| > </grumble>
| > All the CSS rules should be on separate lines (though all on one line
| > does not make any difference.)
| >
| > <style type="text/css">
| >
| > body {background: black url(slate.gif);}
| >
| > a:link {color: silver;}
| >
| > a:visited {color: silver;}
| >
| > a:hover {color: yellow;}
| >
| > a:active {color: yellow;}
| >
| > </style>
| >
| > --
| > Ron Symonds - Microsoft MVP (FrontPage)
| > Reply only to group - emails will be deleted unread.
| > FrontPage Support: http://www.frontpagemvps.com/
| > http://www.rxs-enterprises.org/fp
| >
| >
| >
| > | >
| > > <style type="text/css">
| > > body {background: black url(slate.gif);}
| > > a:link {color: silver;}
| > > a:visited {color: silver;}
| > > a:hover {color: yellow;}
| > > a:active {color: yellow;}
| > > </style>
| > >
| > > Make sure the path to the background image is correct in the DWT.
| > > All the link colours work correctly in my tests on my system, and all
| > > the link properties are working in your page as well. - Link is silver,
| > > Visited is Silver, Hover is Yellow and Active will not show unless the
| > > clicked page is opened in a new window, then Active is Yellow in the
| > > original page.
| > >
| > > Apart from the background image (which is not in the same folder as
| > > index.htm) what does not work for you?
| > > --
| > > Ron Symonds - Microsoft MVP (FrontPage)
| > > Reply only to group - emails will be deleted unread.
| > > FrontPage Support: http://www.frontpagemvps.com/
| > > http://www.rxs-enterprises.org/fp
| > >
| > >
| > >
| > > | > >
| > > > This is the code for the dynamic web template after I followed your
| > > > instructions. When I uploaded the updated version to the web, the background
| > > > turned completely black instead of the slate background, and the only link
| > > > property that worked was hover. Do you have any other suggestions. Thank
| > > > you for your help.
| > > >
| > > > <html>
| > > >
| > > > <head>
| > > >
| > > > <meta http-equiv="Content-Language" content="en-us">
| > > > <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
| > > > <!-- #BeginEditable "doctitle" -->
| > > > <title>FUSION</title>
| > > > <!-- #EndEditable -->
| > > >
| > > > <style type="text/css">
| > > > body {background: black url('slate.gif');}
| > > > a:link {color: silver;}
| > > > a:visited {color: silver;}
| > > > a:hover {color: yellow;}
| > > > a:active {color: yellow;}
| > > > </style>
| > > >
| > > >
| > > > <body>
| > > >
| > > > <div align="center" style="padding-left: 4px; padding-right: 4px;
| > > > padding-top: 1px; padding-bottom: 8px">
| > > > <table border="0" width="950" id="table1">
| > > > <tr>
| > > > <td>
| > > > <div style="border: 4px double #FFFF00; padding-bottom: 8px">
| > > > <p align="center"><font color="#FFFF00" size="7" face="Impact">
| > > > â•—FUSIONâ•”</font></p>
| > > > <p align="center">
| > > > <font size="4"><font face="Verdana"><a target="_self"
| > > > href="index.htm">HOME</a></font>
| > > > </font><font face="Times New Roman" color="#FFFF00"
| > > > size="4">♦</font><font size="4">
| > > > </font><a href="Members.htm"><font size="4"
| > > > face="Verdana">MEMBERS</font></a><font size="4">
| > > > </font><font size="4" color="#FFFF00">
| > > > <font face="Times New Roman">♦</font></font><font size="4">
| > > > </font><a href="Officers.htm"><font size="4"
| > > > face="Verdana">OFFICERS</font></a><font size="4">
| > > > <font color="#FFFF00"> <font face="Times New Roman">♦</font></font>
| > > > </font><a href="Mission.htm"><font size="4"
| > > > face="Verdana">MISSION</font></a><font size="4">
| > > > <font color="#FFFF00"> <font face="Times New Roman">♦</font></font>
| > > > </font><a href="Events.htm"><font size="4"
| > > > face="Verdana">EVENTS</font></a><font size="4">
| > > > <font color="#FFFF00"> <font face="Times New Roman">♦</font></font>
| > > > </font><a href="Join.htm"><font size="4"
| > > > face="Verdana">JOIN</font></a></div>
| > > > </td>
| > > > </tr>
| > > > </table>
| > > > </div>
| > > >
| > > > <!-- #BeginEditable "Sub%20Header" -->
| > > > <p> </p>
| > > > <!-- #EndEditable -->
| > > >
| > > > </body>
| > > >
| > > > </html>
| > > >
| > > > "Ronx" wrote:
| > > >
| > > > > In the DWT, change
| > > > >
| > > > > <style fprolloverstyle>A:hover {color: #FFFF00}
| > > > > </style>
| > > > > <style>
| > > > > <!--
| > > > > -->
| > > > > </style>
| > > > >
| > > > > To
| > > > >
| > > > > <style type="text/css">
| > > > > body {background: black url('slate.gif');}
| > > > > a:link {color: silver;}
| > > > > a:visited {color: silver;}
| > > > > a:hover {color: yellow;}
| > > > > a:active {color: yellow;}
| > > > > </style>
| > > > >
| > > > >
| > > > > Then on each page, change the <body .....> tag to <body>
| > > > >
| > > > > The colours in the style block can be changed to suit your pages.
| > > > > --
| > > > > Ron Symonds - Microsoft MVP (FrontPage)
| > > > > Reply only to group - emails will be deleted unread.
| > > > > FrontPage Support: http://www.frontpagemvps.com/
| > > > > http://www.rxs-enterprises.org/fp
| > > > >
| > > > >
| > > > >
| > > > > | > > > >
| > > > > > I created a page using a dynamic web template. The dwt has the title and the
| > > > > > links on it. I attached the dwt to all of the pages that I have links to. I
| > > > > > want the active link to be yellow and the rest of the links to be silver. I
| > > > > > cannot seem to accomplish this with the dwt. I have tried using page
| > > > > > properties and styles. Here is a link to my site:
| > > > > > https://netfiles.uiuc.edu/cabrown4/www/index.htm
| > > > > > Any help would be much appreciated.
| > > > > >
| > > > > > Thank you
| > > > >
| > > > >
| >
| >
 
R

Ronx

Yes, but requires some work.
Each link must be given a unique id that corresponds to the page it
links to.

In the style block, add some CSS that styles the individual id on the
page. This will be different on each page.

One way round this using CSS without JavaScript, is to give each link an
id, and add CSS to each page that uses that id.

In the DWT, set up an editable region in the <head> section surrounding
a new style block:

<!-- #BeginEditable "navstyle" -->
<style type="text/css">
#table1 a {color: yellow; /*style for the current page*/} </style>
<!-- #EndEditable -->
</head>

This MUST be placed immediately before the </head> tag, after all other
style definitions.
On each page you will need to change this (example for Members page)

#members a {color: yellow;}

Then a typical link would be:

<a href="Members.htm" id="members"><font size="4"
face="Verdana">MEMBERS</font></a>


Change #table1 on other pages to match the corresponding link id - if
you don't all the links will be yellow, so you know you missed
something.

I will not be available for 10 days or so from now - if you need more
help you might have to start a new thread (but wait a reasonable time in
for help in this thread.)
--
Ron Symonds - Microsoft MVP (FrontPage)
Reply only to group - emails will be deleted unread.
FrontPage Support: http://www.frontpagemvps.com/
http://www.rxs-enterprises.org/fp
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top