Bonjour,
Suite à un magnifique tutorel (maintenant archivé) de Amaziel pour coller la barre de navigation en haut du forum (aperçu : ici), j'en ai changé quelque particularité qui, je pense, feront plaisir à certain. Dans ce tuto je vous monterais deux façons de modifier la barre :
- Mettre la barre en Transparence au dessus de votre header
- Mettre la barre en transparente SUR votre header.
Etape -0 (reproduire le tuto d'Amaziel) :
Tout d'abord, vous rendre dans le bon template :
Panneau d'administration >> Affichage >> Templates >> General >> Template overall_header
Puis, supprimer la barre de navigation de base qui est dans le template :
- Code:
{GENERATED_NAV_BAR}
Vous retrouvez ensuite ce bout de code dans le template :
- Code:
<body background="{T_BODY_BACKGROUND}" bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}" vlink="{T_BODY_VLINK}">
Et vous ajoutez, directement après, ce code :
- Code:
<table style="position: fixed; left: 0px; top: 0px; right: 0px; background-color: #000000; z-index:1000; width: 100%; border-bottom:1px solid #5E4036;" ><tr><td><center>{GENERATED_NAV_BAR}</center></td></tr></table>
Vous enregistrez et publiez le template et voilà !
Variante 1 : Mettre la barre en Transparence au dessus de vôtre header[/b]
Repérer la ligne suivante que Amaziel vous as fait installer dans l' Overall_hearder :
- Code:
<table style="position: fixed; left: 0px; top: 0px; right: 0px; background-color: #000000; z-index:1000; width: 100%; border-bottom:1px solid #5E4036;" ><tr><td><center>{GENERATED_NAV_BAR}</center></td></tr></table>
Et changer le par celui-ci :
- Code:
<TABLE STYLE="POSITION: FIXED; LEFT: 0PX; TOP: 0PX; RIGHT: 0PX; BACKGROUND-COLOR: none!important; Z-INDEX:1000; WIDTH: 100%;" ><TR><TD><CENTER>{GENERATED_NAV_BAR}</CENTER></TD></TR></TABLE>
S'il se présente un espace entre la barre et le haut de vôtre forum, ce qui est possible car nous avons supprimer la couleur régler le :
"top: 0px;" à "top: -10px;" de manière a ne plus voir cette espace.
Ce qui vous donnera ceci :
[u]Variante 2 : Mettre la barre en transparence SUR votre header.
Les code suivants sont basée en fonction d'un header collé en haut du forum.
[b]Etape 1 : CSS du header
Allez dans: Affichage > couleur > feuille de style css.
Puis, collez ceci dans votre feuille de CSS :
- Code:
/* LOGO DU FORUM */
img#i_logo {
width: 100%!important;
margin-left: 0px!important;
margin-right: 0px!important;
margin-top: -10px!important;
}
Ce code est configuré pour que votre image colle au bords de droite, de gauche et du haut de votre forum, vous pouvez bien sur les modifier. Le "margin-top: -10px" sert à monter l'image en haut pour la rétrécir si vous le souhaiter.
Repérer une fois de plus la ligne suivante que Amaziel vous as fait installer dans l' Overall_hearder :
- Code:
<table style="position: fixed; left: 0px; top: 0px; right: 0px; background-color: #000000; z-index:1000; width: 100%; border-bottom:1px solid #5E4036;" ><tr><td><center>{GENERATED_NAV_BAR}</center></td></tr></table>
et remplacer le par celui-ci :
- Code:
<TABLE STYLE="POSITION: ABSOLUTE;
LEFT: 0PX;
TOP: 0PX;
RIGHT: 0PX;
BACKGROUND-COLOR: none!important;
Z-INDEX:1000;
WIDTH: 100%;" >
<TR><TD><CENTER>{GENERATED_NAV_BAR}</CENTER></TD></TR>
</TABLE>
Cela devrait donner ceci :
Voila, Voila
Si vous avez la moindre question ou si vous souhaiter une modification a cette petite barre, n'hésitez pas a répondre à ce message, je reviendrait régulièrement vous aider.
Bonne journée à tous