# Breadcrumbs

### Colors

\-

### Basic configuration

**Alignment (4):** Aligns breadcrumbs horizontally in the provided area.\
**Full width (5):** Breadcrumbs are based on the container width of the selected [basic layout](https://themedocs.zenit.design/en/settings/basic-settings). Depending on the basic layout, you can stretch the background and the content to the full width of the browser. In the layout modes `Full-Width-Boxed`, `Boxed` and `Full-Width-Header` the background color extends to the edge of the browser - but not the content.\
**Display home (6):** Show or hide the "Home-link" as first element.\
**Display 'You are here'-text (7):** In addition, an introductory Text **'You are here'** can be displayed. The text was implemented as a text snippet and can be changed in the administration snippet module.\
**Top spacing (8), Bottom spacing (9):** The fields define the distance of the breadcrumbs to the header as well as to the other content of the page.

![](https://2915610672-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4i6VN0FeNAgRFLwVM2Cr%2Fuploads%2FJ3Y52p4izkRKd19Do08J%2Fdocs-en-config-elements-breadcrumbs-basic-configuration.png?alt=media\&token=cac886be-035e-4ef2-875e-c3eafa30a5af)

Example:

![Breadcrumbs background-color - no full width](https://2915610672-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MCG4xkoMVXEQllVF5R9%2F-MHX0gb9DxlTG-P-TVlW%2F-MHX16ajtGi_ZjQmtGEm%2Fdocs-front-elemente-pagination-breadcrumbs.jpg?alt=media\&token=dbc700d4-68e3-42c9-a2ec-61138e03b975)

![Breadcrumbs with background-color - set to full width](https://2915610672-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MCG4xkoMVXEQllVF5R9%2F-Miz9ZkdfKYuC484kafb%2F-MizAEnXVrdHPEYckI2u%2Fdocs-theme-elemente-breadcrumbs-example.png?alt=media\&token=cc2cac77-b6b6-4f59-a01c-69c8e4ef6f6e)

{% hint style="success" %}
How to put breadcrumbs into the category image, you will learn in the [category image](https://themedocs.zenit.design/en/content/category/category-image) description.
{% endhint %}

![Breadcrumbs im Kategorie-Bild](https://2915610672-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MCG4xkoMVXEQllVF5R9%2F-MHX0gb9DxlTG-P-TVlW%2F-MHX1IsemJZ0hkx9YUL3%2Fdocs-front-elemente-pagination-breadcrumbs-2.png?alt=media\&token=4fc10c0c-a724-4e7f-8746-e8034729317f)