cancel
Showing results for 
Search instead for 
Did you mean: 

underline for links

Not applicable

Re: underline for links

Shutter,
I've managed to grab five minutes to have a look into the CSS thing, and try to figure a way to explain it as an easy intro.
If you're not bothered about it, tell me to sod off, but if you fancy a little tinker this will hopefully be helpful (and saves typing the <u> tags in each time you want to link to a site from yours)
Search your system for Coffee.CSS (I don't have JAlbum on my work box, so don't know where it installs the skin to)
Open up Coffee.CSS - it should open in a notepad/text editor, an look something like this:
body {
font-family: ${fontFamily};
font-size: ${fontSize}px;
color: #E6D4BA;
background-color: #442C25;
margin: 0px;
padding: 0px;
}
<ja:if test=${customScrollbars}>
html {
scrollbar-face-color:#8E6638;
scrollbar-highlight-color:#442C25;
scrollbar-3dlight-color:#442C25;
scrollbar-darkshadow-color:#442C25;
scrollbar-shadow-color:#442C25;
scrollbar-arrow-color:#E6D4BA;
scrollbar-track-color:#442C25;
}
</ja:if>
a:link {
text-decoration: none;
color: #E6D4BA;
}
a:visited {
text-decoration: none;
color: #E6D4BA;
}
a:hover {
text-decoration: none;
color: #ffffff;
}
.current {
font-weight: bold;
background-color: #883928;
}
.cthumb {
<ja:if test=<%=chameleon.slideMountGraphic || chameleon.slideMountSimple%>>background-color: #e5cdad;</ja:if><ja:else>background-color: #c5a881;</ja:else>
border: 0px;
}
.thumb {
<ja:if test=<%=chameleon.slideMountGraphic || chameleon.slideMountSimple%>>background-color: #c5a881;</ja:if>
border: 0px;
}
.image { border: ${thumbBorderWidth}px solid ${thumbBorderColor};}
a:link .image { ${grayscaleCode} border-color: ${thumbBorderColor};}
a:visited .image { ${grayscaleCode} border-color: ${thumbBorderColor};}
a:hover .image { <ja:if test=${grayscaleEffect}>filter: None; </ja:if>border-color: ${thumbBorderColorHover};}
.mthumb { border: ${mThumbBorderWidth}px solid ${thumbBorderColor};}
a:link .mthumb { ${grayscaleCode} border-color: ${thumbBorderColor};}
a:visited .mthumb { ${grayscaleCode} border-color: ${thumbBorderColor};}
a:hover .mthumb { <ja:if test=${grayscaleEffect}>filter: None; </ja:if>border-color: ${thumbBorderColorHover};}
.slideImage { border-width: ${imageBorderWidth}px; border: ${imageBorderWidth}px solid; border-color: ${imageBorderColor};}
a:link .slideImage { border-color: ${imageBorderColor};}
a:visited .slideImage { border-color: ${imageBorderColor};}
.title {
font-size: 120%;
font-weight: bold;
color: #884444;
}
.title a:link {
text-decoration: none;
color: #884444;
}
.title a:visited {
text-decoration: none;
color: #884444;
}
.title a:hover {
text-decoration: none;
color: #cc4444;
}
.infotable {
border: 1px solid #7E5223;
border-collapse: collapse;
}
.infotable td {
border: 1px solid #7E5223;
}
.infotable table {
border-collapse: separate;
}
.infotable table td {
border: 0px;
}
.dirname {
font-size: 100%;
font-weight: bold;
color: #aaaaaa;
}
.comment {
color: #E6D4BA;
font-weight: bold;
font-size: 100%;
}
.smalltxt {
color: #E6D4BA;
font-size: 90%;
}
.xsmalltxt {
color: #E6D4BA;
font-size: 80%;
}
.newlabel {
font-size: 70%;
font-weight: bold;
color: #eeeeee;
background-color: #CC4400;
}

