Sujets similaires

Sujet: Re: Codage de Catégories (terminé) Ven 18 Jan 2013, 17:20

Pour l'instant, je trouve que la mis en page est super ^^
Merci pour le logiciel, ça va beaucoup m'aider ^^ mais si rajoute des lignes dans mon code, ça agrandit mes cellules :/ C'est pour çà que je colle tout en fait.

J'ai modifié le code en y mettant les variables, tu peux me dire si c'est bon ^^

Code:: <table width="100%">
<tr> <td width="100%"> <div class="contourCates"><div class="contourImgNews"><img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" /> </div> <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}><div class="contourDescription">
<span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
</div>
{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS} </div>
</td>
<td>
<div class="contourDernierMess"><div class="cadreStatistique">{catrow.forumrow.POSTS} messages dans {catrow.forumrow.TOPICS} sujets</div>
<a href="http://rival-gokusen-rpg.forumgratuit.org/" class="postlink" target="_blank" rel="nofollow"><img src="http://i12.servimg.com/u/f12/17/67/18/58/mini_b10.png"></a>
<br/><span class="gensmall">{catrow.forumrow.LAST_POST}</span>
</div>
</td>
</tr>
</table>

Sujet: Re: Codage de Catégories (terminé) Ven 18 Jan 2013, 17:32

C'est parce que tu ne m'écoutes pas et que tu testes ton code dans les messages XD Je t'ai déjà dit au moins trois fois de faire des pages HTML @_@ Panneau d'administration, onglet Modules » Gestion des pages HTML » Créer une nouvelle page (utiliser le haut et le bas de votre forum)

Tiens, pour le coup, je vais attendre que tu le fasses et que tu me donnes le lien de la page HTML ainsi faite è_é

Sujet: Re: Codage de Catégories (terminé) Ven 18 Jan 2013, 17:50

Pourtant c'est ce que je faisais au début, et je n'arrivais pas à visualiser ce que je faisais, je ne comprenais pas :'(

J'ai donc essayé pleins de trucs, vu des trucs horribles, et finalement, j'ai compris que faire VISUALISER, c'était le mal xD Je m'en excuse

Voilà donc le lien de ma page html Smile

http://hurricane-test.forumsgratuits.fr/h1-categories

Sujet: Re: Codage de Catégories (terminé) Ven 18 Jan 2013, 18:02

Ouatch @_@

.contourImgNews doit être en position ABSOLUE et pas relative. Si tu laisse en relatif, comme tu peux le voir, il y a un gros espace qui reste à l'endroit où le bloc aurait dû être placé @_@ Or, ce n'est pas normal.

Une fois que tu l'auras remis en absolu, il te faudra ajouter des marges (avec margin et padding) voire une hauteur (maintenant tu peux) au bloc .contourDescription pour qu'il occupe l'espace "proprement".

Sujet: Re: Codage de Catégories (terminé) Ven 18 Jan 2013, 18:33

Dans le code CSS de .contourImgNews, rajoute la propriété position:relative;

C'est toi qui m'as dit de mettre en relative, mais maintenant, en absolue, le contour rond ne bouge plus, j'ai beau changer mes valeurs, j'ai essayé autant en positif qu'en négatif, et en mettant de gros changement, en enlevant et en remettant le px, rien ne bouge.

Sujet: Re: Codage de Catégories (terminé) Sam 19 Jan 2013, 04:50

Exact, lapsus involontaire x) Mais bon, juste avant j'avais clairement expliqué l'intérêt du positionnement absolu par rapport au positionnement relatif, ça ne t'a pas fait sourciller ?

Le problème vient probablement du fait que tu as écrit position:absolue;... relis bien et tu verras ton erreur.

Sinon, j'ai vu le reste de ton CSS et tu y as placé du code LESS (venant de mon tuto sur le volet glissant) @_@ Tu es au courant que ça ne marchera pas en CSS ?

Sujet: Re: Codage de Catégories (terminé) Sam 19 Jan 2013, 06:51

Hum zut, je voulais essayer et j'ai vu que ça marchait :/
Sur ton tuto, je pensais que le convertir serait seulement pour si tu fais ton truc toi sur le LESS. J'ai mal compris. Il va falloir que je revois çà ^^

Je vais revoir çà et je te dis si je trouve ^^

EDIT: J'ai trouvé, j'ai oublié le t xD et rajouté quelques marges et ça donne ceci:
http://hurricane-test.forumsgratuits.fr/h1-categories

CSS:

Code:: /* CATEGORIES */

.contourImgNews /* cadre pour les images de nouveaux sujets */{
-moz-border-radius:100px;
-o-border-radius:100px;
-webkit-border-radius:100px;
border-radius:100px;
width:70px;
height: 70px;
background-color: #EADAC6;
border: 1px dashed #7A6B54;
position:absolute;
top: -30px;
left: -20px;
}

