Forumactif - Mettre des liens vers les sous-forums et les styler
Bonjour
Aujourd'hui, on va voir comment ajouter les liens des sous-forums de chaque forum dans son cadre sur la page principale. Et puisqu'on n'est pas des bêtes, on va faire ça joliment
Étape 1 : Ajout des liensPour ajouter les liens en page principale, il faut commencer par aller dans le panneau d'administration du forum, onglet Général, partie Catégories et forums.
Et on modifie un de ces forums, qui contient un ou plusieurs sous-forum(s).
Dans la description, on va ajouter un code de la forme suivante :
- Code:
-
<div align="right">
<a class="nom_css" href="lien-vers-sous-forum">Nom du sous-forum</a>
<a class="nom_css" ... </a>
</div>
Commentaires sur le code :La valeur de 'align' par défaut est left, donc si vous voulez aligner à gauche, cette option peut être retirée. L'autre valeur possible est 'center'.
L'attribut 'class' du lien (a) sera celui de votre choix, il vous permettra de donner du style à vos liens, ce que l'on verra dans la deuxième étape.
Le lien-vers-sous-forum est en revanche bien déterminé. Vous devez mettre le vrai lien, quand vous êtes sur la page de ce sous-forum, quand vous voyez la liste des sujets qu'il contient.
Par exemple sur Sims Artists, dans Demande et Dépôt de tuturiel, le lien vers le sous-forum Dépôt de tutoriels est
http://www.sims-artists.com/f28-depot-de-tutorielsEt vous répétez cela autant de fois qu'il y a de sous-forums, et ce dans chaque forum qui en contient.
C'est laborieux et cela peut demander pas mal de travail si le forum est grand et contient beaucoup de sous-forums.
Étape 2 : Donnons du styleCette étape est la plus marrante, et aussi la plus courte.
Si vous voulez que votre forum soit uniforme et rende bien, il vaut mieux que tous les liens aient le même style. Donc normalement, vous avez donné la même classe à chaque lien, et ce style n'aura donc besoin d'être défini qu'une seule fois.
Pour ajouter ce code, on va aller dans l'onglet Affichage du panneau d'administration, partie couleur, onglet Feuille de style CSS.
On ajoute :
- Code:
-
.nom_css{}
a.nom_css:hover{}
Dans les accolades du premier, on met les attributs CSS avec les valeurs que l'on souhaite pour le style permanent des liens.
Dans le deuxième on met le style que l'on veut au survol du lien.
Si vous avez des connaissances en CSS, amusez-vous !
Sinon, vous pouvez consulter mes autres tutoriels, qui contiennent quelques codes, exemples et explications sur les CSS.
Et puis je vais vous concocter un petit tuto consacrés aux attributs CSS je sens ...
Je vous mets un petit exemple, avec ce que ça donne :
- Code:
-
.sforum{
color: #838383;
background-color : #dbe6f4;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
font-size: 12px;
padding: 2px 5px;
}
a.sforum:hover{
color: #bb536e;
background-color : #dbe6f4;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
font-size: 13px;
padding: 2px 5px;
}
Le résultat :