> For the complete documentation index, see [llms.txt](https://blueskytechco.gitbook.io/alukas-shopify/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://blueskytechco.gitbook.io/alukas-shopify/theme-sections/collection-packery.md).

# Collection packery

<figure><img src="/files/2mQInrbHXjMY7OppeiPD" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
Steps

1. In the theme editor (**Customize**), click **Add section**
2. Locate **Collection packery**
3. **Save**
   {% endhint %}

## Section settings <a href="#collection-packery-settings" id="collection-packery-settings"></a>

### **Section header** and **general** <a href="#id-1.-section-header-and-general" id="id-1.-section-header-and-general"></a>

Use the provided text fields to add a suitable heading/subheading/description. Leave any of them blank if you do not want to display them.

Adjust the text alignment (left/center/right) along with the background color and container type.

<figure><img src="/files/9MMC0iKeJn5fesauA3Ng" alt=""><figcaption></figcaption></figure>

**Layout:** You can choose between Fluid Container, Stretch width, Full width for the layout or just leave it with the default layout of the video.

**Color schema:** You are allowed to change text color, background color, etc. with preset color.

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

### Content settings <a href="#id-2.-collection-list-settings" id="id-2.-collection-list-settings"></a>

**Hover effect:** This option allows you to set an effect when hovering for image with many selections (Warning: Hovering effect will resize your images).

**Aspect ratio:** You can set the ratio for images with presets or set up your own ratio with **Custom ratio**

**Column gap:** You are allowed to change both of them for mobile devices.

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

### Section padding

Section padding allows you to specify the space between this section and the preceding or following sections, or both.

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

## Blocks settings

**Collection heading:** This will be shown in place of the collection name if it's not left empty, allowing for customized or more descriptive titles.

**Select collection:** Choose the link that leads to the desired collection, providing a direct pathway for users to explore specific products or categories.

**Select image:** This will be shown in place of the collection thumbnail if it's not left empty.

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