Comment configurer votre bannière de titre ?

Bonjour et bienvenue dans votre back office GoodBarber !

Aujourd'hui nous allons paramétrer le header ou Logo et Titre de votre application.

Il s'agit la partie supérieure de l'application qui est toujours visible et accessible sur toutes les sections.

Le header a 4 objectifs :

- Afficher l'identité de votre app

- Donner un titre à une section

- Afficher les raccourcis

- Naviguer dans l'application

Allons tout de suite le paramétrer dans le menu My app > Design > Design Général.

Je clique sur Logo et Titre.

Ici je peux soit entrer le nom de mon application au format texte, soit ajouter un logo.

J'ai envie de quelque chose de très "brandé" donc je vais ajouter un logo plutot.

Il est déjà prêt je n'ai plus qu'à le télécharger.

Voilà !

Maintenant je choisis l'alignement du logo a droite, ou centré.

Facile non?

Vous en voulez plus? J'en étais sûre !

On peut aller plus loin dans la personnalisation du header en activant le menu Avancé ici.

Voilà, j'ai bien plus d'option maintenant.

Je peux changer la couleur de fond, de la barre de séparation, ajouter des images de fond.

Je peux aussi ajouter des liens à mon Header.

Je travaille sur l'application du spa Freyja, c'est un local business.

Je vais donc ajouter un lien vers la carte de membre ici. Je clique sur Ajouter une action, je choisi l'icone, je paramètre les couleurs de mon raccourcis. Parfait.

Pour la version PWA, on peut choisir d'afficher le titre du raccourcis sur tablette et desktop.

J'ajoute aussi un lien vers la carte de fidélité pour que mes utilisateurs accèdent facilement à leur récompenses.

Dernier paramètre, les autres éléments du header.

Ici il s'agit des icones de retour qui s'afficheront dans le header pendant que l'utilisateur naviguera dans l'app.

je vous mets la vidéo sur les modes de navigation dans la barre d'info ;)

Je prévisualise.

C'est terminé !

Je vous montre le résultat final.

Voilà vous savez maintenant comment personnalisé le Header de votre app.

A bientôt pour un nouveau tutoriel !