Wordpress Themes - WP Forum at BFA
Click Here To DONATE! Support the theme development, get more attention and additional benefits based on your donation level. Your forum name will be highlighted.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Header configuration & styling »

Clickable rotating header image with CrossSlide fade


Build custom WP THEMES, without
coding.
Click here for THEMEFRAME

From the author of Atahualpa, the #1 most
downloaded (700,000+) theme @ wordpress.org
 
Prev Previous Post   Next Post Next
  #1  
Old Feb 14, 2011, 04:50 PM
Aubergine's Avatar
Aubergine
 
15 posts · Sep 2009
Maryville, TN
Clickable rotating header image with CrossSlide fade

Took me some time to figure this out, so thought I'd share. Seems to work with standalone or multi-site. If Rotate Header Images is selected and Fade is set to a number greater than 0, the Clickable option is lost because the entire #imagecontainer div is replaced by the CrossSlide fade script. To get it back, an href argument must be passed to the script. To do that, edit the jQuery line that appends crossSlide in ATA's js.php file. Using echo() inside the implode() function causes an error, but a variable works, so it is created in the PHP block above the jQuery code.

The modified code:

Code:
<?php if (strpos($bfa_ata['configure_header'],'%image')!== FALSE AND 
$bfa_ata['header_image_javascript'] != "0" AND $bfa_ata['crossslide_fade'] != "0") { $homeURL = get_bloginfo('url'); ?>

	jQuery('div#imagecontainer')
	.crossSlide({sleep: <?php echo $bfa_ata['header_image_javascript']; ?>,fade: <?php echo $bfa_ata['crossslide_fade']; ?>},[
	{ href: '<?php bloginfo('url') ?>', src: <?php echo implode( " },\n{ href: '$homeURL', src: ", bfa_rotating_header_images() ); ?> }
	]);

	/*  There's a comment in the js.php file here. Just leave it alone.*/
<?php } ?>
The original code:

Code:
<?php if (strpos($bfa_ata['configure_header'],'%image')!== FALSE AND 
$bfa_ata['header_image_javascript'] != "0" AND $bfa_ata['crossslide_fade'] != "0") { ?>
	jQuery('div#imagecontainer')
	.crossSlide({sleep: <?php echo $bfa_ata['header_image_javascript']; ?>,fade: <?php echo $bfa_ata['crossslide_fade']; ?>},[
		{ src: <?php echo implode( " },\n{ src: ", bfa_rotating_header_images() ); ?> }
	]);
	/* There's a comment here. */
<?php } ?>
On a standalone WordPress site, you can get by with typing the url of your blog for the href instead of using bloginfo('url') and $homeURL. Using the built-in WP variable $home_url did not work for me, but I may have used it incorrectly.

Standalone example: webbishdesigner.com
Multi-site blog: greenehamlet.com
 

Bookmarks

Tags
clickable, fade, rotating header images

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
[SOLVED] Linkable header image while using fade effects? bymclaugh Header configuration & styling 15 Jul 6, 2011 07:30 AM
Javascript fade in/out header image breaks rounded corners filofoto Header configuration & styling 1 Oct 18, 2010 04:49 AM
Header Image Opacity with Fade in/out enabled? Zabaan New Versions, & Updating 1 Oct 17, 2010 03:53 AM
How can I place a rotating/clickable slideshow (SWF etc.) in homepage header (only) ? viewdesigninc Header configuration & styling 4 Mar 31, 2010 01:53 AM


All times are GMT -6. The time now is 07:35 AM.


Powered by vBulletin® Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.