> For the complete documentation index, see [llms.txt](https://help.inspiredtheme.com/articles/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.inspiredtheme.com/articles/product-pages/product-information/breadcrumbs-divider-image.md).

# Breadcrumbs, Divider & Image

Three small blocks for your product page: a breadcrumb trail, a divider line or space, and an image with an optional link.

***

These three blocks help you structure your product information. **Breadcrumbs** shows shoppers where they are in your store, **Divider** separates groups of blocks, and **Image** adds a picture such as a size chart, badge or promotion.

### 1. Our guide to set up these blocks:

{% hint style="info" %}
**Steps:**

* In the theme editor, open a product page using the page selector at the top.
* In the **Product information** section, click **Add block.**
* Select **Breadcrumbs**, **Divider** or **Image.**
* Click **Save.**
  {% endhint %}

Drag the block in the sidebar to place it where you want among the other blocks.

### 2. Breadcrumbs

The **Breadcrumbs** block shows a trail of links, such as Home / Collection / Product title. It has no settings.

* **Home** links to your home page.
* The collection is the one the shopper came from. If they opened the product directly, for example from search, the product's first collection is used. If the product isn't in any collection, the trail is Home / Product title.
* The product title is the last item and isn't a link.

You can add one Breadcrumbs block per product template. Place it at the top, above the **Title** block.

### 3. Divider

The **Divider** block adds a horizontal line or empty space between blocks. You can add as many as you need.

* **Show line:** Shows a thin line. Turn off to add empty space only.
* **Line opacity:** How strong the line is, 5–100%. Applies when the line is shown. The line uses the text color of the section's color scheme.
* **Block padding**
  * **Top padding:** Space above the line, 0–50px.
  * **Bottom padding:** Space below the line, 0–50px.

### 4. Image

The **Image** block shows an image, with an optional link, in your product information. You can add as many as you need.

* **Display position:** Product info / Media. With Media, the image appears below the product images on desktop (990px and wider). On smaller screens it stays in the product information area, in the block's position.
* **Image:** The image to show. Until you pick one, a placeholder image shows.
* **Image width:** Width of the image as a share of the column, 10–100%.
* **Link:** Optional. Makes the image clickable.

### 5. Tips

* Use a **Divider** with **Show line** off to add breathing room between the buy buttons and the details below them.
* Use the **Image** block for a size chart, a certification badge or a small promotional graphic. Add a **Link** to a page with more details.
* Keep images with text on them wide enough to read on mobile, for example 80–100%.
