[RÉGLÉ] photo en light box virtuemart passe en arrière d'un bandeau présent sur le site

[Pierre débutant]

Bonjour,
Je possède un site "vitrine" (non marchand) www.pierbiau.com, sous joomla 3.9.28, avec comme catalogue virtuemart 3.8.8.
J'ai besoin d'une "amélioration" concernant justement la partie catalogue, à savoir les photos en light box qui apparaissent lorsqu'on clique sur les miniatures.
Je m'explique :
- Lorsque je suis sur un article du site, par exemple : https://www.pierbiau.com/index.php/v...presentation-2, les images cliquables s'agrandissent en light box, en passant au 1er plan, et grisant alors le fond, aspect qui me convient parfaitement.
- Losrque je suis sur le catalogue virtuemart, par exemple : https://www.pierbiau.com/index.php/c...ef-1122-detail, l'image cliquable se place en 2nd plan, juste derrière le "bandeau à onglets" (réalisé quant à lui par le plugin "maximenu ck"). Je n'avais pas ce problème avant de passer à maximenu ck..., les images cliquables passaient bien en light box au tout premier plan. Si l'on déroule la page un peu vers le bas, avant de cliquer sur l'image, alors l'image arrive bien au 1er plan

Quelqu'un aurait-il une piste pour faire passer les images cliquables de virtuemart au tout premier plan, par dessus le bandeau ?
Est-ce qu'un "point de programmation" permettrait de le faire, et bien sûr je serais alors obligé de reprogrammer à chaque mise à jour de virtuemart..., ou de maximenu ck ?
A moins qu'un plugin existe à ce sujet.

Merci d'avance pour vos réponses.
Cordialement,
Pierre

[woluweb]

Bonjour Pierre débutant

C'est juste une question de css : quand il y a plusieurs éléments, avec "z-index" on peut dire lequel est au-dessus de l'autre.

Actuellement maximenuck a un z-index de 999 donc il passe devant l'image en lightbox.
Mais si tu ajoutes ceci dans le css de ton template, alors c'est bon :

div#maximenuck114 ul.maximenuck {z-index: 0 !important};

[Pierre débutant]

Bonjour,
Merci pour cette réponse qui me donne une solution viable.
Cependant, n'étant pas très pro en informatique, j'aimerais avoir un peu plus de précisions sur la manière d'opérer.
A savoir, j'ai parcouru mon site via ftp, www>templates>protostar>css : j'ai encore 11 fichiers au choix, dont 4 lisibles en bloc-notes (language php).
Dans quel fichier dois-je intégrer ce code ? Et également, y a t'il une place précise ou l'insérer, ou puis-je le mettre tout à la fin du fichier ?
J'ai mis une capture d'écran au format jpg du dossier css de protostar.
Remerciements d'avance
Pierre

[woluweb]

Et voilà, c'est dans la doc officielle : https://docs.joomla.org/J3.x:Adding_...h_Protostar/fr

[Pierre débutant]

Bonjour,
Merci encore pour ce lien vers la doc officielle protostar (j'aurais dû fouiller un peu par moi même)
Si j'ai bien compris, je n'ai pas à "ajouter ce code dans un fichier existant", mais "simplement à créer un ficher css supplémentaire contenant juste cette ligne de code" ? (tout ça en back end, ce qui est bien plus facile à mon niveau)
Dès confirmation de votre part, je vais sauvegarder mon template, et tenter cette manipulation pour voir le résultat.
Merci encore

[woluweb]

la manière de procéder dépend du template.
Pour protostar, on peut créer un fichier user.css là où il y a template.css
(moi je le fais par FTP, mais on peut le faire via l'interface)

Sur d'autres templates, c'est directement dans les paramètres template qu'on peut insérer son propre css, ou via un fichier "custom.css"

[Pierre débutant]

Bonjour,
Super, tout a marché du premier coup : les images du catalogue virtuemart passent à présent au 1er plan par dessus le bandeau dans l'axe des z.
Une fois de plus, je vous adresse mes félicitations ainsi que mes remerciements pour avoir compris et solutionné ce petit problème ennuyeux

A bientôt pour d'autres petits problèmes de ce type sous virtuemart que je souhaite corriger petit à petit.
Bon week-end