# Template product

The **Main Product** section in Shopify is where you configure how a product appears on the **product detail page** (PDP). It controls everything from product title and price to images, buttons, and more.

{% hint style="success" %}

1. Go to **Online Store > Themes > Customize**
2. In the theme editor, click the **top dropdown menu**
3. Select **Products > Default Product**
4. On the **left side panel**, click on **Product Informatin**
   {% endhint %}

<figure><img src="/files/26w6Sk3hL2TA7Hr1wi6b" alt=""><figcaption></figcaption></figure>

**Settings & Customization**

<figure><img src="/files/rJahv5opwy7kaEAOuMtP" alt=""><figcaption></figcaption></figure>

**Layout**

* **Expand to Full Width:** Enable this option to extend the section across the entire screen width.
* **Color scheme:** You can customize the section’s appearance by changing the **text color, background color**, and more using **preset color** options.
* **Enable Sticky on Desktop**: Keep the product information panel visible as users scroll down the page on desktop devices for better accessibility.
* **Desktop Media Placement : Left / Right**: Choose whether the product media (images/videos) should appear on the left or right side of the screen on desktop.
* **Desktop Media Width**: Choose from **Small, Medium, or Large**
* **Thumbnail Options**: Stacked layout with Vertical or Horizontal thumbnail alignment.

**Zoom Options**

* **Inner Zoom**: Enable a zoom-on-hover effect within the image boundary for a closer look at product details.
* **Photoswipe Lightbox**: Open high-resolution product images in a lightbox overlay for enhanced viewing. Recommended for stores with detailed product visuals.
* **None**: Disable zoom functionality.

> Note: High-resolution images enhance visibility and user experience.

* **Mobile Layout**: Choose to **Hide Thumbnails** for a cleaner view or **Show Thumbnails** for easier image navigation on mobile devices.
* **Pagination Style**: Choose between **Classic** (traditional numbered pagination) or **Modern** (sleek, updated style).
* **Description Placement**: Position the product description on the **Right** or **Bottom** of the media section on desktop.

**Section padding**

* **Top Padding :** Adjust spacing above the section.
* **Bottom Padding :** Adjust spacing below the section.

**Theme Settings & Customization**

* Adjust additional styles in **Theme Settings**.
* Use **Custom CSS** for further design modifications.


---

# 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://themessupport.gitbook.io/lollipop-theme/template/template-product.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.