.hierarchy {
position:absolute;
top : -10px;
left:50px;
margin-left: 20px;
background-color:#D9BE9F;
font-size: 30px;
text-shadow: 1px 1px 1px wheat;
letter-spacing: 5px;
font-family: times new roman;
padding-left: 10px;
padding-right: 10px;
}

.contourCates /* cadre central pour sous forum */ {
text-align: justify;
font-family: times new roman;
letter-spacing: 1px;
position : relative;
border: 2px solid #7A6B54;
-moz-border-radius:10px;
-o-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
}

.contourDescription /* cadre central pour sous forum */ {
-moz-border-radius:0px;
-o-border-radius:0px;
-webkit-border-radius:0px;
border-radius:0px;
width: 90%;
height:90px;
overflow:auto;
background-color: none;
border: 1px dashed #7A6B54;
background-color:#EADAC6;
text-align: justify;
margin: auto;
padding: 3px;
margin-left: 30px;
margin-top: 30px;
}

.contourDernierMess/* cadre qui entoure les derniers messages et le nombre de sujets */ {
-moz-border-radius:10px;
-o-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
width: 200px;
background-color: none;
border: 1px dashed #7A6B54;
}

.cadreStatistique /* cadre interne affichage des derniers sujets */{
-moz-border-radius: 0px;
border-radius: 0px;
-webkit-border-radius: 0px;
border: 1px dashed #7A6B54;
background-color: #EADAC6;
font-size: 10px;
height: ;
color: #7A6B54;
font-family: times new roman;
letter-spacing: 1px;
}

Sujet: Re: Codage de Catégories (terminé) Sam 19 Jan 2013, 07:10

Ça roule ! Je ne vois plus d'erreurs majeures, on s'attaque aux templates ? Rien à ajouter ? Pas de testament à écrire ? @o@ Jusqu'ici, tout va bien ?

Sujet: Re: Codage de Catégories (terminé) Sam 19 Jan 2013, 08:47

Non tout va bien je suis contente de moi j'ai fait un truc super grâce à toi Very Happy

ET J'AI COMPRIIIIS Very Happy

On est go

Sujet: Re: Codage de Catégories (terminé) Sam 19 Jan 2013, 18:04

Bon, on va devoir éditer le template index_box, dont je suppose qu'il n'a pas été modifié pour le moment.

La partie que tu vas devoir éditer est entre les commentaires  et .

Tu peux voir qu'il y a une ligne de tableau (une paire de balises tr) avec un certain nombre de cellules dedans.

On va pas se compliquer la vie, c'est un peu barbare mais supprime toutes les cellules de cette section et remplace les par... une nouvelle cellule, toute seule, avec un attribut rowspan="6" (je crois). En gros, ça revient à fusionner toutes les cellules en une seule qui prend toute la largeur et qui recueillera la mise en page d'un forum telle que tu l'as conçue.

Et puisqu'on en parle... dans cette cellule, tu colles le code que tu as créé @_@

Normalement, ça va pas être joli mais on règlera ça plus tard.

Sujet: Re: Codage de Catégories (terminé) Sam 19 Jan 2013, 18:32

Euh si je l'ai un peu modifié, pour y mettre mon image en haut et en bas de chaque catégorie, ça pose problème? Je peux quand même faire comme tu me dis?

Voilà mon Template:

Code:: <table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
<tr>
   <td valign="bottom">
      
      <span class="gensmall">{LAST_VISIT_DATE}<br />
      {CURRENT_TIME}<br />
      </span>
      
      <div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
   </td>
   <td class="gensmall" align="right" valign="bottom">
      
      <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br />
      <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br />
      
      <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
   </td>
</tr>
</table>
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
<tr><img src="http://i12.servimg.com/u/f12/17/67/18/58/haut10.png">
   <th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>

   <th nowrap="nowrap" width="150"><div style="width:150px;">{L_LASTPOST}</div></th>
</tr>


<tr>
   
   <td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
   
   <td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%">
      <h{catrow.cathead.LEVEL} class="hierarchy">
         <span class="cattitle">
            <a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>
         </span>
      </h{catrow.cathead.LEVEL}>
   </td>
   <td class="{catrow.cathead.CLASS_ROWPIC}" colspan="3" align="right"> </td>
</tr>


