ForumEntraideAstucesSF-BBFAQRechercherInscriptionConnexionNewsPlus ! 
UNE GALERIE D'AVATARS A ETE MISE EN PLACE POUR LES MEMBRES
MERCI DE PENSER A COMPLETER VOTRE PROFIL ET DE CHOISIR UN AVATAR
Poster un nouveau sujetCe sujet est verrouillé, vous ne pouvez pas éditer les messages ou faire de réponses.
phpbb2: refonte de l'Affichage des sujets

Voir le profil de l'utilisateurhttp://www.tamilfriends.forumpro.fr/
nirupan
Membre
Membre

Masculin Age: 18
Nombre de messages: 597
Localisation: Paris
Emploi/loisirs: sans emploie
Humeur: ca peut aller
Date d'inscription: 18/07/2008

Remerciements reçus: 21

MessageSujet: phpbb2: refonte de l'Affichage des sujets 31/1/2010, 18:00
Par : nirupan

Hello,
Pour ce tuto, je vais vous apprendre a faire un affichage qui ressemble à celui-ci :


Ouvrez votre template, topics_list_box, et remplacez tout par :
Code:
<!-- BEGIN topics_list_box --><!-- BEGIN row --><!-- BEGIN header_table --><!-- BEGIN multi_selection -->
<script type="text/javascript">
function check_uncheck_main_{topics_list_box.row.header_table.BOX_ID}() {
   var all_checked = true;
   for (i = 0; (i < document.{topics_list_box.FORMNAME}.elements.length) && all_checked; i++) {
   if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
      all_checked = document.{topics_list_box.FORMNAME}.elements[i].checked;
   }
   }
   document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked = all_checked;
}
function check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}() {
   for (i = 0; i < document.{topics_list_box.FORMNAME}.length; i++) {
   if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
      document.{topics_list_box.FORMNAME}.elements[i].checked = document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked;
   }
   }
}
</script>
<!-- END multi_selection -->

<table class="" width="100%" border="0" cellspacing="0" cellpadding="0">
   <tr height="28">
      <th width="100%" height="28" style="background-image: url('http:ADRESS_DE_VOTRE_IMAGE'); background-position: top left; padding: 1px;" align="center" colspan="2"><span class="copyright"> {topics_list_box.row.L_TITLE} </span></th>
      
   
      <!-- BEGIN multi_selection -->
      <th align="center" nowrap="nowrap" width="20"><input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" /></th>
   <!-- END multi_selection -->
   </tr>
   <tr>
      <td style="border-bottom: 1px solid #couleur; border-right: 5px solid #couleur; border-left: 5px solid #couleur; padding: 1px;" class="row1" colspan="3" align="right"><span class="gensmall">{PAGINATION}</span></td>
   </tr>
   <!-- END header_table --><!-- BEGIN header_row -->
   <tr>
      <td  style="border-bottom: 1px solid #couleur; padding: 1px;" class="row3" colspan="3"><span class="gensmall"> <b>{topics_list_box.row.L_TITLE}</b></span></td>
   </tr>
<!-- END header_row -->

<!-- BEGIN topic -->
{topics_list_box.row.END_TABLE_STICKY}
   <tr class="mycel">
      <!-- BEGIN single_selection -->
      <td  style="background-color: #couleur; border-bottom: 1px solid #couleur; padding: 1px;" class="{topics_list_box.row.ROW_CLASS}" align="center" valign="middle" width="20"><input type="radio" name="{topics_list_box.FIELDNAME}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} /></td>
      <!-- END single_selection -->
      
      
   
      
<td  style="border-bottom: 1px solid #couleur; border-right: 1px dashed #couleur; border-left: 5px solid #740000; padding: 3px;" width="440" height="55"><img title="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" src="{topics_list_box.row.TOPIC_FOLDER_IMG}" alt="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" /><div class="topictitle">
         {topics_list_box.row.NEWEST_POST_IMG}{topics_list_box.row.PARTICIPATE_POST_IMG}{topics_list_box.row.TOPIC_TYPE}Le sujet
            "<h2 class="topic-title">
               <a class="topictitle" href="{topics_list_box.row.U_VIEW_TOPIC}">{topics_list_box.row.TOPIC_TITLE}</a>
            </h2>"
         </div>
 <span class="postdetails"> a reçu  {topics_list_box.row.REPLIES} messages</span><span class="postdetails"> et a été vu  {topics_list_box.row.VIEWS} fois</span><!-- BEGIN switch_description -->
        <span class="genmed">
            <br />
            {topics_list_box.row.topic.switch_description.TOPIC_DEscriptION}
        </span>
        <!-- END switch_description -->
         <span class="gensmall">{topics_list_box.row.TOPIC_ANNOUNCES_DATES}{topics_list_box.row.TOPIC_CALENDAR_DATES}</span> 
         <span class="gensmall">{topics_list_box.row.GOTO_PAGE}<!-- BEGIN nav_tree -->{topics_list_box.row.TOPIC_NAV_TREE} <!-- END nav_tree --></span></td>

