How to set up the header of your shop

Hello and welcome to your GoodBarber back office

Today we’re going to set up the header or logo and title of your app

This is the upper part of your app, which is always visible and accessible in every section

The header has 4 objectives
Display your app identity
Give a title to a section
Display shortcuts
Navigate in the app

So, let’s go to the menu Content and Design > Design > General design

Click on Logo and title

Here I can or add the title in text format or add a logo

I’m really looking for something branded so I;m adding a logo

I already had it ready :)

Voila!

Now I'm selecting the logo alignment : to the right or centered

Easy no?

But you want to do more right? I knew it

You can customize your header even more by activating the menu advanced here

Now i have more options
I can change the color of the font, the separator, add background images
I can also add links to my header
I will add a link to the cart. Click add an action, select the icon and set the color of the shortcut. Perfect

For the PWA, you can choose to the title of the shortcut on desktop and tablets

Then the color of the cart bullet an its done

Last step the other elements of the header:
Meaning the back arrow that will be displayed when your users browse your catalog. Depending on your navigation template, you can have other options. For exemple with the Swipe, you can choose the icon to open the menu
I;m adding the video on the navigation templates in the info bar

Let’s preview

Finished!

Let me show you the final result 

You now know how to customize the header of your Shop

See you very soon for another tutorial