Codegrrl.com Forums > adding sidebars?

Violinstar.NET

Dec 8 2007, 09:26 AM

Hi. How do you add sidebars using PHP?

Jamie

Dec 8 2007, 02:18 PM

You need to be a bit more specific. What exactly do you mean? The easiest answer would be a php include

CODE

<?php include('sidebar.php'); ?>

Violinstar.NET

Dec 8 2007, 03:41 PM

Well, I got this dilemma because I'm going to code my pages in PHP and the site to be skinnable.
I hope to have each page of my site to be something like this: IPB Image

but when I edit the pages, I only want to see this: IPB Image

. I know how to make my pages with headers and footers but not sidebars. Can someone teach me how to make them? I can't find tutorials on it and seriously need some help.
Can I still use PHP include to do that?

LouiseDK

Dec 8 2007, 06:20 PM

Where do you edit your files, through an administration panel online or manually on your harddrive?

Cine

Dec 8 2007, 07:44 PM

There is no such thing as a "PHP-sidebar", since they are constructed in HTML.

However, simply adding a div with your sidebar in it to your header, should accomplish what you want to do.

I recommend first creating a whole html page, and then splitting it into header, content and footer, depending on whether things come before or after.

So yes, you can still use a PHP include to do it. However, it doesn't matter much whether you put it in a separate file, or just append it to the header.

Violinstar.NET

Dec 14 2007, 05:06 AM

Hi. Is it possible to add sidebars with my site been skinned? If so, how do I do that? Can I do that with PHP includes? If so, can someone give me an example?

Jem

Dec 14 2007, 05:31 PM

Cine already answered your questions.

If you need more help you're going to need to give us more details. What's your url, what pages are you having difficulty with, what code are you using, etc.

Violinstar.NET

Dec 15 2007, 03:02 AM

QUOTE(LouiseDK @ Dec 9 2007, 02:20 AM)

Where do you edit your files, through an administration panel online or manually on your harddrive?

Manually on my harddrive.

QUOTE(Jem @ Dec 15 2007, 01:31 AM)

Cine already answered your questions.

If you need more help you're going to need to give us more details. What's your url, what pages are you having difficulty with, what code are you using, etc.

My url is http://www.violinstar.net. The pages I'm having difficulty would be http://www.violinstar.net/indexx.php, http://www.violinstar.net/test.php and http://www.violinstar.net/blog.php, which is like every page of my site.

ilona_

Dec 15 2007, 03:03 AM

QUOTE(Violinstar.NET @ Dec 14 2007, 12:06 PM)

Hi. Is it possible to add sidebars with my site been skinned? If so, how do I do that? Can I do that with PHP includes? If so, can someone give me an example?

Cine, has answered your question previously. Sidebars are constructed from HTML. Just like any other part of your page. Also, I think you might find this helpful.

Violinstar.NET

Dec 16 2007, 03:01 PM

QUOTE(ilona_ @ Dec 15 2007, 11:03 AM)

QUOTE(Violinstar.NET @ Dec 14 2007, 12:06 PM)

Hi. Is it possible to add sidebars with my site been skinned? If so, how do I do that? Can I do that with PHP includes? If so, can someone give me an example?

Cine, has answered your question previously. Sidebars are constructed from HTML. Just like any other part of your page. Also, I think you might find this helpful.

Oh okay. I went to see the tutorial but don't really get how I should code this page: http://www.violinstar.net/indexx.php.

ilona_

Dec 17 2007, 02:51 PM

Sorry, the link you posted led to a 404 page.. =/

Violinstar.NET

Dec 19 2007, 03:14 AM

QUOTE(ilona_ @ Dec 17 2007, 10:51 PM)

Sorry, the link you posted led to a 404 page.. =/

Oops. Sorry. It's http://www.violinstar.net/personal.php

Vixx

Dec 19 2007, 08:33 PM

Can I be honest? Without fully understanding HTML and structure, it's going to difficult to skin your site successfully. I really would visit Jem's tut first.

Violinstar.NET

Dec 20 2007, 06:25 AM

QUOTE(Vixx @ Dec 20 2007, 04:33 AM)

Can I be honest? Without fully understanding HTML and structure, it's going to difficult to skin your site successfully. I really would visit Jem's tut first.

