# Settings

You can set several settings that change your gallery's structure.

<figure><img src="https://lh4.googleusercontent.com/NxTc5g1LLMkGqSiwGUJS6_LrFE4cY98V0T735XHKT6x12JkdwHRArxeGN4FOWKqSwjGSoE8hCCN3ANqrhACxacKL1EibXNjfFBkw6pJSYxfRKkvkg6Xjxsya3VdQfqEBottXNszjK8Oqaz-U0yklaf5DXpK2vxYzEEkI_M1iZ3dBjLJ7yH6y2yF4K9a_ag" alt=""><figcaption></figcaption></figure>

## Type

Allows you to choose between a Grid or Masonry layout.

* The Grid property defines how images are laid out regularly in columns and rows.
* The Masonry property defines a grid layout based on columns with no fixed height so that images in additional rows will rise up to fill the gaps.

![](https://lh4.googleusercontent.com/acOzNptrM5FR-_QnFZV6QFSWNLM7m97_q2V7j1YqIUV9QulxgzIOWsvwUi6Gc6mbNYxftObuj1fiirZswqEwIoCOTvTvrh8YGSskfDasTV2gLerdS2FQcIKDkoK4HwVTLBDr2e38oj_NbtXUYd4x6SE6S5tp2Jf_pX_Xza-oim-XcD6wg6XWXD9WNpBWEw)

<details>

<summary>Set</summary>

1. Select the `gallery` block
2. Open the Block Inspector
3. Navigate to the Primary Tab
4. Open the Settings Tab
5. Find the Type field
6. Select Grid or Masonry

</details>

## Columns

Allows you to specify the number of columns you want in your gallery.

![](https://lh4.googleusercontent.com/Apscc0L2mJuI4sudnoMRXWBpOLh-1jpGavHvue9g-R9k9jNM9m7gN68LFWOslxcTPhwOqQnVLsyX_rGw6lfspd3iDPS4U5KQkOcH_PWqQKBG4k2Ye_KSDI9bMaD5feNoLLqrdSf2PasL3vroB8Xs0FO-SEaQ-hxBh0prUk139xHVgCX7-Mzn6nyIXD7ugA)

<details>

<summary>Set</summary>

1. Select the `gallery` block
2. Open the Block Inspector
3. Navigate to the Primary Tab
4. Open the Settings Tab
5. Find the Columns Field
6. Enter the desired value

</details>

## Horizontal Gutter

Determines the spacing between the gallery columns.

![](https://lh6.googleusercontent.com/oNIDwH4C5orzrSjjEm96uVtIoSvPSOmX-QbP1AsVKvk4SzR40a06IxeMZIL9pda492tlaEjMG_f2Yvu7scIW7cDHUf0zxCWGCjx1fu0YlxxOL5gwBgIPLPG9Iwe9DO6Zf_UAVNh3_bCUOS2kfOr0S4QaLRs12bLKdf_mXus-xWFy2Mb8AYvN4mVJ6s31Uw)

<details>

<summary>Set</summary>

1. Select the `gallery` block
2. Open the Block Inspector
3. Navigate to the Primary Tab
4. Open the Settings Tab
5. Find the H. Gutter Field
6. Enter the desired value

</details>

## Vertical Gutter

The Vertical Gutter property determines the spacing of the Gallery rows.

![](https://lh5.googleusercontent.com/bEMIWaa-Z87XZgZcX1hiNgMpllPgrey5RljBDZ5dvW6TbXoufMKkAX35kFLdpLsUTi4kqT5Tv3--KxKRjmTkCm0dtDF9RaPF5sWKJmtgWKELxFwI97Tfi_YQTFPy-1XytOtyrDNNcN2A6itvZRMWk-NbxLZ2v1tnEbG2V9VHNFAuejyTfM3mQeoO3HRRbA)

<details>

<summary>Set</summary>

1. Select the `gallery` block
2. Open the Block Inspector
3. Navigate to the Primary Tab
4. Open the Settings Tab
5. Find the V. Gutter Field
6. Enter the desired value

</details>

## Image Height

{% hint style="info" %}
The Image Height property can be adjusted when Grid is selected for Gallery Type.
{% endhint %}

Allows you to specify the height of an image for the gallery.

![](https://lh4.googleusercontent.com/m532RCHCuf7OaRQ3a4o7i1wqa-lWlIWb0LWbAqOWvhi-ML1QRuvxyijinKOM2_mzkd8nERoPngSpBKTYcj2PIMA-gmbmGB9ESSmHOl2lF8E1wJ0mTfJYRpmqRheRHNoFil5zAaIHLvVVtL6roQmYHs0uQV_nIp-iieaPYr_QXtwabCRjKyirmYFR7ZIBLw)

<details>

<summary>Set</summary>

1. Select the `gallery` block
2. Open the Block Inspector
3. Navigate to the Primary Tab
4. Open the Settings Tab
5. Open the Layout Tab
6. Find the Height Field
7. Enter the desired value

</details>

## Thumbnail

Specifies your gallery's images thumbnail size.

![](https://lh4.googleusercontent.com/LZDge4I0h7cVh_VQYRFdRcm7niYa9l44dfRfA5EizL-hfnBrFuIxquwoY3_jCks1RnRVipW_DBV1LQThtJzVaW8zIC7AIXbnxmG7I6BRMsCdOrbyn42k6gS0eqxnj4d6ueUKL_5DlhsxOebgaWflJEQtyfGpS4NbkQZIAnURiBgB7S3Af_ladZrFaDEMPA)

<details>

<summary>Set</summary>

1. Select the `gallery` block
2. Open the Block Inspector
3. Navigate to the Primary Tab
4. Open the Settings Tab
5. Find the Thumbnail Size
6. Select the desired size

</details>

## Lazy Load

Allows you to reduce the `gallery` block's initial load time by loading the images once they are in the user's viewport and not on first loading.

![](https://lh4.googleusercontent.com/kzSy3gZOpX5KWMnpPxTJmc8CveWeFHKQto6_VnJaFsZYXtDCPwg-4rcJc_iN6ddgP24R5gnxh9_DOd7UnRU__Tz6N_wDsPEHK-WSVK0wWkfbGoLaFqTTNeFl-JrHkNTM3huW52dnKSTwdGN-rI4oiWkbJjS9OiqFzkep4JwIEvfA8y0bbkSxko1EFgD7Tg)

<details>

<summary>Set</summary>

1. Select the `gallery` block
2. Open the Block Inspector
3. Navigate to the Primary Tab
4. Open the Settings Tab
5. Find the Lazy load Toggle
6. Toggle Lazy Load on

</details>

## Link

When activated, the image acts as a link and can either open a Lightbox or navigate to a specified URL.

![](https://lh4.googleusercontent.com/t5hgWH4zbKBsLhW7DToGdOTqjzWVcnR5gxxTFM7F5cdTJvfsh29EvSiD3jLmrFl4iEd0tnhr5th62meOjfI5f3J76T9BTzNyrytBu0gb2uqafUp6apjiRBfN-Y4voh2yBVAOE99tH4izQQiOcWHfuqSOB_GjlajIKmuY4ujJMOf_rjU2razZfavepHgYEQ)

<details>

<summary>Set</summary>

1. Select the `gallery` block
2. Open the Block Inspector
3. Navigate to the Primary Tab
4. Open the Settings Tab
5. Find the Link Toggle
6. Toggle the Link on

</details>

### Lightbox

Allows you to show images inside a fullscreen slideshow modal. It works on all screen sizes.

<details>

<summary>Set</summary>

1. Select the `gallery` block
2. Open the Block Inspector
3. Navigate to the Primary Tab
4. Open the Settings Tab
5. Find the Link Toggle
6. Toggle the Link on
7. Select the Lightbox value in the Link Type Menu

</details>

### URL

Allows you to open a URL outside the gallery by clicking on a gallery image. For example if you want to avoid putting text on the image, the URL link can open a detailed product page with textual product information.

![](https://lh6.googleusercontent.com/doefGYTXv_oRQjNsvEcp3debd7ndOZMVlcomXrt7TynojQperN5_EjWAH-ZzKyLLKfDrp1yKE5K_aKqDznSdyYRCmWIzbIte5wu9l04YJmFxyeV2Znq-cGL2fJullbU2dxakO5Y_CFFhO110Ij5hEpOa4UYa_SZhVX9XprEfq-xDFI2lAjJ_OLvR-1yZaw)

<details>

<summary>Set</summary>

1. Select the `gallery` block
2. Open the Block Inspector
3. Navigate to the Primary Tab
4. Open the Settings Tab
5. Find the Link Toggle
6. Toggle the Link on
7. Select the URL value in the Link Type Menu
8. Select the :link: on your desired image
9. Enter URL&#x20;

</details>