Apparence des catégories

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Apparence des catégories

Message par Mielou le Jeu 23 Jan 2014 - 14:41

Bonjour !

Avant toute chose, je vous prie de m'excuser : ce sujet est des plus courants, j'en ai bien conscience, mais je suis incapable d'arriver à mes fins avec ce qui a déjà été posté.
En effet, j'ai d'ores et déjà tenté - vainement - de modifier mon code CSS ainsi que le template "index_body" mais je n'arrive pas au résultat escompté...

Comme beaucoup d'autres, j'aimerais obtenir un rendu semblable à ceci :


Pour ce faire, j'ai lu et suivi méticuleusement ce sujet, celui-ci, celui-là, lui, ou encore lui, en les essayant les uns après les autres - et en remettant à chaque fois code CSS et Template à zéro - mais il y a toujours un soucis, notamment au niveau des bordures.
J'ignore si c'est normal, toujours est-il que je désespère un tantinet après autant d'essais, et aucun résultat : d'où ce message (de détresse ?) !

Mon forum est en phpBB2 et sa hiérarchie est en moyen ; catégories de l'index séparées.
J'ai sensiblement modifié mon Template "index_body" (juste pour retirer le jour, l'heure, les nouveaux messages depuis la dernière visite et ses propres messages), rien de bien méchant, mais je vous le mets tout de même ci-dessous :
Code:
<table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
 <tr>
 <td valign="bottom">
 <!-- BEGIN switch_user_logged_in -->
 <!-- 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 -->
 <!-- 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"> </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 -->

