06 — Product Pages & Variations

Everything about how individual product pages look and work — including color/size selectors, quick-view popups, and quantity discounts.

#Variation swatches (color/size selectors)

If a product has options like Color or Size, customers pick them using swatches instead of a plain dropdown list. Several visual styles are available:

• Color swatches — small color circles.
• Color + label — a color circle with a text label next to it.
• Image swatches — a small thumbnail per option (e.g. a photo of each color).
• Buttons / text labels — plain clickable text options.
• Dropdown — a normal dropdown list, automatically used instead of buttons when an option has a lot of choices (more than 8), to avoid an overwhelming wall of buttons.

How it decides which style to use: by default, the theme automatically picks a sensible style per attribute (for example, it recognizes when an attribute is a color and shows color swatches automatically). You can override this globally in Customize → Shop & Products → Variation Swatches, or per-product from the product's own edit screen if one specific product needs different treatment.

As soon as a customer picks a full set of options (e.g. Color + Size), the price, product image, and stock status update instantly — no page reload needed.

If every variation of a product is out of stock, the swatch selectors are hidden entirely and customers instead see a simple "Out of stock" message with a back-in-stock email signup form (see below).

#Image zoom

On the product page, hovering over the main product image shows a magnified close-up — helpful for customers to check fabric texture, stitching, or fine detail before buying.

#Quick View vs. the full product view

There are two different ways customers can preview a product without leaving the page they're browsing:

• Quick View — a lightweight popup covering the key details: image, title, price, short description, variation swatches (if applicable), quantity selector, and Add to Cart / Buy Now buttons. Triggered from a small icon on product cards.
• Product Drawer — a much fuller experience: essentially the entire product page, opened as a slide-up panel, with an option to expand into the full page if the customer wants more detail.

Both are automatic — there's nothing to configure to turn them on, though which one appears (and where) depends on the product card style in use.

#Product information tabs

Every product page includes tabbed sections for Description, Additional Information, Reviews, and (if configured) an FAQ tab — letting customers dig into detail without cluttering the main page layout.

#Quantity discounts

You can set up automatic bulk-buy discounts per product, right from the product's edit screen. Three types are available:

• Fixed price tiers — e.g. "Buy 2 for $25."
• Percentage tiers — e.g. "Buy 3+, get 15% off."
• Buy X, Get Y Free — classic BOGO-style deals.

Whichever type is configured, the discount is shown automatically on the product page and applied automatically at checkout — customers don't need a coupon code.

#Frequently bought together

You can bundle a set of products together as a suggested "frequently bought together" panel on a product's page, letting customers add the whole set to their cart in one click. This is configured per-product from a meta box on the product's edit screen — no separate plugin needed, it's built into the theme natively.

#Related and recommended products

Product pages automatically show related and recommended products, helping customers discover more of your catalog. You can adjust how many appear from Customize → Shop & Products → Single Product.

#Trust badges and delivery info

Product pages can show small trust-building elements near the Add to Cart area — icons/text like "Secure checkout" or "Easy returns" (Customize → Shop & Products → Trust Badges), and estimated delivery time messaging (Customize → Shop & Products → Delivery Info).

#Urgency and activity messaging

Product pages can also show a small row of urgency cues — real order-based messaging like "X sold in the last 24 hours" and "Only X left" based on your actual stock, plus a same-day dispatch countdown. A separate, optional live "people viewing this" counter is also available. See Marketing & Conversion Tools for the full picture, including which of these are based on real data.

#Share buttons

Product (and blog post) pages can include social share buttons, letting customers share a product link directly to platforms like Facebook, WhatsApp, or X/Twitter.

#Back-in-stock notifications

When a product (or a specific variation) is out of stock, customers can enter their email to be notified automatically the moment it's back — no plugin required, this is built in.

#Buy Now

Alongside the normal Add to Cart button, most product pages also show a Buy Now button that skips the cart entirely and takes the customer straight to checkout with just that item — useful for reducing friction on impulse purchases. You can turn this on/off from Customize → Shop & Products → Single Product.

#Attaching guides, FAQs, and policies to a product

You can link a specific Size Guide, FAQ set, Return Policy, or Care Guide to any product — see Content Library for how to create and attach these.

#Troubleshooting

• A product I featured in a block has disappeared. If the block references one specific product (like RC Single Product or an RC Hero set to a specific product) and that product was later deleted or moved to Trash, the block will simply show nothing. Edit the block and select a valid product again.
• A third-party plugin's content isn't showing on the product page (e.g. a subscriptions, deposits, or waitlist plugin). Raftaar Commerce fully rebuilds the product page for speed and design consistency, so plugins that rely on inserting themselves into WooCommerce's default product page layout may not display anything here, even though they work correctly on other pages. If you rely on a plugin like this, check compatibility with support before purchasing extra add-ons that depend on it. (Note: "frequently bought together"-style bundling doesn't need a separate plugin at all — it's built in, see above.)