# 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: 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:

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

The question should be specific, self-contained, and written in natural language.
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.