> For the complete documentation index, see [llms.txt](https://wpdocs.gitbook.io/villax/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://wpdocs.gitbook.io/villax/content-management/header-sticky.md).

# Header sticky

Once you have your regular header ready to go, this section will cover how to make it shrink.

To create this effect, you’ll rely heavily on some custom CSS. However, we’ll give you the exact code that you need and walk you through customizing it to match your site.

To get started, use Elementor Theme Builder to edit the template for your header.

In your WordPress dashboard, go to **Templates → Theme Builder** and click **Edit With Elementor** for your header template.

![](https://2898055004-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fyd2cncrWO4UvvURhLsh7%2Fuploads%2F2fNIu9qFvuNvc2qBYOLy%2F1.png?alt=media\&token=71d555e7-ab76-4ad0-9e15-f3b2231eb22a)

<figure><img src="https://2898055004-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fyd2cncrWO4UvvURhLsh7%2Fuploads%2FXm28JtvjC0B8xL12IEQV%2FScreen%20Shot%202022-12-02%20at%203.18.54%20PM.png?alt=media&amp;token=1681a5fd-fef7-47d0-a759-46b717b01e37" alt=""><figcaption></figcaption></figure>

<figure><img src="https://2898055004-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fyd2cncrWO4UvvURhLsh7%2Fuploads%2FNqgpCdabLxMBoxhqkxE6%2FScreen%20Shot%202022-12-02%20at%203.16.36%20PM.png?alt=media&amp;token=7657ba3f-db19-4e1f-aaa4-39b02bfef242" alt=""><figcaption></figcaption></figure>
