HOW TO: Custom Header/Banner & Resize Forum Width

For support and discussion related to templates, themes, and imagesets in phpBB 3.0.
Anti-Spam Guide
Locked
Bill175
Registered User
Posts: 52
Joined: Fri Oct 10, 2003 12:40 am

Re: HOW TO: Custom Header/Banner & Resize Forum Width

Post by Bill175 » Sun Nov 23, 2008 10:56 pm

Bump :( :?

There has to be somebody that setup phpbb.com, that would know how table they have the banner in they put up top is linked.

Bill175
Registered User
Posts: 52
Joined: Fri Oct 10, 2003 12:40 am

Re: HOW TO: Custom Header/Banner & Resize Forum Width

Post by Bill175 » Mon Nov 24, 2008 8:59 pm

(sigh)

Bill175
Registered User
Posts: 52
Joined: Fri Oct 10, 2003 12:40 am

Re: HOW TO: Custom Header/Banner & Resize Forum Width

Post by Bill175 » Tue Nov 25, 2008 3:16 am

Did I mention I don't like to give up?

PLEAAAAAAAASE?

missesbeehaven
Registered User
Posts: 7
Joined: Tue Nov 25, 2008 12:11 am

Re: HOW TO: Custom Header/Banner & Resize Forum Width

Post by missesbeehaven » Tue Nov 25, 2008 11:00 am

This tutorial How to is great thanks so much. I was successful in being able to change my top header image but for some reason the steps to remove the phpbb logo and site description title from the header image is not working.

I make the changes to the overall_header file and upload the changes. Then I login to the acp of the forum and refresh the style theme, back to my board index and refresh with ctrl F5 and nothing, still the same. It actualy seems that no of my changes to the overall_header file are saving.

I have the prosilver_se_1.0.1 theme installed if that helps. You can see the forum at www.missesbeehaven.com/forum

I have spent quiet a few hours researching with no luck, if anyone could offer some advice or steps that I may be missing I sure would be grateful.

Cheers
Melanie
phpbb3 with subsilver

David Sims
Registered User
Posts: 112
Joined: Fri Apr 25, 2008 12:26 am

Re: HOW TO: Custom Header/Banner & Resize Forum Width

Post by David Sims » Tue Nov 25, 2008 3:54 pm

I've replaced my top header/banner (site_logo.gif), and after refreshing, the new file is offset to the right by several pixels? The new file is 1010 pixels wide x 125 pixels high. My forum is also fixed width of 1010 pixels, and is based on a recoloured version of ProSilver.

But if you follow this link - http://www.mgs2000.co.uk - you can see that the top header/banner isn't properly aligned down the left hand and right hand edge, but offset to the right. Any thoughts?...
David
My board > http://www.mgs2000.co.uk < many thanks for all of your help & assistance!

bob175
Registered User
Posts: 13
Joined: Thu Nov 13, 2008 6:38 pm

Re: HOW TO: Custom Header/Banner & Resize Forum Width

Post by bob175 » Tue Nov 25, 2008 4:07 pm

Has phpbb dropped their support of the forum software? If Pro Silver isn't part of the software, can somebody steer me to a forum that does support it?

Does anyone else know how to make the banner image (like the one above) link to the front of the forum?

David Sims
Registered User
Posts: 112
Joined: Fri Apr 25, 2008 12:26 am

Re: HOW TO: Custom Header/Banner & Resize Forum Width

Post by David Sims » Wed Nov 26, 2008 9:36 am

David Sims wrote:I've replaced my top header/banner (site_logo.gif), and after refreshing, the new file is offset to the right by several pixels? The new file is 1010 pixels wide x 125 pixels high. My forum is also fixed width of 1010 pixels, and is based on a recoloured version of ProSilver.

But if you follow this link - http://www.mgs2000.co.uk - you can see that the top header/banner isn't properly aligned down the left hand and right hand edge, but offset to the right. Any thoughts?...
Sorted with grateful thanks to CarolinK. :D

http://www.phpbb.com/community/viewtopi ... 5#p7856945
David
My board > http://www.mgs2000.co.uk < many thanks for all of your help & assistance!

sprword
Registered User
Posts: 15
Joined: Tue Dec 09, 2008 4:49 pm

Re: HOW TO: Custom Header/Banner & Resize Forum Width

Post by sprword » Sat Dec 13, 2008 10:15 pm

I tried changing the banner of my forum by following the tutorial on the first page, but I ran into a small issue.

I was able to get the main banner to change on the top of the page, however, the first topic for every new post uses the same image as a background image instead of the default solid color.

Here's an example:
http://www.sprword.com/forum/viewforum.php?f=239

Please help! Thank you in advance!

User avatar
Greenweaver
Former Team Member
Posts: 3913
Joined: Tue Jan 10, 2006 5:25 am
Location: In the rain
Contact:

Re: HOW TO: Custom Header/Banner & Resize Forum Width

Post by Greenweaver » Sat Dec 13, 2008 10:32 pm

sprword wrote:I tried changing the banner of my forum by following the tutorial on the first page, but I ran into a small issue.

I was able to get the main banner to change on the top of the page, however, the first topic for every new post uses the same image as a background image instead of the default solid color.

Here's an example:
http://www.sprword.com/forum/viewforum.php?f=239

Please help! Thank you in advance!
You are nearly right, what you should do is rather than change the physical image "bg_header.gif" itself, you should instead change the css to point to the new image you want to use, for example:

Code: Select all

    .headerbar {
       background-color: #12A3EB;
       background-image: url("{T_THEME_PATH}/images/bg_header.gif");
       color: #FFFFFF;
    }
Change to:

Code: Select all

    .headerbar {
       background-color: #12A3EB;
       height: 129px;
       background-image: url("{T_THEME_PATH}/images/my_new_image.jpg");
       color: #FFFFFF;
    }
Notice how in this instance the new image is called "my_new_image.jpg" - of course you can call the new image whatever you like.
Image
Modage: Page Title Number MOD
Linkage: Find me at Styles Support & Discussion | Get a new style | Customise your style | phpBB userguide
Noteage:
Graphics requests to members over 20 posts and genuine phpbb requirements | I do not provide custom psd files

sprword
Registered User
Posts: 15
Joined: Tue Dec 09, 2008 4:49 pm

Re: HOW TO: Custom Header/Banner & Resize Forum Width

Post by sprword » Sun Dec 14, 2008 1:28 am

Thanks for the prompt reply!

Sorry, I forgot to tell you that I tried with different file names and still had no luck. When I change the CSS file to say "new_image.gif" instead of "bg_header.gif" - the image disappears for both!

Code: Select all

.headerbar {
	background-color: #12A3EB;
   	height: 79px;
   	background-image: url("{T_THEME_PATH}/images/new_image.gif");
   	color: #FFFFFF;
}
I also tried renaming the file to different names and the CSS file to reflect it, but it still remains blue. Take a look: http://www.sprword.com/forum/viewforum.php?f=239

I also deleted the "bg_header.gif" from the image folder, would this have anything to do with this? I am so confused...

Thanks again!

User avatar
Greenweaver
Former Team Member
Posts: 3913
Joined: Tue Jan 10, 2006 5:25 am
Location: In the rain
Contact:

Re: HOW TO: Custom Header/Banner & Resize Forum Width

Post by Greenweaver » Sun Dec 14, 2008 1:33 am

Then lets go through it together.

1) Replace the image called "bg_header.gif", if it's not there it will not display. Remember it is used in 2 locations - the header section and also the forums section - we just want to modify the header section so we need the image to still exist for the forums section.

