Piwigo.org

Katryne · 2021-02-02 13:26:11

Bonjour !
Dans un site en construction (v.2.10.2), j'ai customisé Modus. mais je trouve que la barre de menu est trop proche du fil d'Ariane, parfois, en voulant cliquer sur le fil d'Ariane, on déroule par inadvertance un élément déroulant du menu au-dessus. Je ne veux pas les espacer un peu plus, car le header prend déjà beaucoup de place avant que l'on arrive à l'essentiel du site.
Comment puis-je faire ?

https://dardennes.revestou.fr/

dreamer · 2021-02-02 13:43:20

Salut voisine

Un petit margin-top sur ton fil d'Ariane

Code:

#thePicturePage .browsePath {
    margin-top: 1rem;
}

A+

Katryne · 2021-02-02 15:11:34

Merci, mé oui mé non : je ne veux pas augmenter la hauteur globale du header avant qu'on arrive à la partie centrale de la page. J'envisage même de diminuer la taille des caractères du titre du site pour que le visiteur parvienne à l'essentiel sans scroller quand s'ouvre la page.

Katryne · 2021-02-11 17:29:17

Hello ! Qui aurait une idée pour coller la barre de menu au plafond dans Modus, au-dessus de la bannière ? Si je lui mets une position fixed et top : 0, il est caché par la barre d'outil de l'administration. En fait, je voudrais plutôt intervertir bannière et menu.
Merci de toute suggestion.

ddtddt · 2021-02-11 21:10:39

Bonjour

Je dirais faire un template extension de header.tpl et de déplacerais dedans les 2 blocs

Katryne · 2021-02-11 22:27:01

Merci mais ...
heu ...
Je n'ai pas de header.php, seulement un page_header.php dans /include et un header.tpl dans modus/template.
Mais ni dans l'un, ni dans l'autre, je ne trouve trace de #menubar.
Je suis dans le brouillard.

TOnin · 2021-02-12 16:06:32

Bonjour,
après avoir recherché dans le code 'page_banner', et tenté de dupliquer le code de la bannière après #menubar dans menubar.tpl, je me rends compte que ça ne marche pas...
Donc je propose cette solution rapide et loin d'être la plus élégante : copier le code HTML de la bannière, le coller à la fin de menubar.tpl, puis désactiver le rendu de la bannière dans les options de Piwigo, et ça devrait donner le résultat escompté.

Code:

<div id="theHeader"><h1 class="container-fluid" style="text-align: center;">
  La vallée de Dardennes et du Las<br>
  Cartes postales et photos anciennes</h1>
</div>

Le fait est qu'il n'y a pas, dans include/menubar.inc.php, d'assignation pour créer la variable $PAGE_BANNER dans menubar.tpl.

Katryne · 2021-02-12 16:39:53

Merci TOnin, c'est du merveilleux bidouillage. Juste ce que je veux. J'ai même fait ça via les template extension et j'ai ajouté un peu de padding à gauche pour l'icône fermée des admins.

J'ai encore un petit souci pour la bannière en mode mobile portrait ou paysage, mais comme ça vire sur SmartPocket à ce moment-là, c'est tout bon.
Enfin, je crois.

Dernière modification par Katryne (2021-02-12 16:51:23)

Katryne · 2022-11-01 19:16:08

Hello !
Je voudrais faire pareil avec BootStrap Darkroom. Je veux dire coller le menu tout en haut et avoir le titre du site en-dessous. Ou l'inverse, mais sur 2 lignes séparées. Le menu est trop long et quand on y ajoute les albums liés et les tags liés, on perd parfois le dernier item de menu (celui de la connexion)
J'ai essayé successivement (sans réussir) une template-extension de menu.tpl, puis de header.tpl. Mais j'ai été assez nullissime sur ce coup-là.
Qui aurait une suggestion, s'il vous plait ?

http://photos.katrynou.fr/

gbo · 2022-11-04 11:11:40

Katryne,
Juste une ébauche:
il fraudait dans header.tpl inverser l'ordre du menu et du titre
pour obtenir comme ci-dessous
<div class="collapse navbar-collapse" id="navbar-menubar">.........</div>
<a class="navbar-brand mr-auto" href="/">Carnets de balades</a>

Puis enlever le nowrap sur:
@media (min-width: 992px)
.navbar-expand-lg > .container, .navbar-expand-lg > .container-fluid {
flex-wrap: nowrap;
}

