Website layout, help please?

malfunkshun

malfunkshun

malfunkshun

Soldato
Joined
20 Aug 2003
Posts
6,703
Location
Pembrokeshire
hello all.
OK so, its a clan website, at the moment I have built it entirely with frames. It works ok but under various conditions it is awash with scroll bars (as you would expect).
This is the site in question.

Now, can someone tell me how to get that exact look without using frames?
Also, it needs to work in a similar way, ie the nav, content and team divs need to be seperately configurable/changable so that I dont need to change a dozen pages at a time.
Any ideas? ASP? java? anything. Point me in the right direction and I will learn it myself :)

TIA
 
You need to use some form of inclusion, e.g. SSI, PHP, ASP, etc. Any server-side language should do the trick.

For example, you might have the mark-up for your navbar in its own file, say navbar.html, which might look something like this:

Code: 
<ul id="navbar">
	<li><a href="#">Item 1</a></li>
	<li><a href="#">Item 2</a></li>
	<li><a href="#">Item 3</a></li>
	<li><a href="#">Item 4</a></li>
	<li><a href="#">Item 5</a></li>
</ul>

You might then include that on your main page by way of a PHP include directive:

Code: 
<html>
	<head>
		<title>Foo</title>
	</head>
	<body>
[B]<?php include 'path/to/navbar.hmtl' ?>[/B]
		<div id="content">
			<p>Bar</p>
			<p>Baz</p>
		</div>
	</body>
</html>

Of course, in order for this to work you need PHP-enabled web hosting :)
 
Last edited:
Everything except Front Page extensions, which cost extra >:(

anyway..
So i can CSS 5 divs and php_include into them all?
 
Last edited:
Thanks for that Inquisitor :D works a treat :)

but I must point out that I quickly found that the correct syntax is
<?php include("menu.php"); ?>
must be bracketed and must end with the semi-colon...:p
 
Actually, include, include_once, require and require_once don't require brackets as they're not actually functions, rather language constructs.

Also, you don't need the semi-colon if it's just a single line of code.

;)
 
Inquisitor said:
Actually, include, include_once, require and require_once don't require brackets as they're not actually functions, rather language constructs.

Also, you don't need the semi-colon if it's just a single line of code.

;)
Click to expand...
wouldnt work without :(, nevermind, thanks for your help :D
next question is how would i make
Code: 
<ul id="navbar">
	<li><a href="#">Item 1</a></li>
	<li><a href="#">Item 2</a></li>
	<li><a href="#">Item 3</a></li>
	<li><a href="#">Item 4</a></li>
	<li><a href="#">Item 5</a></li>
</ul>
work in the same way that it did with frames?
IE, it is set up to load each html page link into the content frame.
 
Last edited:
malfunkshun said:
wouldnt work without :(, nevermind, thanks for your help :D
next question is how would i make
Code: 
<ul id="navbar">
	<li><a href="#">Item 1</a></li>
	<li><a href="#">Item 2</a></li>
	<li><a href="#">Item 3</a></li>
	<li><a href="#">Item 4</a></li>
	<li><a href="#">Item 5</a></li>
</ul>
work in the same way that it did with frames?
IE, it is set up to load each html page link into the content frame.
Click to expand...

You'd just link to the page in question for each one as you would with any normal web page, e.g.:

Code: 
<ul id="navbar">
	<li><a href="foo.php">Foo</a></li>
	<li><a href="bar.php">Bar</a></li>
	<li><a href="baz.php">Baz</a></li>
</ul>

In each page you have, you'd just put the same PHP include line in where you want that markup to be included in the page's source.

The output for foo.php might look something like:

Code: 
<html>
	<head>
		<title>Foo</title>
	</head>
	<body>
<ul id="navbar">
	<li><a href="foo.php">Foo</a></li>
	<li><a href="bar.php">Bar</a></li>
	<li><a href="baz.php">Baz</a></li>
</ul>
		<div id="content">
			<p>Bar</p>
			<p>Baz</p>
		</div>
	</body>
</html>

Basically the web server sticks the contents of the included file in the HTML and then sends it to the browser, so the browser doesn't even know anything's happened.

You might also want to factor out the leading and trailing HTML from the page into header and footer files, which can then be included in the same way:

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

<h1>Foo</h1>
<p>Some page content</p>

<?php include 'footer.php' ?>

This way you only ever have to change the markup in one place :)
 
Last edited:
I will be doing exactly this with my website. Currently converting it to PHP.

The header, all the way up to <div id="mainText"> is kept in header.php and the navigation and footer is kept in footer.php. I could have separated out the navigation but I didn't see any need to.

My content is [or rather will be] retrieved from a database.


The browser sees none of this and just displays a normal XHTML document. This means you can apply the CSS as normal.
 
You must log in or register to reply here.
Back
Top Bottom