Change headerbar background-image according to location

Post by **Stoker** » 26 Jul 2011, 16:56

Change headerbar background-image according to location

Author: Stoker
Description:
This little guide will teach You how to make the headerbar back-ground image change according to the location.
It will show different back-ground images on index, viewforum and viewtopic.
This guide is optimized to the Prosilver SE style, but cut easily be adapted to all other styles.

Attached file: None
Demo: This site

Instructions:
First You need to find 3 images that You like to have as back-ground images.
Upload them to styles/name of style/theme/images

Open styles/name of style/template/overall_header.html
Find:

Code: Select all

<div class="headerbar">

Replace with:

Code: Select all

<!-- IF SCRIPT_NAME == "index" --><div class="headerbar" style="background-image: url({T_THEME_PATH}/images/name_of_image.jpg); background-position: top;">
<!-- ELSEIF SCRIPT_NAME == "viewforum" --><div class="headerbar" style="background-image: url({T_THEME_PATH}/images/name_of_image.jpg); background-position: top;">
<!-- ELSEIF SCRIPT_NAME == "viewtopic" --><div class="headerbar" style="background-image: url({T_THEME_PATH}/images/name_of_image.jpg); background-position: top;">
<!-- ELSE --><div class="headerbar"><!-- ENDIF -->

Save, upload and refresh template.
Now You will have different back-ground images on index, viewforum and viewtopic.
All other pages will have the standard back-ground images which is defined in colours.css

FAQ

Question:
How do I use the same background-image for BOTH viewtopic AND posting?
Answer:
Find this in above code:

Code: Select all

<!-- ELSEIF SCRIPT_NAME == "viewtopic" -->

Replace with

Code: Select all

<!-- ELSEIF SCRIPT_NAME == "viewtopic" or SCRIPT_NAME == "posting" -->

Post by **Terr0r** » 18 Sep 2011, 18:40

I have a question to stoker about this Snippet

can I used the images on my forum ? that you used for this snippet on this forum

Post by **Stoker** » 18 Sep 2011, 19:08

Nope. Its copyright protected by vlad studio.

Post by **Terr0r** » 18 Sep 2011, 19:15

okay and where can I find and or download the images that you used for your forum

and is it possible to set the header a little bit weider so as here

Post by **Stoker** » 18 Sep 2011, 19:43

Google vlad studio. And maske sure to Read his terms.

Post by **Gamers Talk** » 16 Sep 2013, 21:47

is it possible to add it to different pages (ex: blog/memberlist/search/contact/etc) ?

Post by **Stoker** » 17 Sep 2013, 03:02

Yes, thats what its all about

Post by **themission** » 17 Sep 2013, 19:30

There is also this mod https://www.phpbb.com/community/viewtopic.php?t=1237105 im using it on localhost with phpbb3 version 3.0.12-RC2 and no problems

Modification Description: Custom Header Logo displays logos and background images in the header. This can be changed for all forums and categories independently. You can also add a logo and background images to all pages like search, memberlist or user control panel - even in subdirectories and on pages with parameters.