# 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

***
