Icy Phoenix

phpBB 3 MODS And Styles (Not Compatible With phpBB 3.1) - Changing Header Pic Mod For Black Pearl?

schemer [ Thu 04 Aug, 2011 23:02 ]
Post subject: Changing Header Pic Mod For Black Pearl?

Is there such a mod where the header pic could change with a different pic on a page refresh with Black Pearl? I have used something like that with Joomla and like it, but am not sure if it has to do more with PHPBB or the Black Pearl template.
Thanks,
schemer

p.s. To keep it simple for now, I have edited the Phoenix pic and changed it with a circular pic of my choosing but having it randomly pick from a group of pics in a folder on refresh would be cool. And even better with a square or rectangular option.

mort [ Fri 05 Aug, 2011 00:01 ]
Post subject: Re: Changing Header Pic Mod For Black Pearl?

html for the header:

Code: [Hide] [Select]

<div align="center">

<script type="text/javascript" src="{T_TPL_PATH}jscripts/switch.js"></script>

<noscript><div id="mainpic0">&nbsp;</div></noscript>

</div>

Save this as a file to YOUR-THEME/jscripts/switch.js

Code: [Hide] [Select]

<!--

images = new Array(4);

images[0] = "<div id='mainpic0'></div>";

images[1] = "<div id='mainpic1'></div>";

images[2] = "<div id='mainpic2'></div>";

images[3] = "<div id='mainpic3'></div>";

images[4] = "<div id='mainpic4'></div>";

index = Math.floor(Math.random() * images.length);

document.write(images[index]);

// -->

Add this to YOUR-THEME.css and put the images in YOUR-THEME/images/headers/image*.png - jpg - gif - And change the parameters to suit whatever your images are.

Code: [Hide] [Select]

/* Images for Header Array*/

#mainpic0 {

	background-image:url(images/headers/image0.png);

	width:853px;

	height:200px;

}

#mainpic1 {

	background-image:url(images/headers/image1.png);

	width:853px;

	height:200px;

}

#mainpic2 {

	background-image:url(images/headers/image2.png);

	width:853px;

	height:200px;

}

#mainpic3 {

	background-image:url(images/headers/image3.png);

	width:853px;

	height:200px;

}

#mainpic4 {

	background-image:url(images/headers/image4.png);

	width:853px;

	height:200px;

}

Informpro [ Fri 05 Aug, 2011 00:20 ]
Post subject: Re: Changing Header Pic Mod For Black Pearl?

Hi.

The idea is brillant, mort, but wouldn't it be simplier to change document.getElementById('header').style.backgroundImage = ? or just something like that.

mort [ Fri 05 Aug, 2011 06:59 ]
Post subject: Re: Changing Header Pic Mod For Black Pearl?

There are lots of scripts around so no matter which one chooses - there are always alternative ways of doing things.

Btw: The script paths and vars above is for Icy Phoenix - so he/she is going to have to modify it anyway.

schemer [ Fri 05 Aug, 2011 15:04 ]
Post subject: Re: Changing Header Pic Mod For Black Pearl?

mort wrote: [View Post]
There are lots of scripts around so no matter which one chooses - there are always alternative ways of doing things.

Btw: The script paths and vars above is for Icy Phoenix - so he/she is going to have to modify it anyway.

Thanks a lot Mort. I will see if I can figure it out with my setup and go from there.
Cheers,
schemer

p.s. I tried for about half the day figuring this stuff out but I guess I need to learn the different paths and filenames to get a handle on this stuff.

I did the js stuff and css stuff just fine but took a long time to figure out (probably incorrectly) that the file I needed to edit for the header was named "overall_header.html" but when I ran the mods I just ended up with no pics at all.

p.s. I tried this one below as it seemed really easy to implement and keep track of but it didn't work. Anybody know why it doesn't work?

http://www.phpbb.com/kb/article/adding-a-random-header-image/

p.s.s. I got this one at the link above working finally. Stupid mistakes like using caps for the .png extension will make you chase your tail. One other glitch and I had to hunt down some "{ }" brackets and remove them. All is good now.

mort [ Sat 06 Aug, 2011 03:06 ]
Post subject: Re: Changing Header Pic Mod For Black Pearl?

Amazing what one can find when one looks around!

schemer [ Sat 06 Aug, 2011 15:00 ]
Post subject: Re: Changing Header Pic Mod For Black Pearl?

Yep

I have done a few mods but they are usually on Joomla and seem a little more user friendly, or I am still scared to go too deep into PHPBB.

I tripped on a simple mistake and although I figured it out pretty quick, it goes to show how easy it is to mess up. In the code:

Code: [Hide] [Select]

    <img src="{T_IMAGESET_PATH}/site-logo-{SITE_LOGO_RANDOM}.EXTENSION" alt="Logo" title="Logo" />

where you are supposed to change .EXTENSION to jpg, gif, png etc, it was just natural while in the editor to backspace the word EXTENSION, and replace it with capital letters for png. But I run on a Linux server and when adding pics etc on other sites I always have to rename all the pics as they come off the camera in caps. Of course this will never happen again as that is how lessons are learned.

Thanks,
schemer

Mighty Gorgon [ Wed 24 Aug, 2011 22:11 ]
Post subject: Re: [SOLVED] Changing Header Pic Mod For Black Pearl?

I have created a script for a random avatar that could also be used for random logo...

Random Avatar Generator