> For the complete documentation index, see [llms.txt](https://moodboard-creations.gitbook.io/agnes/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://moodboard-creations.gitbook.io/agnes/page-setup/product-page/main-product.md).

# Main Product

## What It Does

The **Main product** section lets you customize the product display structure.<br>

***

### Settings

#### **Layout**

Controls the Layout. Choose from: Full width, Fit to width.

**Media**

#### **Media fit**

'Cover' maintains its aspect ratio and fills the width and height of the section. 'Contain' maintains its aspect ratio and increases or decreases the size of the image to fill the section. Choose from: Contain, Cover.

#### **Media ratio**&#x20;

Controls the Media ratio. Choose from: Square, Landscape.

#### **Media width (desktop)**&#x20;

Controls the width of this element.

#### **Order (desktop)**

Controls the Order (desktop). Choose from: Media on the left, Media on the right.

#### **Enable image zoom**&#x20;

When enabled, displays this element. Disable to hide it.

**Media Pagination**

#### **Layout**

Controls the Layout. Choose from: Popup, Columns.

#### **Maximum Number of columns per row**

Controls the number of columns.

#### **Thumbnail ratio**&#x20;

Controls the Thumbnail ratio. Choose from: Square, Landscape.

**Appearance**

#### **Input/button maximum width**

Controls the width of this element.

#### **Color scheme**

Applies a predefined color scheme to this element.

{% hint style="info" %}
Color schemes are sets of coordinated colors you define under **Theme settings > Colors**. Choosing a scheme applies its background, text, and accent colors.
{% endhint %}

**Spacing**

#### **Maximum padding top**

Adjusts the space above the content.

#### **Maximum padding bottom**

Adjusts the space below the content.

***

### Supported Blocks

#### Vendor

See the child document for full settings: [Vendor](/agnes/page-setup/product-page/main-product/vendor.md)

#### Product title

See the child document for full settings: [Product title](/agnes/page-setup/product-page/main-product/heading.md)

#### Price

See the child document for full settings: [Price](/agnes/page-setup/product-page/main-product/price.md)

#### Variant selector

See the child document for full settings: [Variant selector](/agnes/page-setup/product-page/main-product/variant-selector.md)

#### Quantity

See the child document for full settings: [Quantity](/agnes/page-setup/product-page/main-product/quantity.md)

#### Inventory

See the child document for full settings: [Inventory](/agnes/page-setup/product-page/main-product/inventory.md)

#### Description

See the child document for full settings: [Description](/agnes/page-setup/product-page/main-product/description.md)

#### Buy buttons

See the child document for full settings: [Buy buttons](/agnes/page-setup/product-page/main-product/buttons.md)

#### Social share

See the child document for full settings: [Social share](/agnes/page-setup/product-page/main-product/share.md)

#### SKU

See the child document for full settings: [SKU](/agnes/page-setup/product-page/main-product/sku.md)

#### Text

See the child document for full settings: [Text](/agnes/page-setup/product-page/main-product/text.md)

#### Border

See the child document for full settings: [Border](/agnes/page-setup/product-page/main-product/border.md)

#### Custom liquid

See the child document for full settings: [Custom liquid](/agnes/page-setup/product-page/main-product/liquid.md)

#### Accordion

See the child document for full settings: [Accordion](/agnes/page-setup/product-page/main-product/accordion.md)

#### Complementary products

See the child document for full settings: [Complementary products](/agnes/page-setup/product-page/main-product/complementary-products.md)

#### Product badge

See the child document for full settings: [Product badge](/agnes/page-setup/product-page/main-product/badge.md)

**Block Limit**

You can add up to **3** of this block type.

#### Product compare checkbox

See the child document for full settings: [Product compare checkbox](/agnes/page-setup/product-page/main-product/product_compare.md)

***