Express Shop Page lets shoppers pick a quantity and choose variations right on your shop and category pages, then add to the cart without opening each product. Simple products get a quantity box next to Add to cart, and variable products get their variation dropdowns where the Select options button was.
Express Shop Page works with WooCommerce’s classic product lists, the kind most classic themes such as Storefront use. Product lists built with blocks don’t show the fields (see Where the fields appear). It keeps your shop’s layout and adds no checkboxes for adding several products at once: each product keeps its own add to cart button.
When you’d use this
- Shoppers often buy more than one of a product, such as consumables or supplies.
- Your variable products have a few simple choices, like size or color, that shoppers can make from the list.
- Repeat customers know what they want and shouldn’t have to open every product page.
- You want fewer clicks between your product list and the cart.
Requirements
- WordPress 6.3 or later, WooCommerce 9.9 or later, and PHP 7.4 or later.
- Compatible with WooCommerce’s cart and checkout blocks and High-Performance Order Storage. Express Shop Page only changes your product lists.
- A theme whose shop and category pages use WooCommerce’s classic product loop, as Storefront and most classic themes do.
Install and activate
Express Shop Page is sold on kestrelwp.com:
- Download the plugin from the Licensed downloads tab of your kestrelwp.com account, then install and activate it in Plugins.
- Go to Settings » Express Shop Page for WooCommerce activation, enter the license key from your License keys tab, and click Save changes. An activated key lets the plugin receive updates. See using sites against your activation limit for how activations count.
If you’re updating from an earlier version and the activation page shows the plugin as not activated, replace any key in the field with the license key from the License keys tab of your kestrelwp.com account, and click Save changes.
For upload, FTP and update steps, follow how to install and update WooCommerce extensions.
Set up Express Shop Page
1. Save the settings
Go to WooCommerce » Settings » Products » Express shop page. On a new install, both Display on shop page boxes appear ticked, but nothing shows in your store until you save the settings once. Tick the boxes you want (see Express Shop Page settings) and click Save changes.
If you updated from an earlier version and had saved these settings before, your choices carry over.
2. Check your shop
Open your shop page in a private browser window. Simple products show a quantity box next to Add to cart. Variable products show their variation dropdowns, with a quantity box and an Add to cart button, a moment after the rest of the page loads.
3. Add a product to the cart
Choose a variation and a quantity, then click Add to cart. The product goes into the cart without leaving the page, and a View cart button appears next to it.
Where the fields appear
- Display on shop page covers your main shop page, pages that list products with WooCommerce’s
[products]shortcode, and pages built with Elementor or Divi. - Display on category pages covers your product category pages.
The fields don’t appear on:
- product tag pages or product attribute pages
- product lists built with blocks, such as Product Collection or All Products, including the shop and category templates of block themes built from them
- single product pages, which already have their own quantity box and dropdowns
On each product in a list, the fields appear below the product’s details, where most themes put the add to cart button. Express Shop Page moves them to suit the OceanWP, Astra and Flatsome themes, and restores the add to cart button that the Divi theme removes from product lists.
Express Shop Page settings
Go to WooCommerce » Settings » Products » Express shop page. Each setting has two boxes: Display on shop page (shown ticked on a new install) and Display on category pages (unticked). Nothing applies until you’ve clicked Save changes once.
Quantity field
Shows a quantity box next to Add to cart for simple products that are in stock, can be bought, and aren’t set to Sold individually. It goes from 1 up to the most a customer can buy, which is the stock quantity when you track stock without backorders. Typing a quantity and pressing Enter adds the product to the cart.
Variable products don’t use this setting: their quantity box comes with the variation dropdowns.
Variation dropdowns
Shows each variable product’s variation dropdowns, quantity box and Add to cart button in place of WooCommerce’s Select options button. The variation form uses WooCommerce’s own template, so it looks like the one on your product pages, and any default form values you set on a product are pre-selected.
All the products on a page load their dropdowns together, in one request after the rest of the page has loaded. For a product with more than 30 variations, the matching variation is looked up as the shopper chooses, the same way WooCommerce does on product pages.
Where this setting is off, variable products keep WooCommerce’s Select options button.
What customers see
- Simple products: Add to cart adds the quantity in the box. Whether the page stays put or reloads follows WooCommerce’s Enable AJAX add to cart buttons on archives setting under WooCommerce » Settings » Products.
- Variable products: Add to cart always adds the variation without leaving the page, whatever WooCommerce’s add to cart settings say, because the shopper’s choices would be lost on another page. A View cart button then appears next to it.
- If something’s missing: clicking Add to cart before choosing every option shows "Please select some product options before adding this product to your cart." Choosing a combination that doesn’t exist or can’t be bought shows "Sorry, this product is unavailable. Please choose a different combination." If WooCommerce refuses the item, for example because there isn’t enough stock, its own message is shown instead.
The quantity box and dropdowns take their look from your theme. To change it, use your theme’s options or add custom CSS.
Compatibility
- Quick View for WooCommerce: works alongside Express Shop Page, and its pop-up keeps working with variable products.
- WooCommerce Bulk Variations (Barn2): with an active license, variable products show the Bulk Variations grid instead of the dropdowns, unless the grid is turned off for that product.
- WooCommerce Product Options (Barn2): with an active license, a simple product’s option fields show above its quantity box while Variation dropdowns » Display on shop page is ticked. Express Shop Page doesn’t add option fields to variable products in the list.
- Themes and page builders: see Where the fields appear.
Common issues
Nothing appears on the shop page after installing
Go to WooCommerce » Settings » Products » Express shop page and click Save changes. The boxes show as ticked on a new install, but nothing applies until the settings are saved once.
Nothing appears on tag pages, in product blocks, or with a block theme
Express Shop Page adds its fields to WooCommerce’s classic product lists only (see Where the fields appear). To use it on a page built with blocks, list the products with the [products] shortcode in a Shortcode block instead, for example [products limit="12" columns="4"].
A product has no quantity box
The quantity box is for simple products only. It doesn’t show for products set to Sold individually, out of stock products, or products that can’t be bought, such as those with no price.
Variation dropdowns don’t appear
Work through these in order:
- Variation dropdowns is ticked for this kind of page, and you clicked Save changes.
- The page is one of the places the fields appear.
- The product has variations that are Enabled and have a price.
- The dropdowns load after the page, so a script error or an optimization plugin that delays scripts can stop them. Check the page with optimization turned off, and look for errors in your browser’s console.
Simple products reload the page or open the product page
That’s WooCommerce’s add to cart behavior for simple products. Tick Enable AJAX add to cart buttons on archives under WooCommerce » Settings » Products to add them without leaving the page.
"Please select some product options before adding this product to your cart."
The shopper clicked Add to cart before choosing an option in every dropdown. Choosing them all enables the button.
"Sorry, this product is unavailable. Please choose a different combination."
The chosen combination has no matching variation, or that variation can’t be bought (for example, it has no price or is out of stock).
"The Express Shop Page for WooCommerce license key has not been activated, so plugin is inactive!"
This notice appears in your admin until you activate your license key. Express Shop Page keeps working without it, but it can’t receive updates. Click the notice’s link, or go to Settings » Express Shop Page for WooCommerce activation, and activate your key.
Keep learning
- Express Shop Page developer reference (moving the fields, changing quantity limits and where scripts load)
- How to install and update WooCommerce extensions (installing, updating and fixing upload errors)
- Using sites against your activation limit (how license activations count)
- How to add custom CSS to your site (styling the quantity box and dropdowns)