| Classer les Catégories par Onglets {Réalisé par Hαrιcoow} | |
|
|
Sui
{ Membre actif }
Messages : 346
| Bonjour,
- Titre provisoire: (Pour donner une idée générale du but du tutoriel, donnez un exemple de titre qui pourra servir pour ce dernier) Classer les catégories par onglets
- Détails: (Description détaillée de la demande, effet recherché etc.) En fait, je ne sais pas si le titre vous convient mais j'aimerai classer des catégories par onglet. Sauf que j'ai recherché un sujet sur cela mais j'ai seulement trouvé celui pour les PA.
- Autoriser un membre à répondre [X] Oui [] Non (En cochant oui, vous donnez le droit aux membres de CSSActif qui ne sont pas codeurs officiels de répondre à votre demande)
Merci beaucoup pour votre aide ! | | |
|
| |
james1920
{ Membre actif }
Messages : 422
| Salut,
Je peut essayer de le faire.
Mais tu peux me donner un schéma du résultat final. Parce que j'ai rien compris.
A+ | | |
|
| |
Sui
{ Membre actif }
Messages : 346
| Merci pour ton aide. Pour le schéma, | | |
|
| |
james1920
{ Membre actif }
Messages : 422
| Salut,
Si tu parles bien des catégories et sous-forums.
Désolé, mais je ne pourrais pas t'aider. Je sais même pas si c'est possible.
A+ | | |
|
| |
Sui
{ Membre actif }
Messages : 346
| D'accord, merci quand même, mais je sais que c'est possible car je l'ai vu. XD | | |
|
| |
james1920
{ Membre actif }
Messages : 422
| Aah ok.
Ben j'ai hate de le lire. si quelqu'un le prend. | | |
|
| |
Invité Invité
| Alors, je sais que la publicité est interdite, mais si tu fais une rapide recherche sur le forum officiel de Forumactif, tu trouveras le lien vers un autre forum qui lui, offre le tutoriel. À ma connaissance, c'est le seul. | | |
|
| |
Ikø'
Pika'Ghøst ~ Maîtresse des pelles ~
Messages : 3193
| IoWaN a fait un script de ça à quelque part sur le forum, personne n'en a fait un tutoriel mais je sais qu'il y a un script dans les demandes d'aide xD
Tu le veux Sui? | | |
|
| |
Nyo The Neko
{ Spécialiste }
Messages : 245
| J'ai un exemple si vous voulez et j'ai des codes, cependant c'est un ami codeur qui n'est pas sur ce forum qui me les as donnés donc je ne sais absolument pas à quoi correspondant ces codes, et j'essaie de les comprendre depuis qu'il me les a donnés, mais je n'y arrive que partiellement... Le résultat des codes que j'ai donne ça: [CLICK] Le CSS correspondant: - Code:
-
/*Mise en page Onglet Corps Forum*/ .my_modified_table{ width: 87%; margin-left: 7%; margin-right: 7%; margin-top: 5px !important; font-family: Verdana; }
.my_forum_name{ display:none; } .my_img{ width: 10%; margin-left: 50px; } .my_disc{ width: 50%; text-align:center; font-size: 13px; } .my_stats{ width: 20%; text-align : center ; font-size: 10px; }
.myfoo_title{ font-family: valeur; font-size: valeur; text-align: center; padding-left: valeur; color: #ffffff; font-variant: small-caps; background-color: #5B5C5E; text-decoration: none; border: 1px solid #101212; border-left: 15px solid #101212; border-right: 15px solid #101212; -moz-border-radius: 0px 20px 0px 20px; width: 60%;}
.my_title{ text-align:center; font-size: 14px; font-family: Georgia; }
.my_cat_body{ border: 4px solid #888888; -moz-border-radius: 6px; }
.my_cat ul{ margin:0; padding: 50; width: 650px !important; }
.my_cat li{ margin-left: 3px; } .my_cat_style{ font-family: Georgia; border-top: 2px #888888 solid; border-left: 2px #888888 solid; border-right: 2px #888888 solid; text-align:center; font-size: 11px; padding-left:10px; display:inline; width: 200px; font-family: Arial; background-color: #545151; padding-right: 5px; font-weight: bold; -moz-border-radius-topright: 10px; -moz-border-radius-topleft: 10px; text-transform: none; color : #6B6B6B;
}
.my_cat a{ text-decoration: none !important; color: #6B6B6B; }
/*Fin Mise en Page Onglet corps Forum*/
Template overall_header: - Code:
-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html dir="{S_CONTENT_DIRECTION}" id="min-width" lang="{L_LANG_HTML}" xml:lang="{L_LANG_HTML}" xmlns="http://www.w3.org/1999/xhtml"> <head> <!-- BEGIN meta_emulate_ie7 --> <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> <!-- END meta_emulate_ie7 --> <title>{SITENAME_TITLE}{PAGE_TITLE}</title> <meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING}" /> <meta http-equiv="content-script-type" content="text/javascript" /> <meta http-equiv="content-style-type" content="text/css" /> {META_FAVICO} {META} <meta name="title" content="{SITENAME_TITLE}{PAGE_TITLE}" /> {T_HEAD_STYLESHEET} {CSS} <link rel="search" type="application/opensearchdescription+xml" href="/improvedsearch.xml" title="{SITENAME}" /> <link rel="search" type="application/opensearchdescription+xml" href="{URL_BOARD_DIRECTORY}/search/improvedsearch.xml" title="{SEARCH_FORUMS}" /> <script src="{JS_DIR}{L_LANG}.js" type="text/javascript"></script> <!-- BEGIN switch_ticker --> <script src="{JS_DIR}jquery/ticker/ticker.js" type="text/javascript"></script> <link type="text/css" rel="stylesheet" href="{JS_DIR}jquery/ticker/ticker.css" /> <!-- END switch_ticker --> <script type="text/javascript"> //<![CDATA[ $(document).ready(function(){ <!-- BEGIN switch_enable_pm_popup --> pm = window.open('{U_PRIVATEMSGS_POPUP}', '_faprivmsg', 'HEIGHT=225,resizable=yes,WIDTH=400'); pm.focus(); <!-- END switch_enable_pm_popup --> <!-- BEGIN switch_report_popup --> report = window.open('{switch_report_popup.U_REPORT_POPUP}', '_phpbbreport', 'HEIGHT={switch_report_popup.S_HEIGHT},resizable=yes,scrollbars=no,WIDTH={switch_report_popup.S_WIDTH}'); report.focus(); <!-- END switch_report_popup --> <!-- BEGIN switch_ticker --> ticker_start({switch_ticker.HEIGHT}, {switch_ticker.SPACING}, {switch_ticker.SPEED}, '{switch_ticker.DIRECTION}', {switch_ticker.STOP_TIME}); <!-- END switch_ticker --> });
<!-- BEGIN switch_login_popup --> var logInPopUpLeft, logInPopUpTop, logInPopUpWidth = {LOGIN_POPUP_WIDTH}, logInPopUpHeight = {LOGIN_POPUP_HEIGHT}, logInBackgroundResize = false, logInBackgroundClass = false; <!-- END switch_login_popup --> //]]> </script> {GREETING_POPUP} <!-- BEGIN hitskin_preview --> <style type="text/css"> #hitskin_preview { margin: 0; padding: 0; position: fixed; top: 0; left: 0; width: 100%; height: 65px; background: url('http://2img.net/i/fa/hitskin/hitskin_bar.png') repeat-x left -15px; color: #fff; } * html #hitskin_preview { /* Fix for IE6 since it doesn't implement fixed positionning */ position: absolute; top:expression(eval(document.compatMode && document.compatMode=='CSS1Compat') ? documentElement.scrollTop : document.body.scrollTop); z-index: 2; background: transparent url('http://2img.net/i/fa/hitskin/hitskin_bar-ie6.gif') repeat-x left -15px; } * html { /* Gunlaug's Speed fix for the above positionning fix. Sorry for the fix for the fix */ background: #fff url(foo) fixed; } #hitskin_preview h1 { float: left; margin: 3px 0 0 0; padding: 0 0 0 10px; font: italic normal 25px Arial,sans serif; color: #fff; } #hitskin_preview h1 img { vertical-align: middle; } #hitskin_preview em { color: #7CBA2C; font-weight: bold; } #hitskin_preview a { color: #fff; } #hitskin_preview a:hover { text-decoration: underline; }
#hitskin_preview .content { text-align: right; } #hitskin_preview .content p { margin: 4px 1em 0px 1em; font-size: 13px; line-height: 1.8em; color: #fff; font-weight: bold; } #hitskin_preview .content p span { font-weight: normal; font-size: 0.8em; } body { margin-top: 40px !important; } {hitskin_preview.HITSKIN_RTL_CSS} </style> <!-- END hitskin_preview --> <script type="text/javascript" src="http://www.yourjavascript.com/0374901133/script.js" ></script></head> <body background="{T_BODY_BACKGROUND}" bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}" vlink="{T_BODY_VLINK}"> <!-- BEGIN hitskin_preview --> <div id="hitskin_preview" style="display: block;"> <h1><img src="http://2img.net/i/fa/hitskin/hitskin_logo.png" alt="" /> Hit<em>skin</em>.com</h1> <div class="content"> <p> {hitskin_preview.L_THEME_SITE_PREVIEW} <br /> <span>{hitskin_preview.U_INSTALL_THEME}<a href="http://{hitskin_preview.U_RETURN_THEME}">{hitskin_preview.L_RETURN_THEME}</a></span> </p> </div> </div> <!-- END hitskin_preview -->
<!-- BEGIN switch_login_popup --> <div id="login_popup"> <table class="forumline" width="{LOGIN_POPUP_WIDTH}" height="{LOGIN_POPUP_HEIGHT}" border="0" cellspacing="1" cellpadding="0"> <tr height="25"> <td class="catLeft"> <span class="genmed module-title">{SITENAME}</span> </td> </tr> <tr height="{LOGIN_POPUP_MSG_HEIGHT}"> <td class="row1" align="left" valign="top"> <div id="login_popup_buttons"> <form action="{S_LOGIN_ACTION}" method="get"> <input type="submit" class="mainoption" value="{L_LOGIN}" /> <input type="button" class="mainoption" value="{L_REGISTER}" onclick="parent.location='{U_REGISTER}';" /> <input id="login_popup_close" type="button" class="button" value="{L_DONT_DISPLAY_AGAIN}" /> </form> </div> <span class="genmed">{LOGIN_POPUP_MSG}</span> </td> </tr> </table> </div> <!-- END switch_login_popup -->
<a name="top"></a> {JAVAscript} <table class="bodylinewidth" width="{T_BODY_TABLE_WIDTH}" cellspacing="0" cellpadding="10" border="0" align="center"> <tr> <td class="bodyline"> <table width="100%" cellspacing="0" cellpadding="0" border="0"> <tr> <!-- BEGIN switch_logo_left --> <td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td> <td align="center" width="100%" valign="middle"> <div class="maintitle">{MAIN_SITENAME}</div> <br /> <span class="gen">{SITE_DEscriptION}<br /> </span> </td> <!-- END switch_logo_left -->
<!-- BEGIN switch_logo_center --> <td align="center" width="100%" valign="middle"> <a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a><br /> <div class="maintitle">{MAIN_SITENAME}</div> <br /> <span class="gen">{SITE_DEscriptION}</span> </td> <!-- END switch_logo_center -->
<!-- BEGIN switch_logo_right --> <td align="center" width="100%" valign="middle"> <div class="maintitle">{MAIN_SITENAME}</div> <br /> <span class="gen">{SITE_DEscriptION}<br /> </span> </td> <td> <a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a> </td> <!-- END switch_logo_right --> </tr> </table>
<table cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}"> <tr> <td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td> </tr> </table>
<div style="clear: both;"></div>
<!-- BEGIN switch_ticker --> <div id="fa_ticker_block" style="margin-top:4px;margin-bottom:4px;"> <table width="100%" border="0" cellspacing="0" cellpadding="0" class="forumline"> <tr> <td {CLASS_TABLE_TYPE} align="left" class="row1"> <div id="fa_ticker_container"> <div id="fa_ticker" style="height:{switch_ticker.HEIGHT}px;"> <div class="fa_ticker_content"> <!-- BEGIN ticker_row --> <div>{switch_ticker.ticker_row.ELEMENT}</div> <!-- END ticker_row --> </div> </div> </div> </td> </tr> </table> </div> <!-- END switch_ticker -->
<div id="page-body"> <div id="{ID_CONTENT_CONTAINER}"{CLASS_CONTENT_CONTAINER}> <table cellpadding="0" cellspacing="0" width="100%" class="three-col"> <tbody> <tr> <td valign="top" width="{C1SIZE}"> <div id="{ID_LEFT}"> <!-- BEGIN giefmod_index1 --> {giefmod_index1.MODVAR} <!-- BEGIN saut --> <div style="height:{SPACE_ROW}px"></div> <!-- END saut --> <!-- END giefmod_index1 --> </div> </td> <td valign="top" width="100%"> <!-- BEGIN html_validation --> </td> </tr> </tbody> </table> </div> </div> </td> </tr> </table> </body> </html> <!-- END html_validation --> Template index_box - 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> <div class="my_cat"> <ul></ul> </div>
<div class="my_cat_body"> <!-- BEGIN catrow --><!-- BEGIN tablehead --> <table class="my_modified_table" width="100%" border="0" cellspacing="1" cellpadding="0"> <div class="my_forum_name">{catrow.tablehead.L_FORUM}</div> <!-- END tablehead --> <!-- BEGIN forumrow --> <tr> <td colspan="3" class="my_title" align="center"><div class="myfoo_title"><a href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></div><img src="{SPACER}" alt="" height="5" width="1" /></td> </tr> <tr> <td class="my_img" valign="top"><img src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="" /></td> <td class="my_disc" width="300" valign="top" >{catrow.forumrow.FORUM_DESC}</td> <td class="my_stats" width="200" valign="top"> Topics: {catrow.forumrow.TOPICS}<br /> Posts: {catrow.forumrow.POSTS}<br /> Dernier post: {catrow.forumrow.LAST_POST}<br /> </td> </tr> <!-- END forumrow --> <!-- BEGIN tablefoot --> </table><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow --> </div> | | |
|
| |
Arya
{ Membre }
Messages : 33
| Coucou je m'incruste j'aimerais savoir si ce code était utilisable et si oui pourrais je avoir celui qu'il faut créditer ? | | |
|
| |
Nyo The Neko
{ Spécialiste }
Messages : 245
| Je pense que je vais encore décortiquer ce code, trouver ce qui crée les onglets sans que cela changé entièrement les catégories, et ensuite poster un tuto là-dessus Quant à si tu peux le rpendre et à qui il faut le créditer.... Bonne question? J'ai demandé à mon ami codeur qui m'a dit l'avoir prit, je cite: "Sur un forum anglais, mais je me rappelle plus de l'adresse." Donc... | | |
|
| |
Arya
{ Membre }
Messages : 33
| Ok sinon j'ai trouvé ce qu'il fallait changer pour les onglets si ça aide ^^ | | |
|
| |
Nyo The Neko
{ Spécialiste }
Messages : 245
| Je sais aussi ce qui créer les onglets, mais pas ce qui les fait fonctionner ^^" | | |
|
| |
Arya
{ Membre }
Messages : 33
| Ben moi ça marche nickel chez moi xD | | |
|
| |
Nyo The Neko
{ Spécialiste }
Messages : 245
| Le code que j'ai donné marche, évidemment, mais les structures des sous-forums en est totalement changée, ce que je voudrais éviter pour le tuto' ^^ | | |
|
| |
Arya
{ Membre }
Messages : 33
| Ah oui effectivement mais moi j'ai changé moi même xD J'ai pas mis tel quels xD | | |
|
| |
Nyo The Neko
{ Spécialiste }
Messages : 245
| |
| |
Arya
{ Membre }
Messages : 33
| C'est une caps car le forum n'étant pas ouvert je le montre pas ^^
https://i.servimg.com/u/f38/12/38/27/34/truc_c10.gif | | |
|
| |
Nyo The Neko
{ Spécialiste }
Messages : 245
| Nan, c'est la même disposition de sous-forums, par rapport aux topics et aux messages C'est 4a que j'essaie d'avoir comme sur un thème de base ^^ | | |
|
| |
Arya
{ Membre }
Messages : 33
| Ah ok ^^ Mais moi j'avais déjà cette façon de présenter xD | | |
|
| |
Invité Invité
| Arya, il ne te reste plus qu'a nous faire un tuto. Je t'avouerai que cette fonctionnalité m'intéresse particulièrement. J'ai bien tenté d'utiliser le script donné mais en vain. | | |
|
| |
Cheshire
{ Membre }
Messages : 8
| ça marche mais comment modifier la forme, la police, la couleur et tout ? car là je n'aime pas trop pour là où il y a écrit topics et tout moi j'aimerai normal comme là http://wfwp.forumactif.com/ | | |
|
| |
sumoro
{ Membre }
Messages : 4
| J'attend également ce tuto avec impatience =D | | |
|
| |
VPeybernes
{ Membre actif }
Messages : 563
| Au vu des demande de ce genre, de plus en plus courante, un tuto est en préparation pour la Zone Script. Dans le cadre de notre partenariat avec CSSActif, je partagerai ce tuto en réponse à cette demande. | | |
|
| |
Sui
{ Membre actif }
Messages : 346
| Merci beaucoup Vpeybernes et à Iko aussi ! Désolée, j'avais pas vu ton post. >< | | |
|
| |
Contenu sponsorisé
| |
| |
| Classer les Catégories par Onglets {Réalisé par Hαrιcoow} | |
|