Custom page template loading issue

[ericjamesauthor]

Hi, I have a JQuery page-flip plugin. Today I read that one way to get it to work on a WordPress site is to create a custom page template , which I've done. I queued & loaded in my scripts, copied over the HTML and placed it my custom genesis_loop function and found that the plugin was working. Here it is (note: this may or may not work on your machine, as I think that depends on how quickly the page loads) http://ericjames.co.uk/maxslittlebrother/

So you can click the page corners of the book and the pages flip, but some shading is missing - no huge deal for now. However, then I removed an extraneous image (the big red 'splat' that you can see at the bottom of the page when the book is closed), and everything stopped working. I put the image back and the page started loading again.

So I guess it's some kind of loading order issue - perhaps the main page content loads in before the javascript/CSS has finished loading in - but when the 'splat' image loads too it delays everything by a few milliseconds, enough to ensure everything loads in the correct order - on my machine at least. Obviously I need to sort it, but I'm unsure of exactly what to do now.

Here's how I load my scripts (yes, my js & css should probably be moved, but I'm just focusing on getting things working first):

function template_scripts() {
	wp_deregister_script('jquery');
	wp_register_script('jquery', get_stylesheet_directory_uri() . '/my-templates/js/jquery-1.7.1.min.js', '1.7.1');
	wp_enqueue_script('jquery');
	wp_enqueue_script( 'wow', get_stylesheet_directory_uri() . '/my-templates/js/wow_book.min.js', array('jquery'), '', false );
	wp_enqueue_style( 'wowcss', get_stylesheet_directory_uri() . '/my-templates/wow_book/wow_book.css' );
}
add_action( 'wp_enqueue_scripts', 'template_scripts' );

And all of the HTML, and the JavaScript block that sets up the book are within my custom genesis loop:

remove_action( 'genesis_loop', 'genesis_do_loop' );
add_action( 'genesis_loop', 'my_custom_loop' );

I can't seem to load the book any later than after the genesis_loop fires, and I don't think I can (or should) load the scripts any earlier - you'll see that the wow_book.min.js enqueue script has a final argument of false, meaning it loads in the header, not the footer - this didn't make any difference though. Without the 'splat' image the page still failed to load properly (the images load in but the book has no shading and is not clickable.)

I'd like to understand what may be going wrong here, even if you think that a custom page template isn't the ideal way to approach this (if I should be doing this a different way feel free to tell me that too - I'm a complete novice with this kind of WordPress and Genesis stuff, so it may be easier to see if I can get this working for now!

http://ericjames.co.uk/maxslittlebrother/

[Brad Dalton]

You could load the scripts directly from the template. Not normally done that way in genesis but something you could try.

---

Tutorials for StudioPress Themes & WooCommerce.

[ericjamesauthor]

Thank you

[Author]

Posts