Well, I'm not a web designer but I'm trying my best to skin it. I reallyhope I can succeed. Where's jem's tutorial?

Jem

Dec 20 2007, 12:24 PM

Clean up your code:
http://www.tutorialtastic.co.uk/tutorial/v...ebpage_to_html4

Remove any internal styling:
http://www.tutorialtastic.co.uk/tutorial/s...le_from_content

Then convert to CSS based layouts:
http://www.tutorialtastic.co.uk/tutorial/c...ableless_layout

THEN you can skin your website:
http://www.tutorialtastic.co.uk/tutorial/s...ng_your_website

Violinstar.NET

Dec 20 2007, 01:32 PM

QUOTE(Jem @ Dec 20 2007, 08:24 PM)

Clean up your code:
http://www.tutorialtastic.co.uk/tutorial/v...ebpage_to_html4

Remove any internal styling:
http://www.tutorialtastic.co.uk/tutorial/s...le_from_content

Then convert to CSS based layouts:
http://www.tutorialtastic.co.uk/tutorial/c...ableless_layout

THEN you can skin your website:
http://www.tutorialtastic.co.uk/tutorial/s...ng_your_website

There are a lot of header.php files that need to be created. I think I got mixed up with the codes and ended up with more problems. EG: http://violinstar.net/blog.php

EDIT: Okay. I got the hang of it but I still don't know how to shift the content nearer to the sidebar。。。
In addition, I also can't change my skins at http://violinstar.net/setskin.php.

Jem

Dec 20 2007, 04:21 PM

It's not skinning because you've put code in setskin.php at the top of the file that shouldn't be there

You also seem to have about 5 doctypes for some reason? That's not stopping the skinning from working but is not helping anything..

ilona_

Dec 21 2007, 01:00 AM

I believe the multiple doctypes and head tags are from a few headers? You only need one header file and one footer file.

Violinstar.NET

Dec 21 2007, 07:13 AM

QUOTE(Jem @ Dec 21 2007, 12:21 AM)

It's not skinning because you've put code in setskin.php at the top of the file that shouldn't be there

You also seem to have about 5 doctypes for some reason? That's not stopping the skinning from working but is not helping anything..

The code for blog.php:

CODE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<?php include('header.php'); ?>

<?PHP
include("/home/kura/public_html/cutenews/show_news.php");
?>

<?php include($footer); ?>
<body>
</body>
</html>

Which line do you mean??? What about setskin.php?

QUOTE(ilona_ @ Dec 21 2007, 09:00 AM)

I believe the multiple doctypes and head tags are from a few headers? You only need one header file and one footer file.

Erm. There's 1 header.php file in the root directory. 1 header.php in skins/1/ and 1 header.php in skins/2/. I followed the tutorial organisation...

Jem

Dec 21 2007, 08:15 AM

OK, what's in the main header.php, and what's in setskin.php?

Violinstar.NET

Dec 21 2007, 12:47 PM

QUOTE(Jem @ Dec 21 2007, 04:15 PM)

OK, what's in the main header.php, and what's in setskin.php?

For setskin.php:

CODE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<?php
if (isset($_GET['skin']) && is_numeric($_GET['skin']) && is_dir('/home/kura/public_html/skins/' . $_GET['skin'])) {
   setcookie("myskin", $_GET['skin'], time()+(31*86400));
   header("Location: setskin.php");
}
include('header.php');

if (isset($_COOKIE['myskin'])) {
   echo "<p>Your skin is currently set to ".(int)$_COOKIE['myskin']."</p>";
} else {
   echo "<p>There is no skin currently set.</p>";
}
?>

<p>
<a href="setskin.php?skin=1">Change to skin 1?</a>
<a href="setskin.php?skin=2">Change to skin 2?</a>
</p>

<?php include($footer); ?>
<body>
</body>
</html>

For header.php (the one in the root directory):

CODE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<?php
$pathtoskins = "/home/kura/public_html/skins/";
$defaultskin = 1;

if (isset($_COOKIE['myskin']) && file_exists($pathtoskins . $_COOKIE['myskin'] . '/header.php') && file_exists($pathtoskins . $_COOKIE['myskin'] . '/footer.php')) {
   $header = $pathtoskins . $_COOKIE['myskin'] . "/header.php";
   $footer = $pathtoskins . $_COOKIE['myskin'] . "/footer.php";
   $styles = "/skins/" . $_COOKIE['myskin'] . "/stylesheet.css";
} else {
   $header = $pathtoskins . $defaultskin . "/header.php";
   $footer = $pathtoskins . $defaultskin . "/footer.php";
   $styles = "/skins/" . $defaultskin . "/stylesheet.css";
}
include($header);
?><body>
</body>
</html>