<td style="border-bottom: 1px solid #couleur; border-right: 5px solid #couleur; padding: 3px;" width="440" height="55">
<span class="postdetails"> Derniers messages posté {topics_list_box.row.LAST_POST_TIME} par {topics_list_box.row.LAST_POST_AUTHOR} {topics_list_box.row.LAST_POST_IMG}</span> </td>


<!-- BEGIN multi_selection -->
      <td class="row2" align="center" valign="middle"><span class="postdetails"><input onclick="javascript:check_uncheck_main_{topics_list_box.row.BOX_ID}();" type="checkbox" name="{topics_list_box.FIELDNAME}[]{topics_list_box.row.BOX_ID}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} /></span></td>
   <!-- END multi_selection -->
   </tr>
   <!-- END topic --><!-- BEGIN no_topics -->
   <tr>
      <td class="row1" colspan="{topics_list_box.row.COLSPAN}" align="center" valign="middle" height="30"><span class="gen">{topics_list_box.row.L_NO_TOPICS}</span></td>
   </tr>
   <!-- END no_topics --><!-- BEGIN bottom -->
   <tr>
      <td class="" colspan="{topics_list_box.row.COLSPAN}" valign="middle">
         <table width="100%" border="0" cellspacing="0" cellpadding="0">
            <tr>
               <td style="border-left: 5px solid #couleur; border-top: 1px solid #740000; background-color: #couleur"> <span class="gensmall">{PAGINATION}</span></td>
               <td style="border-right: 5px solid #couleur; border-top: 1px solid #740000; background-color: #couleur" align="right"><a href="#top">{L_BACK_TO_TOP}</a> </td>
            </tr>
         </table><img src="http:ADRESS_DE_VOTRE_IMAGE" height="6" width="888" />
      </td>
   </tr>
<!-- END bottom --><!-- BEGIN footer_table -->
</table><!-- END footer_table --><!-- BEGIN spacer --><br class="gensmall" /><!-- END spacer --><!-- END row --><!-- END topics_list_box -->

Il ne reste plus qu'a changer les tailles, les images et les couleurs selon vos besoin et voilà^^
Si vous voulez ajouter un effet de phpbb3, collez ça dans votre css :
Code:
.mycel {
background-color: #couleur;
background-image: url('');
background-repeat: repeat-y;
background-position: right;
}
.mycel:hover {
background-color: #couleur;
background-image: url('');
background-repeat: repeat-y;
background-position: left;
}

C'est tout,
bye

EDIT : Seul petit inconvénient, vous ne pourrez plus séparer les post-it et annonces par les tableaux

Voir le profil de l'utilisateurhttp://www.sos-forum.com/
ze_chaofan
De retour de loin
De retour de loin

Masculin Age: 16
Nombre de messages: 3232
Localisation: Un peu la même que mon ombre
Emploi/loisirs: Dormir
Humeur: Mnmnhmnhhmnh ?
Date d'inscription: 30/07/2007

Remerciements reçus: 169

MessageSujet: Re: phpbb2: refonte de l'Affichage des sujets 31/1/2010, 20:53
Par : ze_chaofan

Hello...

Merci pour l'astuce !
Pourrait on avoir un peu plus de précisions concernant les images ?

Voir le profil de l'utilisateurhttp://www.tamilfriends.forumpro.fr/
nirupan
Membre
Membre

Masculin Age: 18
Nombre de messages: 597
Localisation: Paris
Emploi/loisirs: sans emploie
Humeur: ca peut aller
Date d'inscription: 18/07/2008

Remerciements reçus: 21

MessageSujet: Re: phpbb2: refonte de l'Affichage des sujets 6/2/2010, 18:16
Par : nirupan

re,
C'est simplement un effet de hover qu'on donne aux différents <td> de la <tr>, soit on peut le laisser sans image, soit avec des dégradé ...

Voir le sujet précédent Voir le sujet suivant Revenir en haut
Page 1 sur 1

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
SOS-FORUM :: A consulter ! ::  Astuces pour forums-
Poster un nouveau sujetCe sujet est verrouillé, vous ne pouvez pas éditer les messages ou faire de réponses.
Derniers sujets
» fichier video
par ze_chaofan Hier à 21:08

» Installation Catégories comprimées
par Ilianna 9/3/2010, 01:31

» pop-up Lorsque vous recevez le MP
par Final-Blond 8/3/2010, 20:21

» Menu bizzare
par Final-Blond 8/3/2010, 20:18

» installer un sélecteur de thèmes
par Final-Blond 8/3/2010, 20:16

» Problème avec catégories comprimées
par Final-Blond 8/3/2010, 20:15

» Nouvelle apparence du forum !
par ze_chaofan 8/3/2010, 20:13

» Catégories comprimées [questions]
par Final-Blond 8/3/2010, 20:13

» [AIDE] Changer le nom "Membres"
par Final-Blond 8/3/2010, 20:11

» Kikou
par Ilianna 8/3/2010, 20:03

» Euh... salut ! ^^
par Solitude 8/3/2010, 10:52

» je me presente
par Solitude 8/3/2010, 10:52

Accueil­FAQ­Rechercher­Groupes­Membres­S'enregistrer­Connexion
Créer un forum | Informatique et Internet | Publicité en ligne  | © phpBBForum gratuit d'entraide| Statistiques | Signaler un abus  | Créer son propre blog gratuit | Contrat CC