Dynamic, Rotating Header


Author Message
RJ

Posted: 4/17/2009
Quote message 

Please view
<a href="http://mydesignrevolution.com" style="text-decoration:underline">Design Revolution</a>


It is possible to have a dynamic, rotating header with an exported Artisteer Joomla template.

The process involves saving several header images, the use of JavaScript, and some easy modification to index.php and the template style sheet.

Should anyone be interested in the actual process, and if the admins agree, Perhaps I can post tutorial.
 
RJ

Posted: 4/17/2009
Quote message 

Web access is : http://mydesignrevolution.com
 
Luc

Posted: 4/18/2009
Quote message 

That looks like something I could use. Please post the tutorial.
 
manamedia

Posted: 4/18/2009
Quote message 

It is possible to have a rotating header image using css and php.

Go here to download the php script: http://www.alistapart.com/articles/randomizer/

In your css file, you would create something like this:

#header {

width: 900px;
height: 206px;
background-image: url('../images/rotate/rotate.php');
background-color: #48b5eb;
margin: 0 auto;
clear: both;
}


Hope that helps.
 
RJ

Posted: 4/19/2009
Quote message 

Thanks for the suggestion.

Briefly, I looked at the script, and php is fine if you want this solution--statically.

If you pull up http://firemydesogner.com, note that we're transitioning images on the same page every nine-seconds, randomly. Therefore, you'll not only have dynamic page transitions, but you'll also get a different header, chosen randomly for any page .
 
RJ

Posted: 4/20/2009
Quote message 

I detailed the "second approach".

It requires more editing, but for the adventurous, it follows the first approach.

Just scroll down the page:

http://www.firemydesigner.com/tutorial
 
Erick

Posted: 4/23/2009
Quote message 

http://www.firemydesigner.com/tips
 
RJ

Posted: 4/25/2009
Quote message 

Quote Erick:


Thanks, Eric.

The tutorial moved to the "Tips" section.

 
RJ

Posted: 4/27/2009
Quote message 

Update:

I tried a new app:
http://www.sothink.com/product/javascriptwebscroller/index.htm

Run it from your desktop. You can remove the frame and arrows. In fact, if you edit one .js file, use it beyond the three image limitation of the trial. It has a gazillion transition options.

I have it working at: http://firemydesigner.com/

Be patient; it's a 6-second fade transition.
 
RJ

Posted: 4/28/2009
Quote message 

See the post : http://www.artisteer.com/Default.aspx?post_id=102114&p=forum_post&topicsPage=5&forum_id=20

Add a 'header' module, then download Simple Image Rotator: http://www.joomlaworks.gr/.
 
Andrew

Posted: 7/4/2009
Quote message 

Is is possible to make a header image specific to certain pages, but uniform for the rest?


 
Garry

Posted: 7/4/2009
Quote message 

You need to additional page templates and assign them according to your needs.

In order to create a new page template copy all the code from your page.php, create another file(may be named 'new page") paste it in that, Add the following code to top of it:


<?php
/*
Template Name: new page
*/
?>

and this new page template will be available for you to choose on your wordpress create new page.
 
brettbum

Posted: 7/22/2009
Quote message 

You can also use the Next Gen wordpress plugin to achieve a dynamic header :)
 
GarfieldLeChat

Posted: 8/24/2009
Quote message 

Yes it totally is you can have it on refresh or on timed rotation all by js (remember for W3C comp you need to have your js files as separate linked to files not embedded in the code...
 
Garfield LeChat

Posted: 8/24/2009
Quote message 

like this site (template built in artisteer and modded to include random image presentation in the header beware tho as you can see on some of the image the site title doesn't show up on the bg image...

http://freelondonlistings.co.uk/
 
Rick

Posted: 8/31/2009
Quote message 

RJ:

Ave you looked at your templates in SeaMonkey?

http://myartisteer.com/!black-ops/

cuts off some of your design. This is a problem I am haveing also - and unfortunately, my Client uses SeaMonkey so I can't just ignore it.

Just an FYI
 
RJ

Posted: 8/31/2009
Quote message 

Yes, I did browser shots in multiple clients, and I am aware of the Sea Monkey issue. Thanks.

You can download an example rotating header with all the files and images at:
http://myartisteer.com


Quote Rick:

RJ:

Ave you looked at your templates in SeaMonkey?

http://myartisteer.com/!black-ops/

cuts off some of your design. This is a problem I am haveing also - and unfortunately, my Client uses SeaMonkey so I can't just ignore it.

Just an FYI