# Media gallery

{% hint style="info" %}
Product image and layout options were expanded in v5.0.0 on April 12 2022. See our [changelog](https://help.fluorescent.co/lorenza/readme/changelog) and [theme update guide](https://help.fluorescent.co/lorenza/readme/theme-updates) to learn more.
{% endhint %}

Customize the layout of your product page with options to change the **size**, **position**, and **shape** of your images.

<details>

<summary><mark style="color:blue;">STEPS</mark></summary>

In your theme editor (**Customize**):

1. Click on the **Product overview** section to open the settings.
2. Check the **Enable full width** checkbox to expand the product page content across the entire page when viewed on larger screens.

   > By default, the content of your product page will have a margin on either side when displayed on wide desktop windows.
3. Select the **Image size** of your product media. Either **Small**, **Medium**, or **Large**.

   > This option applies to all product media if **image thumbnails** are disabled.
4. Choose whether to **Show image thumbnails** to display an alternate layout for your product media.

   > When enabled, additional product media will display as small square thumbnails that customers can click on to view them full size.
5. (*Optional*). Set the **Thumbnail position** to **Below the product image** or **Beside the product image**.
6. (*Optional*). Select the **Thumbnail size**. Either **Small**, **Medium**, or **Large**.
7. (*Optional*). To make all product media a uniform shape, set the **Thumbnail aspect ratio** to crop your images to **Square**, **Landscape**, or **Portrait**.

   > The default **Natural** setting will display the original orientation of your product media.

   ![](https://1086282208-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fl6iv1HA2gJCuwR5V6stX%2Fuploads%2Fgit-blob-18e593ad0edf007db92b2db4471c455059562ccf%2Faspect-ratio.jpeg?alt=media)
8. Check the **Enable video looping** checkbox to make product videos loop continuously after customers click play.

   > See Shopify's [Product media](https://help.shopify.com/en/manual/products/product-media) guide to learn more.
9. Click **Save**.

</details>

### Settings reference

Click the **Product overview** section to find the following settings.

| Setting                | Description                                                                                                                                                                                      |
| ---------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| Enable full-width      | Display your product page content across the entire webpage without side margins.                                                                                                                |
| Show image thumbnails  | Show additional product images as thumbnails that visitors can click to view. Toggle off this option to show product media in a single column.                                                   |
| Thumbnail position     | Display product images thumbnails either Below the product image or Beside the product image.                                                                                                    |
| Thumbnail size         | Choose to display the product image thumbnails as Small, Medium, or Large.                                                                                                                       |
| Thumbnail aspect ratio | <p>Make product media thumbnails a uniform shape by cropping them all as Square, Landscape, or Portrait.<br><br>Select Natural to display product media with the original shape as uploaded.</p> |
| Enable video looping   | For your products that have product videos added as media, make videos loop continuously after customers click to play them.                                                                     |
| <p><br></p>            |                                                                                                                                                                                                  |

***

> **Related links**
>
> [Breadcrumbs](https://help.fluorescent.co/lorenza/product-pages/layout-and-style/breadcrumbs)\
> [Navigation buttons](https://help.fluorescent.co/lorenza/product-pages/layout-and-style/navigation-buttons)\\