Smooth Scroll on Agency Theme

Community Forums Forums Design Tips and Tricks Smooth Scroll on Agency Theme

This topic is: not resolved

This topic contains 5 replies, has 3 voices, and was last updated by  Darren 5 months, 3 weeks ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #81961

    ben_indt
    Member
    Post count: 2

    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
    #81988

    Sridhar Katakam
    Participant
    Post count: 926
    #83027

    ben_indt
    Member
    Post count: 2

    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?

    #83086

    Sridhar Katakam
    Participant
    Post count: 926

    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.


    #83287

    ben_indt
    Member
    Post count: 2

    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

    #88740

    Darren
    Participant
    Post count: 14

    Hey Sridhar – will this work on parallax pro?

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.