MyBB Community Forums

Full Version: Making a own header [in template]
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Hello everyone,

I have some questions about creating a own header.

Some templates they have a color bar at the top of the screen like this template:

http://mods.mybb.com/uploads/previews/18...0Forum.png

(the header underneed the APART FLAME text do I mean) the red header)

Now I want to have this also on my forum but not a color but a image.
How can I do this???

Because If I use the image as logo the image dont fit in the forum correct and is to long. I have tryed everything but the resolution is not good.

So Now I want to have de image as header in the template and want to have my site name as logo so the logo don't go's out of the forum.

So how can I creat a header like the forum in the link with a image.


I hope someone can help me and knows wat I mean (sorry for my bad English Angel)


thanks!!
If you want to have an image as background, just add this to "#logo" in your global.css.
[ACP -> Templates & Style -> Themes -> Your theme -> global.css -> Advanced mode]

#logo
{
  background: url(images/your_background_image.png) top left repeat-x;
}

I hope I have understood you correctly and this helps Wink
hmmmm....... I have no #logo code in mij globa.css but if I add the code in the global.css nothing happend and the image don't shows up
It should be .logo rather than #logo
(2010-09-15, 07:48 PM)AJS Wrote: [ -> ]It should be .logo rather than #logo
Hm, right. But this differs from theme to theme (e.g. Apart uses #logo).

@Fallout:
To be sure, please look into the html source and search for <div id="header">.

If you found something like this, you have to use ".logo" in your global.css
<div id="header">
  <div class="logo"> ...

If you found something like this, you have to use "#logo" in your global.css
<div id="header">
  <div id="logo"> ...
the code was wrong

this is the code whats works!

Quote:#header {
background: url(images/your_background_image.png) top left repeat-x;

}