Smooth Scroll on Agency Theme

[ben_indt]

Clicking on the 'Our Work' button on the home page of the Agency Template results in a smooth scroll to the anchor half way down the page.

However, when I create a button on other pages which I would also like to smooth scroll, it just jumps instantly down the page. For example, the 'itinerary' button on this page: http://indulgencetours.com/nz/self-drive/christchurch-to-queenstown-with-milford-8-days/#itinerary

Could you please advise how to get smooth scrolling working as per the home page?

I requested assistance for this from Studiopress but was referred to this forum. They mentioned that there is relevant code in the front-page.php file, and I'm assuming its this code that they are referring to...

function agency_enqueue_scripts() {

	if ( is_active_sidebar( 'home-top' ) || is_active_sidebar( 'home-middle' ) || is_active_sidebar( 'home-bottom' ) ) {
	
		wp_enqueue_script( 'scrollTo', get_stylesheet_directory_uri() . '/js/jquery.scrollTo.min.js', array( 'jquery' ), '1.4.5-beta', true );
		wp_enqueue_script( 'localScroll', get_stylesheet_directory_uri() . '/js/jquery.localScroll.min.js', array( 'scrollTo' ), '1.2.8b', true );
		wp_enqueue_script( 'home', get_stylesheet_directory_uri() . '/js/home.js', array( 'localScroll' ), '', true );
		
	}
}

I tried copying and pasting that into my custom page template, to no avail.

• Is it correct that this is the code I should copy/paste?
• Where exactly in the custom page template should it be pasted?
• The Studiopress support person also mentioned that there is a custom file specifically for the homepage in the js folder of the theme. Is there anything I need to do with that?

Many thanks!

Ben

http://indulgencetours.com/nz

[Sridhar Katakam]

http://wordpress.org/plugins/page-scroll-to-id/

---

Genesis Tutorials | Follow me on Twitter

[ben_indt]

Many thanks for the suggestion, but I'd much rather do this without a plugin.

Since smooth scroll functionality already exists in the theme, I'd like to find out how to get the code in the right places so that it works on the pages I want it to.

Any thoughts?

[Sridhar Katakam]

Try this.

Place

add_action( 'wp_enqueue_scripts', 'ben_enqueue_scripts' );
/**
 * Enqueue Scripts
 */
function ben_enqueue_scripts() {

	wp_enqueue_script( 'scrollTo', get_stylesheet_directory_uri() . '/js/jquery.scrollTo.min.js', array( 'jquery' ), '1.4.5-beta', true );
	wp_enqueue_script( 'localScroll', get_stylesheet_directory_uri() . '/js/jquery.localScroll.min.js', array( 'scrollTo' ), '1.2.8b', true );
	wp_enqueue_script( 'home', get_stylesheet_directory_uri() . '/js/home.js', array( 'localScroll' ), '', true );

}

in your custom page template file.

Also I just published http://sridharkatakam.com/smooth-scrolling-page-links-genesis-theme/. You might want to see that.

---

Genesis Tutorials | Follow me on Twitter

[ben_indt]

Wow, what an amazing, top-quality response! I never expected a full tutorial to come of this. Many thanks Sridhar, that worked perfectly.

Cheers,

Ben

[Darren]

Hey Sridhar - will this work on parallax pro?

[Author]

Posts