Vous souhaitez réagir à ce message ? Créez un compte en quelques clics ou connectez-vous pour continuer.


Invité Bienvenu(e) à toi parmi nous !!!
 
AccueilDernières imagesRechercherS'enregistrerConnexion
-39%
Le deal à ne pas rater :
Pack Home Cinéma Magnat Monitor : Ampli DENON AVR-X2800H, Enceinte ...
1190 € 1950 €
Voir le deal

Partagez
 

 Tuto : Lien vers catégories

Voir le sujet précédent Voir le sujet suivant Aller en bas 
AuteurMessage

Matt'
Membre
Matt'
Messages Messages : 77
Liberty'Point Liberty'Point : 8013

Tuto : Lien vers catégories Empty
MessageSujet: Tuto : Lien vers catégories   Tuto : Lien vers catégories EmptyMer 17 Juil - 19:40

Bienvenue sur un petit tutoriel qui va vous permettre de faire ceci (exemple sur mon forum) :
http://crossing-land.forumactif.fr/forum

Pour le voir, il y a un petit menu sur la gauche du forum, et quand vous cliquez, vous tombez juste devant la catégorie, mais on est toujours sur la page d'accueil du forum !!

C'est très facile :

D'abord, nous allons créer un widget personnaliser et faire une liste (en ol) :

Voici le Code Source :
Code:

<div class="NavigationRapide"></br>
<center><h4>Navigation Rapide</h4></center>
<ol align="center">
<li><a href="#Général">Général</a></li>
<li><a href="#Les Jeux">Les Jeux</a></li>
<li><a href="#Coin Détente">Coin Détente</a></li>
</ol></div>

A vous de le personnaliser.

Maintenant, allez dans la section catégorie. Cliquez sur une Catégorie, et mettez une balise "a" avec un attribut "name". Ce qui donne :

Code:
<a name="NomDeVotreCatégorie">NomDeVotreCatégorie</a>

Et quand vous mettez l'attribut "name", là où il y a "NomDeVotreCatégorie", vous le mettez exactement comme le nom de votre catégorie (avec les espaces).

Maintenant, passons au changement du menu :
Code:
<div class="NavigationRapide"></br>
<center><h4>Navigation Rapide</h4></center>
<ol align="center">
<li><a href="#NomDeVotreCatégorie">NomDeVotreCatégorie</a></li>
</ol></div>
.

Maintenant, passons au CSS :
Code:

.NavigationRapide{
  position: fixed;
  left:40;
  border-radius: 20px;
  background-color: #ffcc00;
  border: 1px solid black;
  height: auto;
  width: 140px;
  box-shadow: 4px 4px 12px #000;
}
ol {
  list-style-type: none;
}
//Si vous le voulez, vous pouvez changez et mettre "[i]ul[/i]" au lieu de "[i]ol[/i]".//
ul {
  list-style-type: none;
}


Et voilà, c'est fini ! Ce tuto permet de faire de votre forum un forum, qui semble plus accueillent et codée (comme Never-Utopia).

©Tuto by Matt' de Crossing Land


Dernière édition par Matt' le Mer 17 Juil - 19:49, édité 2 fois
Revenir en haut Aller en bas
http://crossing-land.forumactif.fr/forum

SkySky
Membre
SkySky
Messages Messages : 215
Liberty'Point Liberty'Point : 8134
Age : 53
Localisation : Belgique

Tuto : Lien vers catégories Empty
MessageSujet: Re: Tuto : Lien vers catégories   Tuto : Lien vers catégories EmptyMer 17 Juil - 19:45

Bonsoir,

J'aurais une question ....

Pourquoi mettre ol pour la liste et pas ul par exemple ?

Je sais je chipote pour des détails
Revenir en haut Aller en bas

Matt'
Membre
Matt'
Messages Messages : 77
Liberty'Point Liberty'Point : 8013

Tuto : Lien vers catégories Empty
MessageSujet: Re: Tuto : Lien vers catégories   Tuto : Lien vers catégories EmptyMer 17 Juil - 19:47

Je sais, c'est bête, on peut faire pareil, et mince, j'ai oublié de mettre le code pour qu'il n'y est pas de chiffre ou point à coté de la liste.

Sinon, merci du détail, je m'en charge !

Matt'
Revenir en haut Aller en bas
http://crossing-land.forumactif.fr/forum

Invité
Anonymous

Tuto : Lien vers catégories Empty
MessageSujet: Re: Tuto : Lien vers catégories   Tuto : Lien vers catégories EmptySam 20 Juil - 17:03

Merci beaucoup !! Very Happy
Revenir en haut Aller en bas

Contenu sponsorisé


Tuto : Lien vers catégories Empty
MessageSujet: Re: Tuto : Lien vers catégories   Tuto : Lien vers catégories Empty

Revenir en haut Aller en bas
 

Tuto : Lien vers catégories

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
 :: AIDES AUX FORUMS :: Tutos Codages-