CSS for each page? [Archive] - Dynamic Drive Forums

RD_Gringa

11-17-2006, 09:59 AM

I don't know all the technical terms for what I want to ask . Sorry.

I am using the script on this page http://www.dynamicdrive.com/dynamicindex1/popit.htm
It took me 3 long days to finally figure out how to make it work. I really do not know all the codeing stuff. Anyhow. What I want to know is there a way to not have to upload this to each page in my site once I have done it originally? I have over 140 pages and am always adding new things and new pages as needed. Is there a way to make this so that when I do add a new page that I do not have to upload the adjusted mouse over script to each page seperately?
Like uploading the spript and being able to just have a link to that on each page so I only have to change on one page of thingy. I will not have to add to the basic menu, just the mouse over windows.
Also. I made buttons for the base link because I could not figure out how to make a text link be centered and to make it the look I wanted on the page. This is what I did. I'm not sure if I like it. It seems to load slow.http://www.colonialzone-dr.com/temp.html

So any help would be appriciated. I'm really getting tired of working on this thing.

codeexploiter

11-17-2006, 10:13 AM

Place your CSS items into another file and save that with an extension .CSS and in each of your page within your <HEAD></HEAD> section give the following

<link rel="stylesheet" href="yourcssfile.css" type="text/css">

*specify the path of the CSS file if it is not with your HTML pages
Or

If you are using any kind of HTML template then give the above line in your template once not necessary to copy the above line in your all the pages.

RD_Gringa

11-17-2006, 10:27 AM

Ok...let me see if this is correct. The Code I have in my <head></head>now (the code that it said to place there in the instructions) I take that out and take the code that I have in the body out also. I upload the entire thing to my server and call it yourcssfile.css (or whatever I call it). Then I place the code you gave me in the header a page. Then the menu will automaticly appear on every page I place that one line of code in the head of the page. Then when I have to add something I just add it to the css file and it will automaticly update every page that that little code you gave me is on?
I just want to make sure I have it correct.

RD_Gringa

11-17-2006, 10:46 AM

I make the thing on html kit. When I made it the tags head and document type are on the page. Should I remove these from the page before I upload it?

codeexploiter

11-17-2006, 10:49 AM

A typical CSS page doesn't contain any HTML tags in the way we use them in an HTML page.

The CSS only contains the styles nothing else not even <STYLE> tag that we normally use to define styles inside a page.

I think it is better if you check the basics of CSS.

BLiZZaRD

11-17-2006, 10:53 AM

Kind of, yes.

everything in your <head> that is <style="text/css"> you remove and put in a new file named whatever.css and upload that to the server (minus the <style=blah blah stuff..), then put codeex's css code in the <head> section.

Leave the <body> alone.

