1 Topic by Ka (edited by Ka 2005-03-04 21:42)

  • Ka
  • Member
  • Offline
  • Registered: 2005-03-03
  • Posts: 14

Topic: Top banner with 1.2

With PunBB 1.1.5, I used a trick to show a top banner with flexible size, like that :

CSS :

.topbkg{background-image: url(BANNER.jpg);
    background-repeat: repeat;}

MAIN.TPL :

<td><a href="index.php"><img src="TRANSPARENT.gif" border="0" alt="PunBB" title="PunBB" width="760" height="150"></a></td>
<td width="100%"> </td>

The GIF was really transparent.

I want to restore a similar design with PunBB 1.2, but I don't find the same tag "topbkg" with the new CSS style sheet.
The goal is to keep one different banner for each CSS style.

Are there any solutions for this ? Or a alternative way to the same result...

2 Reply by buzzkill (edited by buzzkill 2005-03-04 21:51)

  • From: Rochester, NY USA
  • Registered: 2005-01-05
  • Posts: 173

Re: Top banner with 1.2

Where do you want the banner image to display?  Above the menu where the title is displayed? Try applying a bg image rule to the #brdtitle ID.  Something like this

#brdtitle {
    background-image: url(../img/yourimage_file_name_here);
    background-repeat: no-repeat;
}

I did a quick test on this, and it will infact put a background image where the board title is.  BUT, the board title text will appear over the image.

you just need to play around to get the effect you are looking for.  If this is not what you are trying to do, please elaborate.  Its really not that hard to do, it just depends on where you want your banner displayed.

[edit]
BTW I added this rule to the end of Oxygen.css (the one that imports base.css, and the color scheme CSS file Oxygen_cs.css)

If you want to have this banner displayed no matter what style you choose from the admin, or user profiles, put this rule in base.css so it applies to all punBB styles.  I just put it in Oxygen.css to test it out.  GL.

3 Reply by Ka (edited by Ka 2005-03-05 14:49)

  • Ka
  • Member
  • Offline
  • Registered: 2005-03-03
  • Posts: 14

Re: Top banner with 1.2

Thanks
But in the right border, my banner is overflow.
The banner is very large, and I want to keep the right border visible when the window's browser expanse.

EDIT : I finally do what I want... I don't know why my first test has failed. So, don't worry about my first response. Thanks a lot for your help ! smile

4 Reply by Ka

  • Ka
  • Member
  • Offline
  • Registered: 2005-03-03
  • Posts: 14

Re: Top banner with 1.2

This is my final solution to show a top banner :
Example with a 1000*150 banner and Oxygen.CSS.

CSS :

#brdtitle {
    height: 150px; 
    background-image: url(BANNER.jpg);
    background-repeat: no-repeat;
}

To make clickable banner, edit MAIN.TPL and MAINTENANCE.TPL
Delete : 

<pun_title>
<pun_desc>

And add :

<div id="brdtitle" onclick="location.href='index.php';" style="cursor: pointer;" class="inbox">
</div>

It's a simple way !