je ne sais pas si c'est ce que tu souhaites et n'utilisant plus Darkroom, je n'ai aucune idée des effets de bord.

RQ:Tu as un petit souci avec l'affichage des drapeaux des langues.
sur pwg-icon langflag-fr_FR le height:26px est de trop....

Katryne · 2022-11-04 13:38:29

Merci gbo.
Déjà pour les drapeaux, je trouve pas où agir. J'ai regardé le css de Bootstrap, ma customisation dans LFE, le css du plugin SwitchLang. Mais ai-je besoin des drapeaux de langue ? Si je trouve pas, je vais désactiver Switchlang ...

Katryne · 2022-11-04 14:06:34

Et pour le menu en haut .. ben un peu comme mes 13 essais précédents, j'ai bien réussi à inverser menu et titre, mais c'est toujours sur la même ligne (même en essayant un br juste avant.

C'est à cause du nowrap ? Et pourquoi le supprimer dans un des media-queries seulement, celui à min-width: 992px ?
Je te dis, je suis une quiche ...

dreamer · 2022-11-04 14:08:35

Katryne a écrit:
Merci GB.
Déjà pour les drapeaux, je trouve pas où agir. J'ai regardé le css de Bootstrap, ma customisation dans LFE, le css du plugin SwitchLang. Mais ai-je besoin des drapeaux de langue ? Si je trouve pas, je vais désactiver Switchlang ...

Salut voisine

je remarque que tes drapeaux sont un peu à la one-again., donc dans .pwg-icon, peux-tu mettre le width à 24px et le height à 16px

A+

Katryne · 2022-11-04 14:30:29

Pour les drapeaux, j'arrive à rien Dreamer. Alors, j'ai désactivé le plugin.

gbo · 2022-11-04 14:38:28

Pour le drapeau tu peux ajouter simplement
#languageSwitch .pwg-icon {
height: auto;
}

Pour le menu c'est un peu plus compliqué:
il faut gérer deux cas en fonctions de la taille de l'écran et donc avoir:
<a class="navbar-brand mr-auto" href="/">Carnets de balades</a>
(visible seulement si moins de 992px avec flex-wrap:wrap pour les petits écrans )
le texte 'balades..' restera à gauche de l’icône.

<div class="collapse navbar-collapse" id="navbar-menubar">.........</div>

<a class="navbar-brand mr-auto" href="/">Carnets de balades</a>
(visible seulement si plus de 992px avec flex-wrap: nowrap pour les grands écrans )
le texte 'balades..' sera sous le menu .... en principe..

Tu as de la chance, j'ai refait la mise en page de mon menu, il y a peu de temps ....

Piwigo.org

Annonce

#1 2021-02-02 13:26:11

[Résolu] Modus : remonter la barre de menu au-dessus du header

#2 2021-02-02 13:43:20

Re: [Résolu] Modus : remonter la barre de menu au-dessus du header

Code:

#3 2021-02-02 15:11:34

Re: [Résolu] Modus : remonter la barre de menu au-dessus du header

#4 2021-02-11 17:29:17

Re: [Résolu] Modus : remonter la barre de menu au-dessus du header

#5 2021-02-11 21:10:39

Re: [Résolu] Modus : remonter la barre de menu au-dessus du header

#6 2021-02-11 22:27:01

Re: [Résolu] Modus : remonter la barre de menu au-dessus du header

#7 2021-02-12 16:06:32

Re: [Résolu] Modus : remonter la barre de menu au-dessus du header

Code:

#8 2021-02-12 16:39:53

Re: [Résolu] Modus : remonter la barre de menu au-dessus du header

#9 2022-11-01 19:16:08

Re: [Résolu] Modus : remonter la barre de menu au-dessus du header

#10 2022-11-04 11:11:40

Re: [Résolu] Modus : remonter la barre de menu au-dessus du header

#11 2022-11-04 13:38:29

Re: [Résolu] Modus : remonter la barre de menu au-dessus du header

#12 2022-11-04 14:06:34

Re: [Résolu] Modus : remonter la barre de menu au-dessus du header

#13 2022-11-04 14:08:35

Re: [Résolu] Modus : remonter la barre de menu au-dessus du header

Katryne a écrit:

#14 2022-11-04 14:30:29

Re: [Résolu] Modus : remonter la barre de menu au-dessus du header

#15 2022-11-04 14:38:28

Re: [Résolu] Modus : remonter la barre de menu au-dessus du header

Pied de page des forums