La tambouille des râleuses
Vous souhaitez réagir à ce message ? Créez un compte en quelques clics ou connectez-vous pour continuer.
Le Deal du moment :
TCL C74 Series 55C743 – TV 55” 4K QLED 144 ...
Voir le deal
499 €

Aller en bas
Mäven
Mäven
Râleuse (Admin)
Informations : Très peu présente en ce moment Sad
----
Idea Viens papoter avec nous sur le discord

Messages : 4053
https://tambouille-raleuses.forumactif.com/

[Toutes versions SAUF AwesomeBB] Catégories - La patte du chien Empty [Toutes versions SAUF AwesomeBB] Catégories - La patte du chien

Jeu 2 Jan 2020 - 10:27

Catégories - La patte du chien

Bonjour à toi Smile

Tu cherches une idée de codage pour les catégories de ton forum ? Je viens t'en proposer un modèle ici et je n'ai aucune idée de nom, pour changer Very Happy

Ces catégories ont été créées il y a quelques années pour aller avec ce thème sur phpBB2. Tu peux récupérer les images pour l'adapter aux autres versions sans trop de souci normalement.

Voilà un aperçu :
[Toutes versions SAUF AwesomeBB] Catégories - La patte du chien Rendu_10

Idea Tu dois avoir accès aux templates
Idea Un minimum de connaissances en HTML et CSS est préférable pour tout comprendre
Idea La structure de ton forum, quelque soit la version, doit être en "moyen" de la seconde ligne (PA > Affichage > Structure et hiérarchie)

Après tout ces prérequis et choses à savoir, on rentre dans le vif du sujet !

Partie HTML : modifions le template

C'est la même chose sur toutes les versions : tout se passe dans le template qui s'appelle index_box (PA -> Affichage -> Template -> général)

Repère ces deux commentaires :
Code:
<!-- BEGIN catrow -->
et
Code:
<!-- END catrow -->

Supprime tout ce qu'il ya entre les 2 (oui oui, tout Smile ) et remplace le par ceci :
Code:
<!-- BEGIN tablehead -->
<div class="MVN_titre_categorie">{catrow.tablehead.L_FORUM}</div>
<div class="MVN_categorie">
  <!-- END tablehead -->
 <!-- BEGIN cathead -->
  <!-- END cathead -->
 <!-- BEGIN forumrow -->
 <div class="MVN_d-flex MVN_ligne1">
 <div class="MVN_image">
          <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
          </div>
 <div class="MVN_titre_forum">
                  <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}>
          </div>
 </div>
 <div class="MVN_ligne2">
 <div class="MVN_d-flex">
 <div class="MVN_description">
                          <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 -->
 
 </span>
 </div>
 <div class="MVN_derniers_messages">
                          <!-- BEGIN ads -->
                                <span class="AD_LastPA">
                                    <span class="lastpost-avatar"><img src="{catrow.forumrow.ads.IMG}" alt="{catrow.forumrow.ads.TITLE}" /></span>
                                    <span class="AD_LastInfos">
                                        <b><a href="{catrow.forumrow.ads.LINK}">{catrow.forumrow.ads.TITLE}</a></b><br />
                                        {catrow.forumrow.ads.DATE}<br />
                                        {catrow.forumrow.ads.LOCATION}
                                    </span>
                                </span>
                                <!-- END ads -->
                                <!-- BEGIN avatar -->
                                <div style="width: 200px;"></div>
                                <span class="lastpost-avatar">{catrow.forumrow.avatar.LAST_POST_AVATAR}</span>
                                <!-- END avatar -->
                 
                                            <span class="gensmall">{catrow.forumrow.TOPICS} sujets - {catrow.forumrow.POSTS} messages
                                              <br />
                                              {catrow.forumrow.LAST_POST}</span>
 </div>
 </div>
 <div class="MVN_sous-forums">
                  {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
 </div>
 </div>
<!-- END forumrow -->
 <!-- BEGIN catfoot -->
  <!-- END catfoot -->
 <!-- BEGIN tablefoot -->
</div>

 
<!-- END tablefoot -->

On enregistre et on oublie pas de publier le template Smile

Partie CSS : attaquons la mise en page

Dans la CSS de ton forum (PA -> Affichage -> Couleurs -> Feuille de style CSS) colle la CSS :

Toutes versions

Code:
 
.MVN_titre_categorie h2{
  text-align:center;
  font-variant:small-caps;
  font-size:25px;
}

.MVN_categorie{
  background:#3d2d16;
  padding:2%;
  box-sizing:border-box;
  border:3px solid #170a03;
}

.MVN_categorie .MVN_d-flex{
 display:flex;
}

.MVN_categorie .MVN_ligne1 {
    align-items: center;
    margin-bottom: -30px;
}

.MVN_categorie .MVN_ligne2 {
    background: #91734e;
    padding: 1%;
    border:3px solid #170a03;
}

.MVN_categorie .MVN_description {
    width: 78%;
    padding: 2%;

}

.MVN_categorie .MVN_derniers_messages {
    text-align: center;
    width: 19%;
    padding: 0.5% 1%;
}

.MVN_categorie .forumlink {
    font-size: 20px;
}

AwesomeBB

Je l'ai mis non compatible pour cette version, mais tu peux tout de même la prendre. Seulement il y a quelques petites choses à changer. Si jamais tu veux le prendre pour cette version contacte moi et on fera ce qu'il faut Smile




Exclamation Les couleurs de texte et de liens sont les couleurs de ton forum : tu dois les choisir dans Affichage > Couleurs

Idea Aucun des codes n'est commenté, n'hésite pas à dire si tu es un peu perdu, j'en ajouterai. De même si tu as besoin d'aide pour la personnalisation n'hésite pas à le dire je t'assisterai Smile




Si tu te sers de ce code, merci de mettre un petit lien vers la tambouille quelque part sur ton forum, pas trop caché, pour que tes membres puissent venir chercher de l'aide ou des codes par ici aussi : )

Revenir en haut
Permission de ce forum:
Vous pouvez répondre aux sujets dans ce forum
Les coups de ♥ des Râleuses

Post-It des Râleuses