The footer.php file in skins/1/:

CODE

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><head>
<link href="style1.css" rel="stylesheet" type="text/css" />
</head>

<hr />

<div class="container">
<h1 align="left" class="menu">Credits</h1>
</div>
</body></html>

Violinstar.NET

Dec 24 2007, 12:14 PM

Now my sidebar (http://www.violinstar.net/personal.php) look a bit weird and the headers for my skins disappear...

Jem

Dec 26 2007, 01:04 PM

1) You have code in setskin.php that shouldn't be there, as I predicted - remove:

CODE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>

2) header.php also contains the same code you put in setskin.php, but that shouldn't be there - this sort of code should only be in the skin headers, so remove:

CODE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>

and

CODE

3) This shouldn't be in footer.php, remove this too:

CODE

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><head>
<link href="style1.css" rel="stylesheet" type="text/css" />
</head>

Violinstar.NET

Dec 27 2007, 05:01 AM

Okay. All removed. But the header image still disappeared...

Jem

Dec 27 2007, 02:17 PM

Make sure you're linking to the header image in the right place.. bear in mind that the skin headers are in folders, so you'll need to change the path to the image to compensate.

Violinstar.NET

Dec 28 2007, 03:49 AM

QUOTE(Jem @ Dec 27 2007, 10:17 PM)

Make sure you're linking to the header image in the right place.. bear in mind that the skin headers are in folders, so you'll need to change the path to the image to compensate.

Okay. The header image is working now. Thanks. Is there a way to move the footer below the content?

Violinstar.NET

Dec 28 2007, 07:06 AM

QUOTE(Violinstar.NET @ Dec 28 2007, 11:49 AM)

QUOTE(Jem @ Dec 27 2007, 10:17 PM)

Make sure you're linking to the header image in the right place.. bear in mind that the skin headers are in folders, so you'll need to change the path to the image to compensate.

Okay. The header image is working now. Thanks. Is there a way to move the footer below the content?

Okay. I decided to remove the footer. So the problem of footer below the content is now solved. May I know how do I edit my links colour? I added

CODE

a.three:link {color: #FFFFFF}
a.three:visited {color: #00000}
a.three:hover {background: #FFFFFF}

unto my stylesheet.css in skins/1/ but the links aren't changing colour. What can I do to change the colour of the links?

Jem

Dec 28 2007, 03:45 PM

Remove the .three, unless you plan on giving all links a class of three.. so your link styling would be:

CODE

a:link {color: #FFFFFF}
a:visited {color: #00000}
a:hover {background: #FFFFFF}

Although by giving link hovers a value of #fff, which is the same as the link text, you'll make your links invisible on hover.

Violinstar.NET

Dec 29 2007, 02:11 PM

QUOTE(Jem @ Dec 28 2007, 11:45 PM)

Remove the .three, unless you plan on giving all links a class of three.. so your link styling would be:

CODE

a:link {color: #FFFFFF}
a:visited {color: #00000}
a:hover {background: #FFFFFF}

Although by giving link hovers a value of #fff, which is the same as the link text, you'll make your links invisible on hover.

okay. I copy your code and change my stylesheet but it still don't work. Is it my browser or the coding?

Jem

Dec 29 2007, 08:26 PM

What's the link now?

Violinstar.NET

Dec 30 2007, 03:05 AM

QUOTE(Jem @ Dec 30 2007, 04:26 AM)

What's the link now?

http://www.violinstar.net/personal/php. The first skin.
Oh ya. There seems to have a problem is http://www.violinstar.net/setskin.php too because the third skin is not showing. When I clicked on "Change to skin 3", it brings me to skin1 instead.

Violinstar.NET

Jan 7 2008, 07:59 AM

Erm... What kind I do to solve the problem?

Ash

Jan 8 2008, 10:53 PM

Can you post your current siteskin.php page? I'll try to help you lol.

Jem

Jan 9 2008, 02:20 PM

You're missing the footer.php from the 3rd skin folder..