Quant à ma feuille CSS (bon, n'ayez pas peur, hem...) :
Code:
textarea, input, select {
    background-color: #452827;}

.sceditor-container iframe, .sceditor-container textarea {
        color: #F0ECEB !important;}

#sceditor_smilies  ,#sceditor_smilies .row1 , #smilies_header , #sce_smilies_body ,
.sceditor-dropdown.sceditor-emoticon
{background:#452827 !important;}
#smilies_header form select
{background:#452827 !important;
border-color: #000000 !important;}
#smileyContainer iframe.row1
{border-radius: 10px !important;
padding-top: 15px;
  overflow: auto;
width: 200px;
height: 300px;}

div.sceditor-group {
background-color: #5E3937!important;
border-color: #000000 !important;}
a.sceditor-button.hover {
background-color: #452827 !important;}

a.sceditor-button.sceditor-button-fahide,
a.sceditor-button.sceditor-button-dailymotion,
a.sceditor-button.sceditor-button-date,
a.sceditor-button.sceditor-button-time,
a.sceditor-button.sceditor-button-fawow {display:none;}

a { text-decoration : none;}

.postbody{
        text-align : justify;
        display: block;
        padding-left: 35px;
        padding-right: 35px;
        padding-bottom: 15px;}

body{
    background-position: top center;
    background-repeat: no-repeat;
    background-attachment: fixed;}

$('a').click(function() {
 var href = $(this).attr('href');
 if (href.indexOf('http://') != -1 || href.indexOf('https://') != -1) {
 var host = href.substr(href.indexOf(':')+3);
 if (host.indexOf('/') != -1) {
 host = host.substring(0, host.indexOf('/'));}
 if (host != window.location.host) {
 window.open(href);
 return false;}}})

Je pense avoir fourni toutes les informations, mais s'il en manque, je reste bien évidemment à votre entière disposition !
Encore navrée de poster un énième sujet sur l'"Apparence des catégories", ce doit être des plus lassant pour vous, mais je ne sais vraiment plus comment faire éè

Par avance, merci d'avoir pris connaissance de ce message,
Cordialement,

Mielou.


Dernière édition par Mielou le Ven 24 Jan 2014 - 14:13, édité 1 fois

Mielou
Nouveau membre

Messages : 6
Inscrit(e) le : 11/06/2011

http://thomas.milie@neuf.fr
Mielou a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Apparence des catégories

Message par Lixyr le Jeu 23 Jan 2014 - 18:08

Bonsoir, Mielou.

Savez-vous que c'est mal de copier un forum ? Surtout que je connais très bien celui dont vous avez pris le screen... Donc repartons à zéro, voulez-vous ?

- Quel est le lien du forum concerné ?
- Quels changements exactement voulez-vous sur votre forum ? (les "je veux pareil que lui" ne fonctionnent pas, il me faut des détails)

ps : le template concernant les catégories est index-box.





Lixyr
Aidactive
Aidactive

Féminin
Messages : 5647
Inscrit(e) le : 22/07/2010

http://forum-test-in-lixyr.rpg-dynasty.com/
Lixyr a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Apparence des catégories

Message par Mielou le Jeu 23 Jan 2014 - 20:58

Bonsoir !

Hm... Visiblement, mes intentions ont été mal interprétées : vous m'en voyez désolée.
Loin de moi l'idée de " copier " ce forum. Comme je l'ai dit, je ne veux pas " pareil que lui ", mais quelque chose de semblable, qui s'en approche ; en bref, quelque chose de moderne et d'esthétique !
D'autant que si " copier " avait été mon intention première, que vous connaissiez très bien le forum victime ou non : le méfait reste identique et est tout aussi peu louable Smile
En réalité, j'ai pris ce forum pour exemple, mais j'aurais pu en prendre un autre : je ne cherchais qu'à illustrer l'idée que je me faisais de l'apparence idéale des catégories  du forum. Je me suis permise de prendre l'image d'un forum parce que sur les autres sujets que j'ai visité plus tôt ce matin, d'autres s'étaient octroyés ce droit avant moi.
En outre : ce message n'est pas une simple " commande ", j'aimerais encore comprendre un tant soit peu ce que je fais Smile
Mais qu'importe : repartons à zéro, comme vous le voulez !

Le forum en question est le suivant :
http://coalitionv2.forumactif.org/
(pour écarter tout doute, au cas où : comme vous pouvez le constater, ce forum est une " V.2 "... Je n'ai pas copié le forum d'origine, j'en étais moi-même la fondatrice Wink)

Vous le voyez, les catégories de mon forum sont basiques. Comme je vous l'ai dit, j'aimerais quelque chose de plus moderne et de moins classique !
L'idéal, serait tout d'abord de modifier la disposition des colonnes "Sujets" et "Messages" en les rendant plus discrètes.
Ensuite, il faudrait séparer le titre des Forums de leur description pour que ça fasse un effet moins "bloc". De la même façon, détacher les Sous-forums de ladite description pourrait être sympa !
S'agissant de l'emplacement des logos des nouveaux messages et des " Derniers messages " : ils peuvent rester à leur place (le premier, à gauche du forum, le second, à droite).
Enfin, il serait peut-être agréable d'arrondir un peu les angles des Catégories & cie, mais à ce titre, si vous pouviez m'indiquer précisément les parties du code concernées, ce serait sympa (en réalité, nous sommes deux Admins sur le forum et nous ne sommes pas encore certains de désirer ces fameux arrondis... C'est à voir !).

Une fois encore, tout ce que je veux, c'est apporter un peu de modernité au forum pour le rendre plus attractif ! Smile

PS : Au temps pour moi, j'avais effectivement modifié le " index_box ", c'est une erreur d'inattention de ma part, d'avoir dit à deux reprises, "index_body" !

Mielou
Nouveau membre

Messages : 6
Inscrit(e) le : 11/06/2011

http://thomas.milie@neuf.fr
Mielou a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Apparence des catégories

Message par Lixyr le Jeu 23 Jan 2014 - 21:45

D'accord.

A priori tout ce que vous voulez faire a déjà été expliqué sur le forum, il y a même certains tutos, donc comme nous n'avons pas vocation à fournir des commandes toutes faites sur ce forum, je vous laisse faire des petites recherches, et essayer par vous-même déjà de supprimer les colonnes "messages" et "sujets". Si vous n'y arrivez pas, vous me postez votre code et je vous dirai ce qui ne va pas.





Lixyr
Aidactive
Aidactive

Féminin
Messages : 5647
Inscrit(e) le : 22/07/2010

http://forum-test-in-lixyr.rpg-dynasty.com/
Lixyr a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Apparence des catégories

Message par Mielou le Ven 24 Jan 2014 - 14:12

Bonjour,

Soit, je vais tâcher de reprendre les tutos déjà consultés, en ce cas.

Bien à vous,

Mielou.

Mielou
Nouveau membre

Messages : 6
Inscrit(e) le : 11/06/2011

http://thomas.milie@neuf.fr
Mielou a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum