Some code…..

[Anonymous]

Please delete my “anonymous” post. 😳

Good Job Garibaldi, if you really want to make life a little easier learn CSS. You use CSS for formatting. Here’s some example code to get you going…..

Within the head tags of your html document add this line.

[code:1]
<link rel="stylesheet" type="text/css" href="http://www.wiscollectorcar.com/format.css"> [/code:1]

Create a new document that we are going to call format.css to be saved in your root directory. You can apply attributes to any tag within the CSS document. For example…

[code:1]
img
{
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
margin-bottom: 0px;
border: 0px;
} [/code:1]

Will make every image in html doc have a border of 0 and a margin of 0. Remember though that the formatting within the html document takes precedent over the formatting within the css document.

---

You can also apply classes (notice the period before header), for example within your format.css document add this:

[code:1]

.header
{
text-align: center;
height: 30px;
background-image: url(http://www.wiscollectorcar.com/bckgrnd_table_header.jpg);
border: 0px;
}[/code:1]

Create a image that is 30px X **px, name it bckgrnd_table_header.jpg or whatever you want just make sure to change the file name in the css doc. and save it to your root directory or wherever you wish again making sure to change the file location in the css doc if you do.

Add the following lines to your HTML doc.

[code:1]

<table>
<tr>
<td class="header">Text will align to the middle</td>
</tr>
</table>[/code:1]
You now have a heading that uses the the background image you created with text aligned to the middle.

---

To take it a little further you can apply classes to tags. Note that instead of using all the attributes top, bottom,righ and left I’m applying the margin attribute to the entire image simply by just using the plain margin attribute.

[code:1]
img.bigborder
{
margin: 0px;
border: 20px;
}[/code:1]

Now any image that has the the following code in your html doc will have a border of 20px.

[code:1]<img class="bigborder" src="your image source" alt="Always use the alt tag, search engines love them, So do people with sight handicaps">[/code:1]

You can set the color of the border by exchanging it with the following code in the css doc.

[code:1]border: 20px solid #FFFFFF;[/code:1]
Which will give you white border.

---

Now on to one of my favorites…..

[code:1] a
{
color: #FFFFFF;
text-decoration: underline;
font-weight : bold;
}

a:hover {
color: #000000;
text-decoration: underline;
font-weight : normal;
}[/code:1]

This will make any text link white, bold and underlined. It turns black normal font and underlined on a mouseover. 😉

Topic

[Garibaldi]

WOW! 😯 Thanks for all the info coalman. So is that for my website or the forum part of it? As far as the regular website I have updated it a little, I guess the biggest problem I have is that in the last revision (before /current) all my pages except home linked images to the current directory, when they should have been in /images/. Anyway I think I have that all resolved now, I will take a look and experiment with some of that code though!
BTW I looked around phpbb a little for that patch for the .12 version, and after I download it where do I insert the character?

[Anonymous]

It’s for any html document. If you look in your phpbb folder/templates/subsilver/overall_header.tpl .This is the the main document that generates the top portion of all pages served up for your forum.

You’ll see the CSS code is right in the document. There’s directions for making external like I have done above. You do that after you have made any changes to the formatting in the php CP though.

You can put the css code right in any document but if you put it in an exteranl document it save bandwidth. Not very important for you but if you have a site like videohelp it can add up to quite a bit.

[Garibaldi]

Quote:

It’s for any html document. If you look in your phpbb folder/templates/subsilver/overall_header.tpl .This is the the main document that generates the top portion of all pages served up for your forum.

You’ll see the CSS code is right in the document. There’s directions for making external like I have done above. You do that after you have made any changes to the formatting in the php CP though.

You can put the css code right in any document but if you put it in an exteranl document it save bandwidth. Not very important for you but if you have a site like videohelp it can add up to quite a bit.

I’ll take a look at that overall_header and see what I want to modify in it. I would like to change the phpbb logo in the top left corner to a car picture… Also would it be possible (not for this forum but just for reference) to remove the register button so no more users can register?

[Anonymous]

you can just overwrite the current logo by uploading a image named logo_phpBB.gif to forum/templates/subsilver/images/ I think that’s the correct path, you may want to look. If not it’s similar.

[Garibaldi]

Quote:

you can just overwrite the current logo by uploading a image named logo_phpBB.gif to forum/templates/subsilver/images/ I think that’s the correct path, you may want to look. If not it’s similar.

Alright I’ll give that a try.

What about the user registration thing?

[Anonymous]

Anything can be modified by modifying the .tpl files. Just make sure you backup the current ones before changing anything. Back them up before installing mods too.

[Garibaldi]

There I got it, I had the size off a little at first but now it looks pretty good.

[Author]

Replies