Skip to content
Shop Layouts

Shop Layouts

Setting up woo layout templates, using themer to create layouts and access templates for shop landing, product category and singular product pages. Choose from one of the three available layout styles based on the kind of shop it is, the kind of product images you have, and the number of products you sell.

Simple Layout

The "Simple" shop package features a layout best suitable to sites with a minimalist approach. Works well on sites selling a handful of products with few to no categories.

Simple - Shop Page

Simple - Shop Landing

Features: Hero image, page title & description, featured products carousel (using woopack module - content set to show featured), woopack product grid (make sure module content is set to main query)

Simple - Category Page

Simple - Shop Prod Cat

Features: Hero image, category title & description, category image as hero background with overlay, woopack product grid (make sure module content is set to main query - turn off quick view)

Simple - Product Page

Simple - Single Product

Features: Product title, rating & short description in hero, product image as hero background with overlay, product details & long description, product image & gallery, upsells/linked/related products

Sidebar Layout

The "Sidebar" shop package features a clean layout with a sidebar for product search and category navigation functionality. Works well for sites with a large hierarchy of categories and products.

Sidebar - Shop Page

Sidebar - Shop Landing

Features: Hero image, page title & description, sidebar - featured items & links, woopack product grid (make sure module content is set to main query)

Sidebar - Category Page

Sidebar - Shop Prod Cat

Features: Category title, description & image, sidebar - featured items & links, woopack product grid (make sure module content is set to main query - turn off quick view)

Sidebar - Product Page

Sidebar - Single Product

Features: Product title, rating, price & short description, product image & gallery, sidebar - featured items & links, product details & long description, related products 

Wide Layout

The "Wide" shop package features a layout best suitable to sites with an interactive, product image oriented approach. Works well with detailed, high quality product images.

Wide - Shop Page

Wide - Shop Landing

Features: Hero image, page title & description, featured products carousel (using woopack module - content set to show featured), woopack product grid (content set to main query - enable category filter)

Wide - Category Page

Wide - Shop Prod Cat

Features: Hero image, category title & description, hero background set to category image with overlay, woopack product grid (content set to main query - enable category filter if there are subcategories)

Wide - Product Page

Wide - Single Product

Features: Product title, rating, price & short description, product image & gallery, product image as page background with heavy dark overlay, product details & long description, related products 

Scroll To Top