Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Scroll to products on category change


bethol

Question

14 answers to this question

Recommended Posts

  • 0

@creedonIf I remember correctly, you, or @rwp, once addressed a similar question?

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 0
Posted (edited)

Add the following to Settings > Advanced > Code Injection > HEADER.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<script src="https://d1j8mu9lowy9zf.cloudfront.net/twcsl/0.1d5/twcsl.js"></script>

Add the following to Store Settings > Advanced > Page Header Code Injection for the store page.

<script>

  $( ( ) => {
  
    /*
    
    scroll to top of store category product grid
    
    Version       : 0.1d0
    
    SS Version    : 7.1
    
    Dependancies  : jQuery
                    
                    twcsl
                    
    By            : Thomas Creedon < http://www.tomsWeb.consulting/ >
    
    */
    
  // bail if not store category page
  
  if ( ! twcsl.storePage.hasCategory ) return;
  
  const productsListTop = $( '.products-list' )
  
    .offset ( )
    
    .top;
    
  window.scrollTo ( 0, productsListTop );
  
  } );
  
  </script>

Let us know how it goes.

Edited by creedon

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

Link to comment
  • 0
1 hour ago, bethol said:

@creedon Thank you! Unfortunatly it did not work 😞 

The code work perfectly, but there is a syntax error on your site, find position of the snippet in red box and remove the read-underline text

image.png.eb1888f2554262f7f2be39239073376e.png

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Portfolio hover Replace Link Style
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
  • 0
7 minutes ago, bethol said:

@bangank36 I removed the whole "read more" snippet with the underlined text, but it didnt change anything.

@creedon I took a look but the condition never met

twcsl.storePage.hasCategory

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Portfolio hover Replace Link Style
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
  • 0
40 minutes ago, bethol said:

@creedon @bangank36 It still refreshes to the top of the page. Maybe i´m doing something wrong?

 

 

Hang on while Creedon updates his awesome plugin

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Portfolio hover Replace Link Style
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
  • 0

I've updated my twcsl code again.

However I've discovered an issue that I'm not having on my test site. I think it has to do with the fact that you have five instances of the jQuery library being loaded. Generally only one is needed unless you have a specific need for multiple versions.

The code is not running in the order I normally expect. The scroll to top of store category product grid code is running before twcsl which is not good.

I'd be happy to go in and try to clean up that situation and it would give me an opportunity to test my code further.

You'd need to invite me as a contributor with Administrator permissions. If you're up for this let me know and I'll send my email out of band.

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

Link to comment
  • 0

I've gone in and commented out extra jQuery libraries. I also fixed a few syntax errors. An odd non printing character was causing an issue. Also a jQuery document ready was nested inside another.

My code appears to be working well. The scroll effect is happening as I would expect.

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...