| urgent pour ouverture de forum aujourd'huis ou demain. | |
|
|
Marjo
{ Membre }
Messages : 27
| Bonjour, je ne sait pas si je suis au bon endroit, si ce n'est pas le cas je m'en excuse ! voilà pour mon forum rpg j'aurais besoin de quelque modifs que je n'arrive pas à faire : http://secret-society.forumgratuit.org/ - j'aimerais mettre un onglet à gauche à la place des catégorie, je sait qu'il faut faire une image de base avec photoshop mais je ne sait pas ou et comment la mettre cette image. exemple d'onglet : http://02141-cambridge.keuf.net/ - et j'aimerais un QEEL comme tout bon forum rpg comme celui de cambridge mais ce n'est pas du copiage car tout les forums rpg ont ce QEEL et puis ce sont les premiers à m'aider pour le css de mon forum, c'est grâce à eux pour l'image map ;-) merci mille fois d'avance pour votre aide ! Couleur de titre supprimée par Orange. |
Dernière édition par Marjo le Mar 26 Oct 2010, 07:07, édité 1 fois | |
|
| |
Marjo
{ Membre }
Messages : 27
| bonjour, je sait que vous avez beaucoup de travail ? mais pouvez vous m'aidez le plus vite possible car il me manque plus que ces deux choses pour réouvrir mon forum. | | |
|
| |
Invité Invité
| Bonjour ^^ Je tiens à te signaler que les UP sont genre super interdit sur ce forum x') Il te faut avoir les droits de fondation pour faire ce qui est à la suite ^^ Tu vas dans : Panneau d'administration - Affichage - Template - Général - INDEX BOX . Tu fais CTRL + F, pour faire une recherche plus rapide de : - Code:
-
<th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th> Que tu remplaces par : - Code:
-
<div style="background-image : url(TON LIEN) ; background-repeat : no-repeat ; width : LARGEUR IMGpx ; height : HAUTEUR IMGpx"><div class="catég">{catrow.tablehead.L_FORUM}</div></div> Valide ton template & publie-le Puis du côté du CSS : - Code:
-
.catég { text-align : center ; position : relative ; top : XXpx ; left : XXpx ; } | | |
|
| |
Marjo
{ Membre }
Messages : 27
| oup's désolé je ne savait pas, je pensais que c'était autorisé tant qu'on en abusé pas :-s désolé.
en tout cas merci pour l'onglet je vais voir ça et je te dit après ;-) | | |
|
| |
Marjo
{ Membre }
Messages : 27
| j'ai fait comme tu à dit mais ça fait pas du tout ça. l'image n'apparaît pas et en plus le titre "derniers messages" de la dernière colonnes est passé au dessus des images news-no news-lock. capture : - Spoiler:
et mon image : - Spoiler:
je pense qu'il faut retirer la barre "derniers messages" | | |
|
| |
Invité Invité
| Euh ._. C'est bizarre, toutes les personnes qui s'en on servit avant, n'ont jamais eu ce problème. Mais l'image devrait au moins s'afficher x_x" ....
Peux-tu me montrer ton CSS et ton morceau de template ? | | |
|
| |
Marjo
{ Membre }
Messages : 27
| voici mon morceau de template index_box : - Code:
-
<div style="background-image : url(http://www.hostingpics.net/viewer.php?id=766267onglet_copie.jpg) ; background-repeat : no-repeat ; width : 317px ; height : 54px"><div class="catég">{catrow.tablehead.L_FORUM}</div> mon css, que j'ai placé tout à la fin. : - Code:
-
.catég { text-align : center ; position : relative ; top : 5px ; left : 5px ; } | | |
|
| |
Marjo
{ Membre }
Messages : 27
| tout remarche bien , il fallait juste mettre le lien directe ;-) et pour la colone "derniers messages" c'était la ligne du dessous à retirer.
ceci dit le titre des catégorie sont au dessus des onglets et non dessus, comment fait t'ont pour baisser le titre. | | |
|
| |
Invité Invité
| Peux-tu montrer ton résultat =p ? | | |
|
| |
Marjo
{ Membre }
Messages : 27
| voici la capture : et j'aimerais bien aussi que la deuxième colonnes ne soit pas écraser mais soit plus de forme carré ou rectangle. | | |
|
| |
Invité Invité
| As-tu pensé à faire varier cette valeur : top : 5px ; ?
Nous pouvons, bien entendu, partir dans le négatif ^o^
Ensuite, niveau esthétique je te conseillerais de mettre une bordure autour de ton forum, de la même couleur que celle de ton image ^o^
Et pour la colonne, il me faudrait ton template que je t'explique ceci avec tes codes à toi, et qu'on plante pas tout en si bon chemin ^^ | | |
|
| |
Marjo
{ Membre }
Messages : 27
| en effet il fallait changer "top : 0px" pour moi en "top : 35px" pour la bordure elle est déjà de la même couleur que mon image mais le soucis c'est que je travaille sur un mac mais que mon logiciel photoshop est sous windows grace au logiciel vmware et quand je passe de windows a mac sur ce même macbook la couleur change de peu. voici le template index-box de mon forum : - Spoiler:
- Code:
-
<table width="100%" border="0" cellspacing="1" cellpadding="0" align="center"> <tr> <td valign="bottom"> <!-- BEGIN switch_user_logged_in --> <span class="gensmall">{LAST_VISIT_DATE}<br /> {CURRENT_TIME}<br /> </span> <!-- END switch_user_logged_in --> <div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div> </td> <td class="gensmall" align="right" valign="bottom"> <!-- BEGIN switch_user_logged_in --> <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br /> <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br /> <!-- END switch_user_logged_in --> <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a> </td> </tr> </table> <!-- BEGIN catrow --><!-- BEGIN tablehead --><table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0"> <tr> <div style="background-image : url(http://img7.hostingpics.net/pics/928070onglet.png) ; background-repeat : no-repeat ; width : 317px ; height : 54px"><div class="catég">{catrow.tablehead.L_FORUM}</div> </tr> <!-- END tablehead --> <!-- BEGIN cathead --> <tr> <!-- BEGIN inc --> <td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td> <!-- END inc --> <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> <!-- END cathead --> <!-- BEGIN forumrow --> <tr> <!-- BEGIN inc --> <td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td> <!-- END inc --> <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"><div class="descriptions-categories">{catrow.forumrow.FORUM_DESC}</div></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> <!-- BEGIN forum_link_no --> <td class="row3 over" align="center" valign="middle" height="50"> <span class="gensmall">{catrow.forumrow.LAST_POST}</span> </td> <!-- END forum_link_no --> <!-- BEGIN forum_link --> <td class="row3" colspan="3" align="center" valign="middle" height="50"><span class="gensmall">{catrow.forumrow.forum_link.HIT_COUNT}</span></td> <!-- END forum_link --> </tr> <!-- END forumrow --> <!-- BEGIN catfoot --> <tr> <!-- BEGIN inc --> <td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td> <!-- END inc --> <td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td> </tr> <!-- END catfoot --> <!-- BEGIN tablefoot --> </table><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->
| | |
|
| |
Invité Invité
| Alors, alors, tu peux remplacer ton template par ceci : - Code:
-
<table width="100%" border="0" cellspacing="1" cellpadding="0" align="center"> <tr> <td valign="bottom"> <!-- BEGIN switch_user_logged_in --> <span class="gensmall">{LAST_VISIT_DATE}<br /> {CURRENT_TIME}<br /> </span> <!-- END switch_user_logged_in --> <div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div> </td> <td class="gensmall" align="right" valign="bottom"> <!-- BEGIN switch_user_logged_in --> <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br /> <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br /> <!-- END switch_user_logged_in --> <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a> </td> </tr> </table> <!-- BEGIN catrow --><!-- BEGIN tablehead --><table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0"> <tr> <div style="background-image : url(http://img7.hostingpics.net/pics/928070onglet.png) ; background-repeat : no-repeat ; width : 317px ; height : 54px"><div class="catég">{catrow.tablehead.L_FORUM}</div> </tr> <!-- END tablehead --> <!-- BEGIN cathead --> <tr> <!-- BEGIN inc --> <td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td> <!-- END inc --> <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> <!-- END cathead --> <!-- BEGIN forumrow --> <tr> <!-- BEGIN inc --> <td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td> <!-- END inc --> <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="80%" 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"><div class="descriptions-categories">{catrow.forumrow.FORUM_DESC}</div></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> <!-- BEGIN forum_link_no --> <td class="row3 over" align="center" valign="middle" height="50" width="20%> <span class="gensmall">{catrow.forumrow.LAST_POST}</span> </td> <!-- END forum_link_no --> <!-- BEGIN forum_link --> <td class="row3" colspan="3" align="center" valign="middle" height="50"><span class="gensmall">{catrow.forumrow.forum_link.HIT_COUNT}</span></td> <!-- END forum_link --> </tr> <!-- END forumrow --> <!-- BEGIN catfoot --> <tr> <!-- BEGIN inc --> <td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td> <!-- END inc --> <td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td> </tr> <!-- END catfoot --> <!-- BEGIN tablefoot --> </table><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->
& si les tailles ne te convienne pas, il y a ces deux choses à modifier : - Code:
-
<td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="80%" height="50"> La valeur 80%, qui indique ici, la largeur de la partie de droite ( le titre du forum, la description, etc ) Et ensuite : - Code:
-
<td class="row3 over" align="center" valign="middle" height="50" width="20%> La valeur 20%, que tu souhaitais donc élargir ^^ L'idée serait donc que les deux valeur additionnée, soit égale à 100% Voilà n_n Si tu as d'autres questions, n'hésite pas ^o^ & Si ce n'est pas le cas, n'oublie pas de mettre Résolu à ton sujet =) | | |
|
| |
Marjo
{ Membre }
Messages : 27
| super merci ! la longeur me va parfaitement c'est juste la taille du texte et la police je voudrait la même que dans la description car sinon ça fait bizzare. et j'aimerais bien qu'il y ai le même contour également en pointillé noire.
et sinon j'ai un soucis avec mon qeel en onglet que je t'expliquerais une fois le soucis de la taille et police réglé ;-)
| | |
|
| |
Invité Invité
| Pour la taille, c'est une erreur de ma part ^^' Ma touche avec les guillements ne marche pas très bien, et je n'avais pas remarqué que justement elle n'a pas marché quand j'ai cliqué dessus x') - Code:
-
<table width="100%" border="0" cellspacing="1" cellpadding="0" align="center"> <tr> <td valign="bottom"> <!-- BEGIN switch_user_logged_in --> <span class="gensmall">{LAST_VISIT_DATE}<br /> {CURRENT_TIME}<br /> </span> <!-- END switch_user_logged_in --> <div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div> </td> <td class="gensmall" align="right" valign="bottom"> <!-- BEGIN switch_user_logged_in --> <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br /> <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br /> <!-- END switch_user_logged_in --> <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a> </td> </tr> </table> <!-- BEGIN catrow --><!-- BEGIN tablehead --><table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0"> <tr> <div style="background-image : url(http://img7.hostingpics.net/pics/928070onglet.png) ; background-repeat : no-repeat ; width : 317px ; height : 54px"><div class="catég">{catrow.tablehead.L_FORUM}</div> </tr> <!-- END tablehead --> <!-- BEGIN cathead --> <tr> <!-- BEGIN inc --> <td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td> <!-- END inc --> <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> <!-- END cathead --> <!-- BEGIN forumrow --> <tr> <!-- BEGIN inc --> <td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td> <!-- END inc --> <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="80%" 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"><div class="descriptions-categories">{catrow.forumrow.FORUM_DESC}</div></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> <!-- BEGIN forum_link_no --> <td class="row3 over" align="center" valign="middle" height="50" width="20%"> <span class="gensmall">{catrow.forumrow.LAST_POST}</span> </td> <!-- END forum_link_no --> <!-- BEGIN forum_link --> <td class="row3" colspan="3" align="center" valign="middle" height="50"><span class="gensmall">{catrow.forumrow.forum_link.HIT_COUNT}</span></td> <!-- END forum_link --> </tr> <!-- END forumrow --> <!-- BEGIN catfoot --> <tr> <!-- BEGIN inc --> <td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td> <!-- END inc --> <td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td> </tr> <!-- END catfoot --> <!-- BEGIN tablefoot --> </table><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow --> Pour les pointillés, je pense qu'il suffira d'entourer ceci : - Code:
-
<span class="gensmall">{catrow.forumrow.LAST_POST}</span> par : - Code:
-
<div class="descriptions-categories"> </div> Mais tout dépendra de la configuration de ton CSS. SI tu as des problèmes, il faudra me montrer cette class de ton CSS n_n Pas de soucis ^^ Au pire tu pourras l'ouvrir dans un nouveau sujet pour te pas tout mélanger =) | | |
|
| |
Marjo
{ Membre }
Messages : 27
| parfait pour l taille du texte ! pour le contour ça marche en effet mais du coup les endroit ou il y a pas de message sa fait un rectangle en pointillé ecrassé, presque un trait et j'aimerais bien que ça soit la même taille que sur la description des catégories voici la capture pour que tu voit ce que ça donne : - Spoiler:
et voici le code css des pointillé, il me semble que c'est celui là, mais j'ai un doute: - Code:
-
.descriptions-categories { font-size: 10px; color: #991F00; line-height: 125%; background-color: #F2D9BA; border: #000000; border-style: solid; border: 1px #000000 dotted; border-left-width:1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px}
.catég { text-align : center ; position : relative ; top : 35px ; left : 0px ; }
| | |
|
| |
Invité Invité
| Il y a quelques erreurs, ou chose inutile dans ton code, que je te corrige de suite ^o^ Et je t'ai rajouté un HEIGHT ( hauteur ) dont il faudra rajouter une valeur, qui restera donc identique ^^ - Code:
-
.descriptions-categories { height : XXpx ; /* La hauteur de tes descriptions ! */ font-size: 10px; color: #991F00; line-height: 125%; background-color: #F2D9BA; border: 1px #000000 dotted; }
Petit aparté : Si, un jour, l'une de tes descriptions dépasse cette hauteur, tu peux rajouter soit, directement dans ton CSS, un overflow : auto ; mais alors, l'ascenseur fera descend autant ton texte que ton image. Soit - la deuxième solution, que je te conseille - c'est d'allez modifier dans ta description trop longue ta div ^^ Tu as quelque chose qui ressemble à ceci : - Code:
-
<div class="descriptions-catégories"> <table> <tr><td><IMG SRC="URL IMAGE" /></td><td> Ta description </td></tr></table> </div> Avec la modification, cela donnerai cela : - Code:
-
<div class="descriptions-catégories"> <table> <tr><td><IMG SRC="URL IMAGE" /></td><td><DIV STYLE="height : xxpx ; overflow : auto"> Ta description</DIV> </td></tr></table> </div> Sait-on jamais, c'est une astuce comme une autre, qui te permettra peut-être un jour ne te pas t'arracher les cheveux ^w^ | | |
|
| |
Marjo
{ Membre }
Messages : 27
| merci pour l'astuce ça peut être utile en effet lol. il me reste encore quelque modif avec ce cadre car du coup les ecritures sont en haut du cadre collé, il serait plus esthétique que ça soit au milieu et que le cadre soit légérement descendue pour être parfaitement à la même hauteur que le cadre de la description . voici ce que ça donne : - Spoiler:
| | |
|
| |
Invité Invité
| Là, il faudra simplement ajouter un saut de ligne dans ton template ^o^ | | |
|
| |
Marjo
{ Membre }
Messages : 27
| je le met ou ce saut de ligne ? comment ont retranscrit un saut de ligne en langage html / css ? | | |
|
| |
Invité Invité
| Juste avant ceci : - Code:
-
<span class="gensmall">{catrow.forumrow.LAST_POST}</span> Tu laisse un : - Code:
-
<BR/> | | |
|
| |
Marjo
{ Membre }
Messages : 27
| parfait ! le trexte est au milieu ! mais pour baisser le cadre en pointillé noire au même niveau que le cadre en pointillé noire de la description comment fait-ont ? | | |
|
| |
Invité Invité
| Un ou deux autres saut de ligne avant la division ? | | |
|
| |
Marjo
{ Membre }
Messages : 27
| tu va dire que je suis nul mais c'est quoi la division ? | | |
|
| |
Invité Invité
| Tu mets tes sauts de lignes juste avant ceci : - Code:
-
<div class="descriptions-categories">
DIV = Division :p Désolée x= | | |
|
| |
Contenu sponsorisé
| |
| |
| urgent pour ouverture de forum aujourd'huis ou demain. | |
|