Scary huh?
Not really - each paragraph defines how a different component of your site will look, but this file controls how they look on *every* page.
See the part Peter pointed out earlier?
a:link {
text-decoration: none;
  color: #E6D4BA;
}

Change the word "none" to "underlined" (without quotes) and every link will be underlined once you upload the modified CSS.
Perhaps you would like the links to be a different colour once people have clicked on them to visit a site?
a:visited {
text-decoration: none;
color: #E6D4BA;
}

All you need to do is substiture the (hexadecimal) number here after the #
http://www.w3schools.com/html/html_colornames.asp has a list of examples that might be useful.

Wonder why links go white when you hover over them?
Thats this section:

a:hover {
text-decoration: none;
color: #ffffff;
}

If you wanted a different colour here, you'd change the FFFFFF to something else, the same examples apply (http://www.w3schools.com/html/html_colornames.asp)

All you would need to do then is save the Coffee.CSS file as styles.css , and use your FTP client to upload it to the /res/ folder in your webspace. (while experimenting, you might want to rename the original one in your webspace as styles_old.css before uploading the new one so it doesn't get overwritten, giving you an easy way to restore to the original by renaming it back)
Hope this helps you get a grasp of what we were talking about when we mentioned CSS - its worth having a look at them, as even if you don't want to make changes now, it could save you time in the future. (Think how much faster changing the text from none to underlined would have been than modifying each link manually for example)
shutter
Community Veteran
Posts: 22,218
Thanks: 3,777
Fixes: 65
Registered: ‎06-11-2007

Re: underline for links

James_H.      so...... be it then  Grin
actually James, Thanks very much for taking the time to explain what you were all going on about...
As you know, I am new to all this webmaking thing, and even though it has been daunting at times, when for weeks and weeks, it don`t work, what a pleasure to see it actually running now !.
The Chameleon skin seemed to suit me just down to the ground, the way it presented the photographs, and although the first three pages   HOME  ABOUT  and  CONTACT,  are probably not what the original writer of the program had in mind, I found a way of working it, so that all the site had the same look.
Your very long reply and explanations was very scary to look at, as is html, I only copied out what I knew worked.... Anything better than that is beyond me,  but I will have a go at printing the whole answer off, and use it to experiment with, in the same way as I did for the HOME pages, etc.
One thing with this way of producing my "pages", with each album being a page,  I can do changes to the albums "locally" and then there is a "preview" version before finally saving and then uploading via ftp. If it is only the html bit that has changed, then that is all I have to upload, and not the whole of the album that it refers to, So it is really easy to chop and change, and still have the "original" up and running, until I am satisfied.
I shall probably look into the colour changes part that you mentioned, as I think that is quite a useful indication to the viewer, and after some experimenting, will certainly come back here to let you all know that something has been happening.
Once again,  Much Appreciated for your time and effort....Thank You Very Much
Shutter
EDIT.... Have just printed it off, and the points you have made seem to be reasonably easy to play about with, but just had a thought....
as each of my "pages" is an "album" in it`s own right, then each album has it`s own css file....?
so I would have to re-do all album css files to do the changes of colour and hover on the navigation bar (page titles) under the logo..... am I correct?  whereas the adding or changing of links to other sites on the ABOUT page, would only need the one CSS file to be changed, and the rest would not be concerned with it as they refer only to the album it is created for?
Not applicable

Re: underline for links

Always a pleasure - hope having a play about gives you a lot of fun!
The W3Schools site is a very useful one too, as it has lots of free lessons, with steps that can easily be used for reference (like the colours ones) as well as a logical path through things if you want to find out more.
I tend to dip in and out, but I'm always fairly confident that the answer they give will be useful, easy to understand and accurate.
Have fun - ceilings to paint, and beer to drink (in that order, not simultaneously, I find that can end badly!)
shutter
Community Veteran
Posts: 22,218
Thanks: 3,777
Fixes: 65
Registered: ‎06-11-2007

Re: underline for links

hello james,
Please could you clear up the point I made in my edit?