AccueilDernières imagesRechercherS'enregistrerConnexion

Forum de graphisme, codage et game design proposant des tutoriels, astuces, libres services et commandes dans les domaines de l'infographie amateur, de l'intégration web (HTML et CSS essentiellement) ainsi que dans la conception de RPG sur forum.

Le deal à ne pas rater :
Où acheter la display japonaise One Piece Card Game PRB-01 One Piece ...
Voir le deal

    Guide du template "index-box" (catégories) pour phpBB2

    Asmareth
    Asmareth
    FémininAge : 36Messages : 123

    Jeu 22 Aoû 2013 - 12:23

    Rappel du premier message :



    Bonjour,

    Ce guide est sur la version de forum PhpBB2.

    Je me permets de vous proposer un petit mode d’emploi du template index-box, tel que j’aurais bien aimé en trouver un sur internet lorsque j’ai commencé à travailler à la personnalisation de mon template.

    Ce travail ne prétend pas être exhaustif et répondre à tout (car il y a encore des choses qui m’échappent). A ce titre, toutes les contributions pour l’améliorer seront grandement appréciées :). Il a pour objet de mieux aider à comprendre le fonctionnement du template, et donc à mieux comprendre les tutoriels de modification du template qui peuvent vous être proposés (pour éviter les copier coller bêtes et méchants).

    Nous allons voir d’une part les différents éléments structurants de ce template, qui organisent les éléments sur la page. Et d’autre part, on s’intéressera aux différentes variables qu’il permet d’afficher.

    Un p’tit merci suffit à faire apparaître la suite :).

    Voici en premier lieu le template index-box de base de forumactif :
    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>
     <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>
     <!-- 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">&nbsp;</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">{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>
     <td class="row3" align="center" valign="middle" height="50">
     <span class="gensmall">{catrow.forumrow.TOPICS}</span>
     </td>
     <td class="row2" align="center" valign="middle" height="50">
     <span class="gensmall">{catrow.forumrow.POSTS}</span>
     </td>
     <td class="row3 over" align="center" valign="middle" height="50">
     <span class="gensmall">{catrow.forumrow.LAST_POST}</span>
     </td>
     </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 -->

    1.  La structure du template

    Contrairement à ce que l’on pourrait croire, les indications fournies entre crochets "<  !--TEXTE --  >" ne sont pas de simples commentaires, mais contiennent tous les éléments de structuration des pages de votre forum.


    La toute première table du template, ci-dessous, correspond à la ligne au-dessus de votre première catégorie qui comporte le titre de votre forum et « voir les messages sans réponse » (quand vous n’êtes pas connecté) et aux trois lignes au-dessus de votre première catégorie (quand vous êtes connectés).

    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>
    Fait donc apparaître cela:


    D'ailleurs, ce tableau comporte deux "commentaires" de type "switch_user_logged_in".
    "switch_user_logged_in" : Les éléments contenus entre sa balise BEGIN et sa balise END n’apparaissent qu’à la connexion du membre au forum. Ils sont donc invisibles aux simples invités.

    A la suite de ce premier tableau, toute l’organisation de la page sera régie par les commentaires.

    " catrow" :  Il s’agit du bloc contenant l’ensemble des catégories, forums et sous-forums. Il débute visuellement sur votre page sous le tableau ci-dessus et termine au-dessus de la ligne « marquer tous les forums comme lus ».

    "tablehead": Il s’agit de l’en-tête du tableau dans le design de base. Si dans « structure et hiérarchie » vous avez choisi le mode « conserver les catégories sur l’index », cela correspond alors à la première ligne, qui contient « forum, sujets, messages, derniers messages », ci-dessous en gris.

    Si vous avez choisi l’option « séparer les catégories sur l’index », alors cette ligne affichera directement le titre de la catégorie au lieu du mot « forum », comme ci-dessous.


    Lorsque vous souhaiterez personnaliser votre template, notamment pour ajouter un en-tête à vos catégories, c’est entre ces balises qu’il faudra positionner votre div d’en-tête.


    "cathead": Cette ligne n’apparaît dans le tableau de base que lorsque vous avez fait le choix de « conserver les catégories sur l’index ». Il s’agit alors de la ligne bleue de ma première illustration, qui n’affiche que le titre de catégorie.
    Si vous avez choisi de « séparer les catégories sur l’index », alors les informations contenues entre ces balises ne seront pas affichées.

    "forumrow": Tout ce qui est affiché entre ces balises constitue les listes de forums et sous-forums qui seront affichés sur votre page d’accueil, en fonction du nombre de niveaux que vous avez choisi d’afficher dans « structure et hiérarchie ».

    La première colonne du tableau contient l’image indiquant s’il y a ou non un nouveau message :
    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>
    La deuxième colonne contient le titre du forum, le descriptif du forum, les modérateurs du forum, et les liens vers les sous-forums (on reviendra sur le détail des variables dans la partie suivante).
    Code:
    <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>

    A l’intérieur de ce bloc, ce sont les balises "switch_moderators_links" qui vont permettre l’affichage des modérateurs du forum. Si vous ne voulez plus les afficher, c’est donc ce bloc qui est à supprimer :
    Code:
    <!-- BEGIN switch_moderators_links -->
     {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
     <!-- END switch_moderators_links -->


    Enfin, les trois colonnes suivantes affichent respectivement le nombre de sujets postés dans le forum, le nombre de messages postés dans le forum, et le dernier message posté dans le forum :
    Code:
    <td class="row3" align="center" valign="middle" height="50">
     <span class="gensmall">{catrow.forumrow.TOPICS}</span>
     </td>
     <td class="row2" align="center" valign="middle" height="50">
     <span class="gensmall">{catrow.forumrow.POSTS}</span>
     </td>
     <td class="row3 over" align="center" valign="middle" height="50">
     <span class="gensmall">{catrow.forumrow.LAST_POST}</span>
     </td>
    "catfoot": N’ayant pas trouvé précisément à quoi correspond ce bloc, j’en déduis qu’en symétrie du bloc "cathead", son utilisation se fait en mode « conserver les catégories sur l’index ». Information qui reste à vérifier.

    "tablefoot": Il s’agit du pied du tableau pour chacune des catégories lorsqu’elles sont séparées. Pour personnaliser une catégorie en lui rajoutant un pied de page, c’est entre ces balises qu’il faudra placer la div.

    Si vous souhaitez créer un corps de catégorie qui dispose de son propre fond, il faudra impérativement ouvrir votre div de corps dans  "tablehead" et la fermer dans "tablefoot" afin qu’elle se positionne bien derrière les forums.


    Résumons-nous :

    Les éléments entre crochets "< !--TEXTE -- >", qui ressemblent à des commentaires, sont structurants pour l’organisation de la page et ne doivent donc pas être enlevés !

    Les éléments se positionnent comme suit sur votre page :
    Premier cas : vous avez choisi un affichage en mode « conserver les catégories sur l’index » :
    Spoiler:

    Deuxième cas : vous avez choisi un affichage en mode « séparer les catégories sur l’index » :
    Spoiler:


    2. La liste des variables du template index-box

    Maintenant que vous savez à peu près comment se positionnent les éléments sur la page, intéressons-nous aux variables qu’appelle le template index-box.

    {LAST_VISIT_DATE}:  « Dernière visite le [date/heure]» affiché au-dessus du forum, visible seulement lorsque le membre est connecté.

    {CURRENT_TIME}:« La date/heure actuelle est [date/heure]» affiché au-dessus du forum, visible seulement lorsque le membre est connecté.

    {L_INDEX}: Titre du forum global (du site internet, donc).

    {NAV_CAT_DESC}: La description du forum qui se situe en-dessous du titre du forum sous la bannière.

    {L_SEARCH_NEW}: « Voir les nouveaux messages depuis votre dernière visite », visible seulement lorsque le membre est connecté.

    {L_SEARCH_SELF}: « Voir ses messages », visible seulement lorsque le membre est connecté.

    {L_SEARCH_UNANSWERED}:« Voir les messages sans réponse ».

    {catrow.tablehead.L_FORUM}: Affiche le titre de la catégorie dans le bandeau "tablehead" lorsque les catégories sont séparées sur l’index (cf. première partie) ou bien affiche simplement « forum » lorsque les catégories sont conservées sur l’index.

    {L_TOPICS}: Affiche le terme « sujets » dans la ligne de titre du tableau. Cet élément est généralement supprimé lorsque l’on commence à personnaliser le template.  

    {L_POSTS}: Affiche le terme « messages » dans la ligne de titre du tableau. Cet élément est généralement supprimé lorsque l’on commence à personnaliser le template.  

    {L_LASTPOST}: Affiche le terme « derniers messages » dans la ligne de titre du tableau. Cet élément est généralement supprimé lorsque l’on commence à personnaliser le template.  

    {catrow.cathead.CAT_TITLE}: Affiche le titre de catégorie lorsque les catégories sont conservées sur l’index, dans le bandeau "cathead" (cf. première partie).

    {catrow.forumrow.FORUM_NAME}: Titre du forum au sein de la catégorie.

    {catrow.forumrow.FORUM_DESC}: cette variable appelle le texte de description du forum, tel que rédigé dans la zone : « général », « catégories et forums ».

    {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}: Affiche les modérateurs de chaque forum, en indiquant préalablement « modérateurs: ».

    {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}: Affiche les liens vers les sous-forums.

    {catrow.forumrow.TOPICS}: Affiche le nombre de sujets postés dans le forum donné.

    {catrow.forumrow.POSTS}: Affiche le nombre de messages postés dans le forum donné.

    {catrow.forumrow.LAST_POST}: Affiche le dernier message posté dans le forum donné.

    Enfin, une autre variable est assez utile à connaître :
    < img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" / >: Cette variable appelle l’image de « nouveau message » ou « pas de nouveau message » pour chaque forum.

    Normalement, avec ces éléments, vous pourrez déjà commencer à vous orienter plus aisément dans votre template :).


    Dernière édition par Asmareth le Mar 13 Mai 2014 - 20:24, édité 2 fois
    Desya
    Desya
    MasculinAge : 35Messages : 10

    Mar 17 Déc 2013 - 21:11

    Merci beaucoup!
    Whitemoon
    Whitemoon
    FémininAge : 24Messages : 695

    Mer 18 Déc 2013 - 19:07

    Merci



    Guide du template "index-box" (catégories) pour phpBB2 - Page 4 Kit_si10
    Bambi's logic
    Bambi's logic
    FémininAge : 27Messages : 25

    Dim 22 Déc 2013 - 12:16

    Merci !
    Katerinata
    Katerinata
    FémininAge : 30Messages : 22

    Mar 24 Déc 2013 - 0:54

    merci
    Angie Harkness
    Angie Harkness
    FémininAge : 40Messages : 725

    Mar 24 Déc 2013 - 2:04

    merci j'espères que cela m'aidera ^^
    Kai Turindo
    Kai Turindo
    MasculinAge : 23Messages : 80

    Mar 24 Déc 2013 - 12:42

    Danke. °w°
    Nightbird
    Nightbird
    MasculinAge : 32Messages : 81

    Mar 24 Déc 2013 - 22:33

    Merci
    Nico Robin
    Nico Robin
    FémininAge : 35Messages : 45

    Lun 30 Déc 2013 - 20:52

    Merci beaucoup ^^



    Guide du template "index-box" (catégories) pour phpBB2 - Page 4 13081311325692794 Guide du template "index-box" (catégories) pour phpBB2 - Page 4 130813113256545763 Guide du template "index-box" (catégories) pour phpBB2 - Page 4 131007105856621775 Guide du template "index-box" (catégories) pour phpBB2 - Page 4 131007105949512474
    Afterglow
    Afterglow
    FémininAge : 28Messages : 138

    Ven 3 Jan 2014 - 15:41

    Merci :)



    How do you get up from an all time low?
    Anonymous
    Invité

    Jeu 9 Jan 2014 - 12:51

    Merci!
    Shany
    Shany
    FémininAge : 39Messages : 59

    Ven 10 Jan 2014 - 11:47

    Merci
    Zarwins
    Zarwins
    FémininAge : 28Messages : 155

    Ven 10 Jan 2014 - 14:07

    Merci !



    Guide du template "index-box" (catégories) pour phpBB2 - Page 4 121217030106243656
    Hana Evali
    Hana Evali
    FémininAge : 34Messages : 195

    Dim 26 Jan 2014 - 2:09

    merci beaucoup !



    Guide du template "index-box" (catégories) pour phpBB2 - Page 4 Ye49
    Trenz
    Trenz
    MasculinAge : 21Messages : 44

    Dim 26 Jan 2014 - 10:10

    Merci pour ce tuto <3
    Amera
    Amera
    FémininAge : 31Messages : 67

    Dim 26 Jan 2014 - 18:25

    Merci beaucoup !



    Guide du template "index-box" (catégories) pour phpBB2 - Page 4 734690sign1
    Anéa
    Anéa
    FémininAge : 35Messages : 157

    Lun 27 Jan 2014 - 16:34


      Aaah merci, je butais sur un truc  cheers 



    Guide du template "index-box" (catégories) pour phpBB2 - Page 4 305535lulupsdcopie
    MlleNamiya
    MlleNamiya
    FémininAge : 29Messages : 35

    Mar 28 Jan 2014 - 21:04

    Merci !
    Black Diamond
    Black Diamond
    FémininAge : 35Messages : 90

    Mar 28 Jan 2014 - 22:09

    Un aperçu aurait pu être aussi bien avant de remercier pour voir les codes non ?
    Enfin c'est gentil de donner ton aide !

    Merci d'avance :3



    Guide du template "index-box" (catégories) pour phpBB2 - Page 4 134089sihgzr

    Allysae
    Allysae
    FémininAge : 29Messages : 27

    Mer 29 Jan 2014 - 20:38

    Merci :3



    Guide du template "index-box" (catégories) pour phpBB2 - Page 4 564451SignaturemoiNU
    Yogurt01
    Yogurt01
    MasculinAge : 34Messages : 79

    Mer 29 Jan 2014 - 20:48

    Merci du partage
    Sinavlia
    Sinavlia
    FémininAge : 26Messages : 158

    Dim 2 Fév 2014 - 3:45

    Merci beaucoup :)



    Guide du template "index-box" (catégories) pour phpBB2 - Page 4 Grec10
    Anonymous
    Invité

    Dim 2 Fév 2014 - 4:11

    Merchi :)
    Sheppynette
    Sheppynette
    FémininAge : 35Messages : 63

    Mar 4 Fév 2014 - 17:02

    Un grand merci pour ce tuto très utile!
    Enidech
    Enidech
    MasculinAge : 33Messages : 39

    Mar 4 Fév 2014 - 18:25

    Merci
    avatar
    Nal Souclade
    MasculinAge : 25Messages : 167

    Mer 5 Fév 2014 - 14:36

    Du templaaaate !! Merci beaucoup pour ce tuto !
    Contenu sponsorisé


      La date/heure actuelle est Lun 22 Juil 2024 - 4:24