2 résultats trouvés pour auteur_Sui

Salutation N'Utopien / N'Utopienne!!!

Ce petit tutoriel vous permettra de placer votre barre de navigation au dessus de la bannière.

Niveau: Facile Aperçu: Ici Fonctionne qu'avec les versions phpbb2 et punbb

Vous êtes sur votre forum c'est bon? Alors commencer à allez sur votre panneau d'administration -> Affichage -> Template : Général -> Entrez dans le template Overall_header.

Descendez vers le bas du code et copiez cette partie du template:

Code:

<table cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}">
               <tr>
                  <td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td>
               </tr>
            </table><br />

Remontez maintenant un peu plus haut et déplacez le code après cette partie:

Code:

<table class="bodylinewidth" width="{T_BODY_TABLE_WIDTH}" cellspacing="0" cellpadding="10" border="0" align="center">
      <tr>
         <td class="bodyline">

Ce qui vous donnera ça:

Code:

<table class="bodylinewidth" width="{T_BODY_TABLE_WIDTH}" cellspacing="0" cellpadding="10" border="0" align="center">
      <tr>
         <td class="bodyline">
            <table cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}">
               <tr>
                  <td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td>
               </tr>
            </table><br>

|!| A noter que j'ai ajouté un saut de ligne

Code:

<br>

à la fin pour qu'il y ait un espace entre la bannière et la barre de navigation.

Et voila!! Une fois le code placé au bon endroit, il ne vous reste plus qu'à valider puis à confirmer la validation en cliquant sur la croix verte


C'est terminé, j'espère que ce tutoriel vous aura aidé et qu'il sera compréhensible pour tous.

Bonne chance .

Autre tuto qui va avec celui-ci:

[CSS] Barre de navigation

Bonjour, Bonsoir, Salut, Yo, enfin voila x).

Après mainte recherche je vois qu'aucun tuto n'a été poster sur la barre de navigation fait uniquement pas CSS, alors je me lance pour vous l'expliquez.

Niveau: Facile Aperçu: Ici Tuto by Sui'

Alors nous allons commencer par le commencement logique :p.

Allez dans votre Panneau d'Administration -> Affichage -> En-tête et Navigation :

- Afficher seulement des images dans la barre des liens : Cocher Non
- Position du menu: Centrer
- Forcer la barre de navigation à rester sur une ligne : Cocher Oui

Enregistrez

Ensuite allez dans Affichage -> Couleur -> Feuille de Style

Mettez ce code à l'intérieur:

Code:

a.mainmenu img {
display:none;
}

a.mainmenu{
    text-decoration:none;
        padding: 1px 1px;
        margin: 0px;
        background: #Couleur;
        color: #000;
        border: 1px solid #Couleur;
}

Padding est la marge entre le texte et le cadre, le premier chiffre donnera l'espace entre le haut et le bas , alors que le second donnera l'espace à gauche et à droite.

Margin est l'espace entre tous les cadres, à vous de mettre la taille souhaiter.

Background est la couleur de fond de la cellule, à vous de mettre le code couleur voulu.

Color signifie la couleur du texte.

Border signifie la bordure sur le coup j'ai directement mis l'épaisseur de la bordure le style et la couleur, à vous de l'adaptez par la suite.


Maintenant nous allons rajouter un code qui changera l'aspect de la cellule au passage de la souris (Non obligatoire)

Code:

a:hover.mainmenu{
    text-decoration:none;
        padding: 1px 1px;
        margin: 0px;
        background: #000;
        color: #FFF;
        border: 1px solid #FFF;
}

Je n'est seulement changer que les couleurs, une nouvelle fois à vous de l'adaptez .

Maintenant comme je me doute vous avez tous cette barre de navigation coller à la publicité pour l'espacer il vous suffit juste de mettre ce code :

Code:

#page-body {
margin-top:15px;
}

A vous de modifier le nombre selon l'espace que vous voulez.

N'oubliez pas de Valider

Pour avoir des codes couleurs rendez vous sur le tuto de Mao : [url=/forumactif-f51/pour-mettre-un-peu-de-couleur-aux-forumsd-t11664.htm]Ici[/url]

Et oui c'est déjà fini x), j'espère que se tutoriel vous aura aider.

Si vous voyez des fautes ( doit y en avoir :o) et si vous avez des questions n'hésiter pas :).