---
title: "How to choose your header size ? | eCommerce App Tutorials - GoodBarber"
description: "Hello and welcome to your goodbarber back office.\r \r Today we're going to discover together a new design feature that will allow you to customize even more a key element of your app: the header.\r…"
canonical_url: "https://www.goodbarber.com/tutorials/shop/design/how-to-choose-your-header-size/"
lang: en
---

# How to choose your header size ? | eCommerce App Tutorials - GoodBarber

[Back](https://www.goodbarber.com/tutorials/shop/)

# How to choose your header size ?

Hello and welcome to your goodbarber back office.

Today we're going to discover together a new design feature that will allow you to customize even more a key element of your app: the header.

You can choose between three different header heights and other options. To discover this option go to the menu **Content and Design > Design> General Design** and click on the submenu **Logo and Title**.

This is where you can choose the default size of your header.

In the **small** version you can display the title of your app or your logo.

The **medium** version displays the same element but with a greater height.

Finally the **large** version allows you to add a short description to your header in addition to the title of your app or your logo.

You can then choose the effect applied to your header when scrolling: no effect , disappearing or resizing.

The header has multiple purposes: display the identity of your app, give a title to the section, display shortcuts or navigate in the app.

This is a very important part of your app so go ahead and make it perfect for you!

## Related videos

[DesignHow to set up your navigation menu](/tutorials/shop/design/how-to-set-up-your-navigation-menu/)

![How to set up your navigation menu](https://portal.ww-cdn.com/portal_static/images/videos_shop11.4f7dad94042e.jpg)

[DesignHow to customize the icons of the menu](/tutorials/shop/design/how-to-customize-the-icons-of-the-menu/)

![How to customize the icons of the menu](https://portal.ww-cdn.com/portal_static/images/videos_shop12.6eeb6d5a859c.jpg)

[DesignHow to set up the home page of your app](/tutorials/shop/design/how-to-set-up-the-home-page-of-your-app/)

![How to set up the home page of your app](https://portal.ww-cdn.com/portal_static/images/videos_shop13.e1aed198d25d.jpg)

[DesignHow to customize your splashscreen](/tutorials/shop/design/how-to-customize-your-splashscreen/)

![How to customize your splashscreen](https://portal.ww-cdn.com/portal_static/images/videos_shop14.5ba4ff60f4e0.jpg)

[DesignHow to set up the header of your shop](/tutorials/shop/design/how-to-set-up-the-header-of-your-shop/)

![How to set up the header of your shop](https://portal.ww-cdn.com/portal_static/images/videos_shop15.1e15b7c0b749.jpg)

[DesignHow to set up the global style of your shop](/tutorials/shop/design/how-to-set-up-the-global-style-of-your-shop/)

![How to set up the global style of your shop](https://portal.ww-cdn.com/portal_static/images/videos_shop16.60bbdddf3a84.jpg)

[DesignHow to customize the main icons of your shop](/tutorials/shop/design/how-to-customize-the-main-icons-of-your-shop/)

![How to customize the main icons of your shop](https://portal.ww-cdn.com/portal_static/images/videos_shop17.5fb60f1ec20f.jpg)

[DesignHow to design the sections of your shop](/tutorials/shop/design/how-to-design-the-sections-of-your-shop/)

![How to design the sections of your shop](https://portal.ww-cdn.com/portal_static/images/videos_shop18.471e5731e7e3.jpg)

[DesignHow to unhook the design of a section](/tutorials/shop/design/how-to-unhook-the-design-of-a-section/)

![How to unhook the design of a section](https://portal.ww-cdn.com/portal_static/images/videos_shop19.6bfd3cd7cba1.jpg)
