Change headerbar background-image according to location

Mixed forum with code snippets, guides and styles
Forum rules
Everything in this forum is for everybody
But support only for Donators!
User avatar
Stoker
Site Admin
Site Admin
Posts: 3511
Joined: 12 May 2008, 21:26
BBCodes: 239
Favourite BBCode: Anipro
Favourite MOD: PrettyPhoto
Location: Denmark

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" -->
Board rules! No PM support
Sure, I can install the Mod for you ;)
Like the site? Then buy me a bear


User avatar
Terr0r
BBCoder V
BBCoder V
Posts: 339
Joined: 03 May 2011, 22:47
BBCodes: 100
Location: The Netherlands

Change headerbar background-image according to location

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
If you can't fix it with ducktape you ain't using enough
For my MODS and BBCodes or other things that I have made take a look here

User avatar
Stoker
Site Admin
Site Admin
Posts: 3511
Joined: 12 May 2008, 21:26
BBCodes: 239
Favourite BBCode: Anipro
Favourite MOD: PrettyPhoto
Location: Denmark

Change headerbar background-image according to location

Post by Stoker » 18 Sep 2011, 19:08

Nope. Its copyright protected by vlad studio.
Board rules! No PM support
Sure, I can install the Mod for you ;)
Like the site? Then buy me a bear

User avatar
Terr0r
BBCoder V
BBCoder V
Posts: 339
Joined: 03 May 2011, 22:47
BBCodes: 100
Location: The Netherlands

Change headerbar background-image according to location

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
If you can't fix it with ducktape you ain't using enough
For my MODS and BBCodes or other things that I have made take a look here

User avatar
Stoker
Site Admin
Site Admin
Posts: 3511
Joined: 12 May 2008, 21:26
BBCodes: 239
Favourite BBCode: Anipro
Favourite MOD: PrettyPhoto
Location: Denmark

Change headerbar background-image according to location

Post by Stoker » 18 Sep 2011, 19:43

Google vlad studio. And maske sure to Read his terms.
Board rules! No PM support
Sure, I can install the Mod for you ;)
Like the site? Then buy me a bear


Gamers Talk
BBCoder II
BBCoder II
Posts: 43
Joined: 12 Sep 2013, 22:40
BBCodes: 1

Change headerbar background-image according to location

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

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

User avatar
Stoker
Site Admin
Site Admin
Posts: 3511
Joined: 12 May 2008, 21:26
BBCodes: 239
Favourite BBCode: Anipro
Favourite MOD: PrettyPhoto
Location: Denmark

Change headerbar background-image according to location

Post by Stoker » 17 Sep 2013, 03:02

Yes, thats what its all about ;)
Board rules! No PM support
Sure, I can install the Mod for you ;)
Like the site? Then buy me a bear

User avatar
themission
BBCoder III
BBCoder III
Posts: 123
Joined: 10 Aug 2011, 20:32
BBCodes: 3
Location: Devon UK

Change headerbar background-image according to location

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.