[RÉGLÉ] Ajout d'un bouton sur Cassiopeia

[schott0200]

Bonjour à tous, est-il possible et comment, d'ajouter une position à droite du logo sur Cassiopeia ? Peut-être avec un modèle enfant ? Je dois rajouter un bouton pour télécharger un pdf.
Question qui complète la première. Comment va se comporter ce bouton sur smartphone ?
Merci pour votre aide.

[RobertG]

Bonjour,

As-tu essayé la position "below-top" déjà disponible, en jouant s'il le faut sur le positionnement pour placer le bouton à droite ?
Il est au-dessus de la zone "brand" pour le logo, donc devrait être aussi visible sur smartphone.

[daneel]

Bonjour, les deux solutions sont valables.

1. créer un template enfant, modifier le fichier index pour ajouter une nouvelle position et la css pour adapter l'affichage desktop & smartphone.
créer un bouton en module.

Pour te repérer sur le "comportement" notamment sur mobile, tu peux prendre exemple de la css sur le réglage de search qui est logiquement une position à droite du menu.

Virtuellement, cela donne ce résultat :




2. ou utiliser un module dans l'une des deux positions existantes (topbar en full, below-top dans le container, c'est à dire délimité par un encadré).

Dans ce cas précis, si tu utilise par exemple sp page builder, tu as certainement la possibilité d'utiliser les fonctionnalités du builder dans un module (fourni avec) donc
logiquement de recréer le logo et le bouton sur deux colonnes sans toucher une ligne de code. N'oublie pas d'assigner le module à toutes les pages !





Il te suffira alors d'aller dans les paramètres de cassiopeia pour desactiver "entête du site" à non afin de désactiver l'ancien entête.



Ce paramètre de Cassiopeia te permet ainsi de remplacer l'entête original par un module pour créer tous les headers possibles sans une seule ligne de code.

[schott0200]

Merci. Génial, je viens d'y arriver en utilisant ta deuxième méthode, mais avec PageBuilder CK light. Mais la position "below-top" n'occupe pas toute la largeur du header. Bizarre non ?

Accueil - Accueil (aplf-planetariums.org)

[ced1870]

Salut, effectivement il faut ajouter un bout de code pour étendre le contenu de cette section du template :

.grid-child.container-below-top > div {
flex: 1;
}​

tu peux le mettre dans le fichier user.css du template par exemple
CEd

[schott0200]

Génial, merci beaucoup ced1870 ça fonctionne très bien.