2) Place your new image (the one you want to use for the header) inside the same folder as the "bg_header.gif image"

3) Rename the css code "new_image.gif" to the name of your new image.

Once you do this let me know how you get on.
Image
Modage: Page Title Number MOD
Linkage: Find me at Styles Support & Discussion | Get a new style | Customise your style | phpBB userguide
Noteage:
Graphics requests to members over 20 posts and genuine phpbb requirements | I do not provide custom psd files

sprword
Registered User
Posts: 15
Joined: Tue Dec 09, 2008 4:49 pm

Re: HOW TO: Custom Header/Banner & Resize Forum Width

Post by sprword » Sun Dec 14, 2008 4:05 am

This is what I did:

1) Restored the original "bg_header.gif" so that it can be used for the forum section.

2) Renamed "new_image.gif" (which is in the same folder as "bg_header.gif") to "new_header.gif".

3) Edited the common.css file so that it reflects the renaming:

Code: Select all

.headerbar {
   background-color: #12A3EB;
      height: 79px;
      background-image: url("{T_THEME_PATH}/images/new_header.gif");
      color: #FFFFFF;
}
Same results...the image does not show up as the main header. What I find most confusing is that when I rename the image that I want to use as the header to "bg_header.gif", it works, but for both of them... How does that make any sense?

Thanks again for the help, much appreciated it!

User avatar
Greenweaver
Former Team Member
Posts: 3913
Joined: Tue Jan 10, 2006 5:25 am
Location: In the rain
Contact:

Re: HOW TO: Custom Header/Banner & Resize Forum Width

Post by Greenweaver » Sun Dec 14, 2008 4:19 am

Thats good, now I need you to log into your ACP (Admin Control Panel) - from the "General" tab choose "load settings" from the left side menu (it's near the bottom) - ensure that the feature "Recompile stale style components:" is set to "yes" - submit the change.

Now choose the "Styles" tab and choose "Themes" from the left side menu - click "refresh" for the proSilver style which is what you are using. It should then start working for you.
Image
Modage: Page Title Number MOD
Linkage: Find me at Styles Support & Discussion | Get a new style | Customise your style | phpBB userguide
Noteage:
Graphics requests to members over 20 posts and genuine phpbb requirements | I do not provide custom psd files

sprword
Registered User
Posts: 15
Joined: Tue Dec 09, 2008 4:49 pm

Re: HOW TO: Custom Header/Banner & Resize Forum Width

Post by sprword » Sun Dec 14, 2008 4:51 am

I followed all the steps you provided and still have no luck. It seems like the common.css is loading "bg_header.gif" no matter how I rename the path. This is exactly what I typed:

Code: Select all

.headerbar {
	background-color: #12A3EB;
   	height: 79px;
   	background-image: url("{T_THEME_PATH}/images/new_header.gif");
   	color: #FFFFFF;
}
But instead of loading "new_header.gif", it's loading the "bg_header.gif" for some reason. I went as far as deleting the prosilver theme and reinstalling it so that I can start over again...but I still run into the same problem. Have you ever encountered anything like this? I am sooo confused. I thought this would be easy!

User avatar
topdown
Registered User
Posts: 635
Joined: Wed Sep 19, 2007 5:16 pm
Location: NE Wisconsin
Name: Jeff Behnke
Contact:

Re: HOW TO: Custom Header/Banner & Resize Forum Width

Post by topdown » Sun Dec 14, 2008 7:44 am

It may be your browser cache,
Press Ctrl + F5 keys at the same time.

Locked

Return to “[3.0.x] Styles Support & Discussion”