> For the complete documentation index, see [llms.txt](https://docs.openspaces.design/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.openspaces.design/readme-1/pages-and-menus/product-page.md).

# Product Page

> **What You'll Learn**
>
> * The different product page layout options available in Plain Jane v3.1
> * How to switch between Product Section 2 and Product Section 3 layouts
> * Key features and customization options for each layout
> * Additional product-related sections and features

***

## 🎯 Available Product Sections

Plain Jane v3.1 offers two main product page layouts:

### **Product Section 3** (Default Layout)

A modern, flexible layout with advanced grid system, bottom modal features, and extensive customization options. This is the default section used in new Plain Jane v3.1 installations.

**Key Features:**

* Advanced grid-based image gallery
* Bottom modal interface for mobile
* Enhanced media handling (images, videos)
* Advanced variant selection
* Model information support
* Color swatches and size charts
* Mobile-optimized experience

### **Product Section 2** (Alternative Layout)

A more traditional side-by-side layout with thumbnails and classic product information display.

**Key Features:**

* Traditional thumbnail gallery
* Side-by-side image and product info layout
* Configurable image positioning
* Customizable gallery columns
* Mobile-responsive design

***

## 🔧 How to Switch Between Layouts

1. Go to **Online Store > Themes > Customize**
2. Navigate to **Products > Default product**
3. In the product template editor:
   * Remove the current product section
   * Click **Add section**
   * Choose either:
     * **Product Section 3** (recommended for modern stores)
     * **Product Section 2** (traditional layout)

***

## 📱 Additional Product-Related Sections

Plain Jane v3.1 includes several additional sections that enhance the product page experience:

* **Related Products** - Show similar or complementary products
* **Product Logo Section** - Customizable header with cart and navigation
* **Product Page Background** - Custom backgrounds for product pages
* **Product Navigation** - Enhanced navigation between products
* **Product Typography** - Custom typography settings for product pages

***

## 📚 Detailed Documentation

For complete setup instructions and customization options:

* [Product Section 3 (Default)](https://github.com/OpenSpaces-Design/theme-documentation/blob/v3/plain-jane/pages-and-menus/product-page/broken-reference/README.md) - Modern layout guide
* [Product Section 2 (Alternative)](https://github.com/OpenSpaces-Design/theme-documentation/blob/v3/plain-jane/pages-and-menus/product-page/broken-reference/README.md) - Traditional layout guide

***


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.openspaces.design/readme-1/pages-and-menus/product-page.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
