Code pour catégories personnalisées

2 participants

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

Résolu Code pour catégories personnalisées

Message par Sam Gordon-Ledger Dim 12 Déc 2010 - 17:19

Bonsoir à tous ^^

je voudrais savoir si quelqu'un saurait me donner le code pour avoir des categories comme sur ce forum : http://performing-arts.forumactif.com/forum.htm sans l'image (dinosaure^^) et si possible le titre ( WE NEED A SCRIPT sur l'exemple) centrer ?

merci d'avance Smile


Dernière édition par Sam Gordon-Ledger le Ven 17 Déc 2010 - 2:19, édité 1 fois
Sam Gordon-Ledger

Sam Gordon-Ledger
Nouveau membre

Messages : 7
Inscrit(e) le : 09/10/2010

http://www.thehotbadboys.forumgratuit.org
Sam Gordon-Ledger a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour catégories personnalisées

Message par Lixyr Dim 12 Déc 2010 - 20:04

C'est quoi exactement que vous voulez par rapport aux catégories ?
La dernière colonne, aussi, ou juste le cadre rose mais sans le dinosaure ?
Lixyr

Lixyr
Aidactive
Aidactive

Féminin
Messages : 7381
Inscrit(e) le : 22/07/2010

https://forum.forumactif.com
Lixyr a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour catégories personnalisées

Message par Sam Gordon-Ledger Dim 12 Déc 2010 - 21:32

Bonsoir ^^

je voudrais juste le titre en rose, le cadre sans le dinosaure et les onglet en dessous Smile
j'ai entouré ce que je veux sur la capture ce sera peut être plus facile à comprendre ^^
Code pour catégories personnalisées ScreenShot004

merci à vous Smile
Sam Gordon-Ledger

Sam Gordon-Ledger
Nouveau membre

Messages : 7
Inscrit(e) le : 09/10/2010

http://www.thehotbadboys.forumgratuit.org
Sam Gordon-Ledger a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour catégories personnalisées

Message par Sam Gordon-Ledger Mar 14 Déc 2010 - 19:38

UP Smile
Sam Gordon-Ledger

Sam Gordon-Ledger
Nouveau membre

Messages : 7
Inscrit(e) le : 09/10/2010

http://www.thehotbadboys.forumgratuit.org
Sam Gordon-Ledger a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour catégories personnalisées

Message par Lixyr Mer 15 Déc 2010 - 18:24

Bonsoir.


Bon alors, dans l'ordre.

Pour le moment je m'occupe des titre des forums et du cadre.



1) Les titres des forums


On peut les modifier via le css, avec ce code :

Code:
.forumlink {}

Il faut ensuite rentrer les codes entre les deux crochets.
Hum alors vous, apparemment, vous voulez modifier la taille et la couleur, c'est ça ?

Ça se passe comme ça :

font-size: 16px;
color: black;

Les valeurs que vous pouvez modifier sont en rouge.
  • font-size correspond à la taille du titre

  • color à sa couleur



Donc vous rentrez ceci, et ensuite vous enregistrez. Si pour la couleur, ça ne marche pas, essayez ceci :
color: black ! important;[/quote]



1) Les cadres

Vous pouvez en faire par modification manuelle via la description des forums, ou par modification de template. C'est comme vous voulez, en sachant que par modification de template, toutes les descriptions de forum seront ainsi, avec leur cadre.

