Auto-Scroll to Shop Products on Category Click

What You'll Create

Automatic smooth scrolling to the product list section when visitors navigate to shop categories or tags, bypassing any intro content at the top of the page.

The Problem It Solves

When your shop page has intro sections above the product grid, clicking category links brings visitors to the top of the page instead of the products. This frustrates users who want to see filtered products immediately.

Perfect For

Shops with hero sections, Filtered product displays, Category landing pages, Tag-based product sorting, Multi-category storefronts

What Makes This Different

This technique detects when a visitor arrives via a category or tag link and automatically scrolls them down to the product grid. Normal visits to your shop page behave as usual—only filtered views trigger the scroll. The animation is smooth rather than jarring, creating a polished navigation experience that respects your page design while getting customers to products faster.

Details

  • Section Type: Fluid Engine

  • Code Type: JavaScript

  • Prerequisites: Shop page with category navigation enabled

  • Toolkit Title: Scroll to the Shop Section

Learn This Technique

This is one of 150+ code techniques taught inside Standout Squarespace, where you get:

  • The complete, copy-paste code

  • Video walkthrough explaining how it works

  • The principles behind the technique so you can customize it

  • Access to our private community for support

Get Access to Standout Squarespace →
Previous
Previous

Centered Text Over Image Caption

Next
Next

Multiple Fonts in One Heading Line