Chapter 3 — Product page

In this chapter: the full page for a single item — from the gallery and choosing a variant to reviews and related suggestions.

3-1. Main information

  • Image gallery — when you choose a variant (for example, a different colour), the images change too.
  • Name, product code (SKU), categories (with links) and product type.
  • Price — for a multi-variant product, it is shown as "From …" until a variant is chosen.
  • Availability/delivery indicator — the item's readiness status.
  • A short description and a full description (with formatting).

3-2. Choosing a variant and adding to the basket

  1. For a multi-variant product, choose the options (colour with a colour swatch, size with a label).
  2. Set the quantity with the +/− buttons.
  3. Add to basket — until a valid combination is selected, the button is disabled and a guidance message is shown.

3-3. Wishlist and sharing

  • Save to wishlist — requires sign-in; the list is in the customer account (Chapter 5).
  • Share — using your phone's own features or by copying the link.

3-4. Expandable detail sections

  • Product descriptions/notes
  • Details: code, categories
  • Availability: status, the selected variant, last updated

3-5. Customer reviews

  • Average rating and a chart of the star distribution; the number of verified purchases and recommendations.
  • Read other people's reviews and post a review (a new review is published after the manager approves it).

3-6. Suggestions

  • The "Related products", "Recommended for you", "Recently viewed" shelves and complementary items — based on the relationships the manager has defined in the catalogue.