Alors d'une part, j'espère que vous êtes en Phpbb2.
Ensuite, si jamais vous voulez faire par template (c'est plus pratique disons), il faudrait que vous me disiez si vous avez déjà apporté une modification du template index_box, et si c'est le cas, me le poster, avec le css qui va avec.



On verra ensuite pour les sous forums en onglet. ^^
Lixyr

Lixyr
Aidactive
Aidactive

Féminin
Messages : 7381
Inscrit(e) le : 22/07/2010

https://forum.forumactif.com
Lixyr a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour catégories personnalisées

Message par Sam Gordon-Ledger Mer 15 Déc 2010 - 18:47

Bonsoir^^

merci pour le premier code ^^

le soucis c'est qu'en effet je ne suis pas en Phpbb2 mais en 3 Sad ( mauvais choix au départ ) du coup je ne peux rien changer au niveau templates ce qui me gêne pour pas mal de choses. Peut-on changer la version sans tout changer dans le forum?, car mon forum est en construction mais il est quand même bien avancé^^

merci d'avance Smile
Sam Gordon-Ledger

Sam Gordon-Ledger
Nouveau membre

Messages : 7
Inscrit(e) le : 09/10/2010

http://www.thehotbadboys.forumgratuit.org
Sam Gordon-Ledger a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour catégories personnalisées

Message par Lixyr Mer 15 Déc 2010 - 20:16

Il me semble que vous pouvez changer de version.
Regardez dans les sujets, la question a déjà été posée. ^^
Sinon il est certains que vous n'arriverez pas à grand choses dans vos résultats si vous ne passez pas en phpbb2. Smile
Lixyr

Lixyr
Aidactive
Aidactive

Féminin
Messages : 7381
Inscrit(e) le : 22/07/2010

https://forum.forumactif.com
Lixyr a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour catégories personnalisées

Message par Sam Gordon-Ledger Mer 15 Déc 2010 - 20:35

c'est fait ^^

je n'ai fais aucune modif dans les templates ^^

Sam Gordon-Ledger

Sam Gordon-Ledger
Nouveau membre

Messages : 7
Inscrit(e) le : 09/10/2010

http://www.thehotbadboys.forumgratuit.org
Sam Gordon-Ledger a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour catégories personnalisées

Message par Lixyr Jeu 16 Déc 2010 - 20:30

Bon j'ai à peu près réussi à avoir ce que vous voulez.
Mais c'est de l'à peu près, je précise bien.

Alors vous allez dans votre template index_box, que vous modifiez.

Vous cherchez cet endroit :

Code:
<td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle">
         <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
      </td>
      <td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
         <h{catrow.forumrow.LEVEL} class="hierarchy">
            <span class="forumlink">
               <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a><br />
            </span>
         </h{catrow.forumrow.LEVEL}>
         <span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
         <span class="gensmall">
            <!-- BEGIN switch_moderators_links -->
            {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
            <!-- END switch_moderators_links -->
            {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
         </span>
      </td>

On va travailler dans toute cette partie.

1) L'espace entre le titre du forum et le cadre :

Vous avez deux solution mais je vais éviter le CSS :

<h{catrow.forumrow.LEVEL} class="hierarchy"><br>
<span class="forumlink">

On rajouter une balise de retour à la ligne, ici il saute une ligne puisque le retour à la ligne y est déjà. Bon si vous ne voulez pas d'espace entre le titre du forum et le cadre du forum, c'est pas grave vous passez cette étape.

La balise br permet un retour à la ligne. Pour un saut de ligne il faut en mettre deux à la suite (mais comme le retour à la ligne y est déjà ça fait un saut de ligne, comme s'il y avait deux balises)


2) Le cadre de la description.

Pour l'instant on ne s'occupe que du template.

Vous faite ainsi (en couleur les parties que j'ai rajoutées) :

</h{catrow.forumrow.LEVEL}>
<div class="cadrerose" style="margin-left:auto;margin-right:auto;">
<p class="gensmall">{catrow.forumrow.FORUM_DESC}</p></div>

la classe cadrerose sera définie après. C'est le cadre de fond rose. Vous l'appellerez comme vous voudrez ensuite.
margin-left:auto;margin-right:auto; permet de placer le cadre au milieu de la cellule, sinon elle se colle automatiquement au bord gauche de la cellule.


le <p> permet de mettre le contenu du forum dans un paragraphe justifié à gauche. C'est plus esthétique.
la classe gensmall permet que le contenu soit de taille de texte normal, sinon le texte apparait en gros.

(ici j'ai retiré le <span class="genmed"> qui me gênait pour le code, donc il faut que vous enleviez ceci avant de mettre mon code : )

<span class="genmed">{catrow.forumrow.FORUM_DESC}</span>



3) Les sous forums :

Ici vous les voulez à droite, mais pas collé au cadre, il faut faire comme ceci :

<div align="right" style="padding-right:10px;">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</div><br><br>

le div align permet d'aligner le texte, à gauche, à droite, ou au milieu, et le padding permet de mettre une marge entre le contenu et le bord intérieur du cadre demandé (donc ici right: le bord droit)


Donc on en a fini pour le template.

Vous enregistrez maintenant , et direction le CSS.

Affichage >> couleur >> feuille de style css :

Vous mettez ceci dans vos code :

Code:
.cadrerose {border:1px solid pink; background-color:pink; -moz-border-radius: 18px 18px 0px 18px;
-webkit-border-radius: 18px 18px 0px 18px;
border-radius: 18px 18px 0px 18px;width:550px;}

.cadreolive {border:1px solid green; background-color:green; -moz-border-radius: 18px 18px 0px 18px;
-webkit-border-radius: 18px 18px 0px 18px;
border-radius: 18px 18px 0px 18px;width:550px;}

cadrerose permet de coder le cadre à fond rose, et le cadreolive le cadre des sous forums à fond vert (je les ai appelé ainsi pour que vous repériez mieux)

Alors, border c'est la bordure du cadre.
1px pour l'épaisseur de la bordure (ici de 1), solid pour l'apparence (solid c'est un cadre simple) et pink pour la couleur de la bordure.
background-color c'est la couleur de fond
-moz-border-radius , border-radius et -webkit-border-radius sont les arrondis des cadres. En partant de haut à gauche et en allant dans le sens des aiguilles d'une montre, les valeurs marquent l'arrondis. Plus la valeur est élevée et plus l'arrondis est marqué.


Vous pouvez modifier les valeurs comme vous le voulez. (je parle des valeurs, hein, donc les chiffres et les couleurs, rien d'autre)

Ensuite vous enregistrez.


Ensuite, pour que le cadre s'affiche aussi sur les sous forums, ben va falloir le faire via les sous forums directement, parce que avec le css je ne sais pas, à moins que quelqu'un ne vienne donner un code *.*

Alors direction les sous forums :

général >> catégories et forums :

Vous modifiez un sous forums, ou alors vous l'entourez juste de son span, comme ceci :

<span class="cadreolive"> votre sous forum </span>

Vous enregistrez et vous regardez ce que ça donne. En espérant que ça fasse quelque chose de pas trop crade, comme j'ai fait de l'à peu près.
Mais ça, ça pourra s'arranger en fignolant. L'inconvénient des "je veux comme ce forum" c'est qu'on ne peut faire que de l'à peu près...

Voilà voilà.
Lixyr

Lixyr
Aidactive
Aidactive

Féminin
Messages : 7381
Inscrit(e) le : 22/07/2010

https://forum.forumactif.com
Lixyr a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour catégories personnalisées

Message par Sam Gordon-Ledger Jeu 16 Déc 2010 - 20:49

C'est parfait tout fonctionne !!!!

Merci beaucoup à toi pour ton aide et le temps passé à faire ça Smile vraiment sympa de ta part ^^

bonne soirée à toi .
Sam Gordon-Ledger

Sam Gordon-Ledger
Nouveau membre

Messages : 7
Inscrit(e) le : 09/10/2010

http://www.thehotbadboys.forumgratuit.org
Sam Gordon-Ledger a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour catégories personnalisées

Message par Lixyr Ven 17 Déc 2010 - 1:03

Je vous en prie.

Rien à changé ? Pas d'autres codages ?

Sinon mettez le sujet en résolu qu'il soit archivé. Bonne nuit.
Lixyr

Lixyr
Aidactive
Aidactive

Féminin
Messages : 7381
Inscrit(e) le : 22/07/2010

https://forum.forumactif.com
Lixyr a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour catégories personnalisées

Message par Sam Gordon-Ledger Ven 17 Déc 2010 - 2:19

non c'est bon merci ^^ je met en résolu Smile
Sam Gordon-Ledger

Sam Gordon-Ledger
Nouveau membre

Messages : 7
Inscrit(e) le : 09/10/2010

http://www.thehotbadboys.forumgratuit.org
Sam Gordon-Ledger a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum