• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

Smooth Scroll on Agency Theme

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

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

This topic is: not resolved

Tagged: Agency Theme, Smooth Scroll

  • This topic has 5 replies, 3 voices, and was last updated 9 years, 1 month ago by Darren.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • December 29, 2013 at 8:50 pm #81961
    ben_indt
    Member

    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
    December 30, 2013 at 2:12 am #81988
    Sridhar Katakam
    Participant

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


    Genesis Tutorials | Follow me on Twitter

    January 3, 2014 at 7:01 pm #83027
    ben_indt
    Member

    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?

    January 4, 2014 at 5:13 am #83086
    Sridhar Katakam
    Participant

    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

    January 4, 2014 at 6:49 pm #83287
    ben_indt
    Member

    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

    February 5, 2014 at 6:03 am #88740
    Darren
    Member

    Hey Sridhar - will this work on parallax pro?

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The forum ‘Design Tips and Tricks’ is closed to new topics and replies.

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2023 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble