# Lookbook banner

![image](https://docs-assets.foxecom.app/pebble-theme/Fox-BG%20Light%20(40)_93UeWQYG.jpg)

A visually engaging Lookbook banner section designed to highlight key products and inspire customers through compelling imagery.

## How to add a Lookbook banner section to your Shopify store

<Hint type="success">

1. In the theme editor **(Customize)**, click **Add section.**
2. Select **Lookbook banner** section.
3. Make necessary changes.
4. **Save.**

</Hint>

## How to customize a Lookbook banner section

### Section settings

<Hint type="info">

&#x20;[Common settings available in most sections](https://docs.foxecom.com/pebble-theme/theme-sections/overview#common-settings-available-in-most-sections)

</Hint>

### Block settings

The Lookbook banner section includes a **Header**, a **Banner**, and **Product** blocks for showcasing featured items.

<Tabs>
<Tab title="Header">

Use the **Header** block to create and customize the section’s heading and introductory content.

<Table widths="214.1806640625,auto">

| Setting | Description |
| --- | --- |
| **Alignment** | Set the header alignment: left, center, or right. |
| **Devices** | Switch between desktop and mobile padding settings. |
| **Bottom** | Adjust the spacing below the header. |

</Table>

<Hint type="info" title="📦 Nested dynamic blocks">

* **Heading** – Add a main title
* **Subheading** – Provide supporting text above or below the heading
* **Text** – Include additional descriptions or details
* **Button** – Add a call-to-action

</Hint>

<Hint type="success">

📝 Learn more: [Basic](https://docs.foxecom.com/pebble-theme/theme-blocks/basic)

</Hint>

</Tab>

<Tab title="Banner">

![image](https://docs-assets.foxecom.app/pebble-theme/image_AZuqAkWN.png)

<Hint type="info">

Learn more: [Basic](https://docs.foxecom.com/pebble-theme/theme-blocks/basic#image)

</Hint>

</Tab>

<Tab title="Product">

![image](https://docs-assets.foxecom.app/pebble-theme/image_2ALaAD9w.png)

<Table widths="193.9097900390625,auto">

| Setting | Description |
| --- | --- |
| **Product** | Select the product to display in this section. |
| **Offset top** | Adjust the vertical position of the product. |
| **Offset left** | Adjust the horizontal position of the product. |
| **Offset top mobile** | Adjust the vertical position of the product on mobile devices. |
| **Offset left mobile** | Adjust the horizontal position of the product on mobile devices. |

</Table>

</Tab>
</Tabs>

## Best practices

* Since only one banner image is supported, choose an image with **enough space** to place multiple product pins without clutter.
* Add **multiple** **Product blocks** to highlight different items and position them strategically for better visibility.