Website Coding

Stuck on a line of code? Find resources and post your coding questions here.

Forum Sponsor (Advertise with us)
Reply
 
Thread Tools Display Modes
    #1 (permalink)  
Old 12-05-2009
dognose's Avatar
Active Member
Company name: Laserdog Productions
 
Join Date: Jan 2009
Location: Lafayette, CO
Posts: 856
Question CSS question
I have a CSS question & I hope I can phrase it in a way that makes sense.

The majority of my web pages are the same except for content - the banner/navigation/footer sections are the same on every page. Is there a way to make one HTML/CSS file for the banner/navigation/footer sections that never change & then reference different text files for the content area?

What I'm doing now is recreating the banner/navigation/footer sections on each of my pages. So when I change something in the banner/navigation/footer sections, I have to make changes to all the pages. I want to avoid all that duplication. Is there a way I can make a <div id="content"> & somehow, within that div, reference the file of my content for my various pages? Does that make sense?

I've searched the Internet, including Codehead's HTML/CSS sessions on this site, but I'm still stumped.

Thanks for any suggestions or help!

Lezly
Reply With Quote
    #2 (permalink)  
Old 12-05-2009
Business-Bytes's Avatar
Resident Member
Company name: SunRise Virtual Solutions
 
Join Date: Jun 2009
Location: Iowa
Posts: 1,043
Blog Entries: 1
Send a message via Skype™ to Business-Bytes
Default Re: CSS question
Lezly, you can't do this with HTML/CSS code, but look into php Server Side Includes (SSI). Not sure if I'm understanding what you want to do - whether banner/nav/footer or content that you want to not have to change on every page - but I have used php SSI to just insert a short snippet of code for a header/nav and/or footer (after creating a header/nav or footer .php file), but not for content because that changes a lot more often.

All I have to do for an HTML/CSS site is insert this short snippet of code:
Code:
<!--#include file="phpIncludes/footer.php" -->
(your filenames would differ - this is just an example). This "pulls in" an actual footer file that I created named footer.php. I do the same for menu/navigation - just create a .php file for the menu and "include" it with the SSI in your HTML file where you want these to show up.

I've got a headache, so I might not have explained this the best. But, is this kind of what you're talking about?
__________________
Jules, SunRise Virtual Solutions - WordPress Customization & XHTML/CSS Web Sites
Reply With Quote
    #3 (permalink)  
Old 01-18-2010
Codehead's Avatar
Administrator
Company name: Codehead LLP
My latest blog post: Mac Performance Benchmark App
 
Join Date: Apr 2007
Location: WA
Posts: 175
Default Re: CSS question
You need a hosting package that supports PHP or ASP or some sort of a server side scripting language.

So assuming your hosting package supports PHP - which most of them do these days, even the Windows-based ones, you must do something like this.

Say your pages are similar to the following - this is very simplified:

Code:
<html>
<head>
   Your style and javascript includes etc.
</head>
<body>

   <div id="header"> ... </div>
   <div id="menu"> ... </div>

   <div id="content">

        ... a lot of stuff here ...

    </div>

    <div id="footer"> ... </div>

</body>
</html>
Now, I will show you how to do what you want with this simplified code using PHP.

1 - We will need to create two PHP files, header.php and footer.php

header.php
PHP Code:
<html>
<
head>
   
Your style and javascript includes etc.
</
hea>
<
body>

   <
div id="header"> ... </div>
   <
div id="menu"> ... </div>

   <
div id="content"
footer.php
PHP Code:
   </div>

   <
div id="footer"> ... </div>

</
body>
</
html
As you can see, the header, contains all the parts in the header and footer contains all the files in the footer, these are always the same so they are going into two files header.php and footer.php.

2 - No we need to create files for the variable/changing portion of the pages, so let's create the index.php file:

index.php - This will be the front page of your site by default, just like index.html, but you must remove index.html (or index.htm)
PHP Code:
<?php include 'header.php'?>

... a lot of stuff here ...

<?php include 'footer.php'?>
Now let's create an about page:

about.php
PHP Code:
<?php include 'header.php'?>

<h1>About Us</h1>

... a lot of stuff here ...

<?php include 'footer.php'?>
And so on...

I hope this makes sense and please let me know if you have any questions...
__________________
"Imagination is more important than knowledge."
Albert Einstein
Reply With Quote
    #4 (permalink)  
Old 01-18-2010
dognose's Avatar
Active Member
Company name: Laserdog Productions
 
Join Date: Jan 2009
Location: Lafayette, CO
Posts: 856
Smile Re: CSS question
I ended up using Master Pages in ASP.Net. It works very nicely, although it did create one other minor issue that I need to resolve. I think I can work around it with some JavaScript. I may be back with a question about that.

Thank for your time & response!
Reply With Quote
    #5 (permalink)  
Old 01-19-2010
amyholding's Avatar
New Member
Company name: MarketingForVAs
www.marketingforvas.com: Overcoming ?Writers Block? ? Part 2
 
Join Date: Aug 2008
Location: Massachusetts
Posts: 8
Send a message via Yahoo to amyholding
Default Re: CSS question
Great explanation and demonstration on includes.

Amy
Reply With Quote
Reply

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off



All times are GMT -4. The time now is 11:14 AM.

International Virtual Assistants Association
Project Management for Virtual Assistants
Work from Home | Become A Virtual Assistant
Virtual Assistant Directory
Affordable WordPress Themes
Create a Professional New Client Welcome Packet
Virtual Assistant Forums Advertising

© Virtual Assistant Forums 2012
All content and images are protected under copyright law and may not be reproduced in any way without express written consent.