<tr>
   
   <td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
   
   <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">
            <table width="100%"><tr><td><a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></td></tr></table><br />
         </span>
      </h{catrow.forumrow.LEVEL}>
      <span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
      <span class="gensmall">
         
         {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
         
         {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
      </span>
   </td>

   <td class="row3 over" align="center" valign="middle" height="50">
<div class="cadreStatistique">{catrow.forumrow.POSTS} messages dans {catrow.forumrow.TOPICS} sujets.<br />
<span class="gensmall">{catrow.forumrow.LAST_POST}</span></div>
</td>
</tr>


<tr>
   
   <td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
   
   <td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
</tr>


</table><img src="http://i12.servimg.com/u/f12/17/67/18/58/bas10.png">

Sujet: Re: Codage de Catégories (terminé) Sam 19 Jan 2013, 18:55

Well, dans la mesure où ton code est faux, je pense que ça ne peut pas être pire (pour rappel, un tableau est constitué de lignes, qui contiennent des cellules. Une ligne ne peut pas contenir AUTRE CHOSE QUE DES CELLULES. En l’occurrence, donc, une image en dehors d'une cellule est de l'ordre de l'erreur grave)

Pour le reste, si tu lis bien le code, tu réaliseras qu'il n'y a pas de raison que ça ne marche pas '_'

Sujet: Re: Codage de Catégories (terminé) Dim 20 Jan 2013, 17:27

Coucou ^^

J'ai donc retiré l'ancien template et remis celui par défaut. C'est bizarre parce que j'avais suivi un tuto sur un forum de graphisme et de codage où j'étais il y a longtemps. :/

Du coup, sur le nouveau, j'ai donc supprimé les cellules, et mis la nouvelle Razz

http://hurricane-test.forumsgratuits.fr/

Template:

Code:: <table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
<tr>
   <td valign="bottom">
      
      <span class="gensmall">{LAST_VISIT_DATE}<br />
      {CURRENT_TIME}<br />
      </span>
      
      <div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
   </td>
   <td class="gensmall" align="right" valign="bottom">
      
      <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br />
      <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br />
      
      <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
   </td>
</tr>
</table>
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
<tr>
   <th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>
   <th nowrap="nowrap" width="50">{L_TOPICS}</th>
   <th nowrap="nowrap" width="50">{L_POSTS}</th>
   <th nowrap="nowrap" width="150"><div style="width:150px;">{L_LASTPOST}</div></th>
</tr>


<tr>
   
   <td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
   
   <td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%">
      <h{catrow.cathead.LEVEL} class="hierarchy">
         <span class="cattitle">
            <a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>
         </span>
      </h{catrow.cathead.LEVEL}>
   </td>
   <td class="{catrow.cathead.CLASS_ROWPIC}" colspan="3" align="right"> </td>
</tr>


<tr>
   <td rowspan="6">
<table width="100%">
<tr> <td width="100%"> <div class="contourCates"><div class="contourImgNews"><img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" /> </div> <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}><div class="contourDescription">
<span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
</div>
{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS} </div>
</td>
<td>
<div class="contourDernierMess"><div class="cadreStatistique">{catrow.forumrow.POSTS} messages dans {catrow.forumrow.TOPICS} sujets</div>
<a href="http://rival-gokusen-rpg.forumgratuit.org/" class="postlink" target="_blank" rel="nofollow"><img src="http://i12.servimg.com/u/f12/17/67/18/58/mini_b10.png"></a>
<br/><span class="gensmall">{catrow.forumrow.LAST_POST}</span>
</div>
</td>
</tr>
</table>
</td>
</tr>


<tr>
   
   <td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
   
   <td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
</tr>


</table><img src="{SPACER}" alt="" height="5" width="1" />

Sujet: Re: Codage de Catégories (terminé) Dim 20 Jan 2013, 17:41

Je... suis... débile. Genre, grave =_=

C'est colspan et pas rowspan. Je vais me pendre parce qu'il m'a fallu genre une minute entière pour tilter un truc aussi évident Codage de Catégories (terminé) - Page 2 825433

Codage de Catégories (terminé) - Page 2 825433

Sujet: Re: Codage de Catégories (terminé) Mer 23 Jan 2013, 10:48

Il est vrai que c'est beaucoup mieux Very Happy

Mais je t'avouerai que j't'ai écouté sans réfléchir xD je suis capout' ce soir Razz

Voià modifié Very Happy

Par contre, du coup je n'ai plus d'image au dessus de ma catégorie ^^
Et j'aimerai bien enlever les colonnes qu'il reste "titre", "sujet", "dernier mesages" ^^

Sujet: Re: Codage de Catégories (terminé) Mer 23 Jan 2013, 13:52

Tu crois que je t'ai pas vu faire ton up déguisé ? èoé C'est mal.

Alors, pour tes deux dernières questions, je vais te renvoyer vers les tutoriels adéquats, ils sont là pour ça après tout !

1 - Fusionner les en-têtes des forums, tu n'auras besoin, évidemment, que de la partie sur les titres.
2 - Mettre un contenu au dessus ou en dessous des catégories

Bon courage :p