If you want to see a "quick" and less cluttered version of the application look at this page: Test Page (http://cleverwasteoftime.com/links.html) Now view the source code (View >> source or page source) and notice the reference to the css file:

<link rel="stylesheet" type="text/css" href="cwot.css">

I have named my CSS file "cwot" and in the head section this is the only reference to any style sheet.

in the body I have given a css class to my tables (first and second)

now if you go here (http://cleverwasteoftime.com/cwot.css) you can view the css file itself and see where (bottom) I have classified the .first and .second as well as through out I have defined all ofther page styles.

Hope that gives you a better understanding :D

<EDIT> THIS LINK (http://www.w3.org/Style/CSS/) will teach you the basics of CSS and how to apply it to a page :D </EDIT>

RD_Gringa

11-17-2006, 11:24 AM

OK. I uploaded the head stuff to my server and names it menucss.css I removed the above from the head of my site. I replaced that code with
<link rel="stylesheet" type="text/css" href="menucss.css">
Left the body code where it was. Uploaded the page. The mouse over stuff is not working. I have tried 3 different times.
What am I doing wrong?

RD_Gringa

11-17-2006, 11:24 AM

I'll read the info you sent when I have time later. I bookmarked it.

BLiZZaRD

11-17-2006, 11:33 AM

First, the javascript stuff needs to stay on the page, not in the CSS.

Second remove the <style> tags from your css, and replace all the "#" with "."

your css should look something like:

.popitmenu{
position: absolute;
background-color: FFFFDD;
border:1px solid black;
font: normal 14px Arial ;
line-height: 15px;
z-index: 100;
visibility: hidden;
}

.popitmenu a{
text-decoration: underline;
padding-left: 6px;
color: #800000;
display: block;
}

.popitmenu a:hover{ /*hover background color*/
background-color: #CCFF99;
}

Start with that then read the links provided in here for a better understanding of what is going on and what you should and shouldn't put in the css file :)

RD_Gringa

11-17-2006, 11:43 AM

I just copied and pasted the code that was on the original pop it menu page. It all works fine. Does exactly what I want it to do except I don't want to upload all everytime I add a page.
The java stuff is what will need to be changed everytime I add a new page correct?
So if I leave that on the page everytime I have to add a new page I would have to put it on the page.
So I'm not sure I understand what your telling me. If I put the java stuff on the page how will it work when I need to add something to it?
Sometimes I am a bit dense but when that light turnes on...oh baby..it all comes together.

RD_Gringa

11-17-2006, 11:45 AM

I use a stupid page builder to make my web site in case your wondering.
I only did one other codeing thing and it worked well.
The codeing stuff is all new to me.

BLiZZaRD

11-17-2006, 12:13 PM

well now you are dealing with 2 different things. Javascript and CSS

you CAN make an external javascrit file. Same as with the CSS only you name it whatever.js

So yes, if you leave it on the page, each time you add a new you would need to include that as well, and make your changes locally to that page.

If you are not going to be changing the javascript code I would suggest doing just that, and making an external .js file. It's up to you, which ever you feel more comfortable with.

Personally I would go with what works for now. Then as your pages are up, you can spend some time on the W3 Schools pages (http://w3schools.com) learning about CSS and JavaScript, then once you have a better understanding go back and make your changes.

RD_Gringa

11-17-2006, 12:27 PM

It seems that it is both java and css. I don't know. I got the script from this page
http://www.dynamicdrive.com/dynamicindex1/popit.htm
I have about 140 something pages in my site. I'm redoing my pages..cleaning them all up and I am going to add this navigation instead of the old one so people can see what is in each category easier because I ghet so many people telling me they didn't know I had half the stuff on my site. So I thought this pop it thing was good. But the only thing bad is I add new stuff to my site daily. Any often I add new pages. Just last week I added a map and some old documents, 2 more pages. When I add a new page I don't want to have to upload every page in my site over.
It just seems that there should be a way t do this because with the scroller thing I have on my page in the tope left corner I only had to put the code on one page and upload it to my server with a link. .
I just can't get this to work with this one,
I have been reading a little about the css stuff....

RD_Gringa

11-17-2006, 12:55 PM

made a mistake. I have 240 pages. There is no way I want to republish them for every addition.
I'm redoing the pages now and want to get this right so I don't have to go back and do it again.

BLiZZaRD

11-17-2006, 01:42 PM

Believe me I know. One of my sites has over 900 pages, and I add more every week. Try changing webhosts with 900+ pages and see how long it takes to go through and change all your addresses. :D

But we do it because we love it...

Anyway back to your problem.

The easiest way to do this is to make a correct CSS file, and a correct .js file. upload both to your root folder and then call them each on every page, when you want to make changes you just edit the 2 files.

Sorry I can't be more specific, I have only started learning JS myself, and I am behind the times on the CSS as well.

check the w3schools link I gave above for JS as well, I believe on the 3rd or 4th page it talks about external .js files and how to include them on a page.

I left my "learn JS" notes at home or I would explain it better myself.

RD_Gringa

11-17-2006, 01:49 PM

Thanks for the help. I have to get back to work now. I'll just do the pages like normal for now. I'll try and learn about the external thingy another time. My brain gets dead and I can't do much of anything. It's real dead right now.
So maybe after I take a little nap I'll try again to figure this out.
Thats alot of pages you have on your site. How long have you had it and how often do you work on it?
I've had mine for a year in a few days. I started the site the day I bought the name. I had no idea what I was doing. Still don't. I have so many notes and files I get lost trying to figure them out.
Bless your hearts for trying to help me out!

RD_Gringa

11-17-2006, 07:25 PM

I have been redoing my pages. Not uploading them yet. It takes forever. My mouse hand and sholder are throbbing.
I don't want to have to go through all the pages and redo them again for the external link. I have tired all I know to do to do it correct.
I even read up on stuff during the time I have to clean the full **** so I can continue with the work. I have found nothing that covers what I need.
Since I see in the code both CSS and Java I don't know what to do.
http://www.dynamicdrive.com/dynamicindex1/popit.htm
This is the code I'm using.
The page that the code is on...not for the general public yet is
http://www.colonialzone-dr.com/temp.html
Someone please help this old gal out. I hate having spent 3 days trying to get the code correct and then not using it because of the external thing. As I said before I'm new at all this stuff.

Mehok

11-20-2006, 01:13 PM

let me make it more clear for you it seems to me that you aint getting it i am the same only starting

if you put all the code between <style> and </style> tags for the css if you paste them into a notepad document and save it as cssstyle.css and in above the head you write <link rel="stylesheet" type="text/css" href="cwot.css"> in the html file and the css decloration used in html is not needed in the style sheet because the extencion .css declares that file to be a style sheet.

RD_Gringa

11-20-2006, 01:57 PM

I have done this. I have tried to upload the css and java seperate and together.
When I do upload the stuff between stlye and style it does not have the code in it that I would need to change as I add a page. So when I add the information to one page would it just be there on all the pages?
It seems to me that I would have to save that info to my server and just place a code into my page where I want the images to be and when I needed to modify anything I would just do it from that file on the server.
If I leave the image, which is the buttons I made , on my site it will also mean longer load time. If I put them on my server and link to them wouldn't it make it less load time for the site?
Ill try it again now and get back to you.

I just looked at the script again. There are for sure 2 style sections. The first is css and the second, where all the mouseover inforamtion is located, is java.