Shop Page

Browsing and filtering your product catalog

Overview

The WooNooW shop page provides:

  • Product Grid - Visual display of products
  • Search - Find products by name
  • Filters - Category and sorting options
  • Pagination - Navigate through products

Features

Product Cards

Each product displays:

  • Product image
  • Product name
  • Price (with sale price if applicable)
  • Add to Cart button
  • Wishlist button (if enabled)

Type in the search box to filter products by name. Search is instant and updates the grid as you type.

Category Filter

Filter products by category using the dropdown. Shows:

  • All Categories
  • Individual categories with product count

Sorting

Sort products by:

  • Default sorting
  • Popularity
  • Average rating
  • Latest
  • Price: Low to High
  • Price: High to Low

Customization

Grid Layout

Configure the product grid in WooNooW → Appearance:

DeviceOptions
Mobile1-2 columns
Tablet2-4 columns
Desktop2-6 columns

Product Card Style

Product cards can display:

  • Image - Product featured image
  • Title - Product name
  • Price - Current price and sale price
  • Rating - Star rating (if reviews enabled)
  • Add to Cart - Quick add button

Clicking a Product

Clicking a product card navigates to the full product page where customers can:

  • View all images
  • Select variations
  • Read description
  • Add to cart

Back to Shop

From any product page, use the breadcrumb or browser back button to return to the shop.


Performance

Lazy Loading

Product images load as they come into view, improving initial page load time.

Infinite Scroll vs Pagination

Currently uses pagination. Infinite scroll may be added in future versions.

Published on Jul 16, 1936