Personnaliser les icones catégories et forums (phpBB3)

[Lezebre]

Personnaliser les icones catégories et forums (phpBB3)

Personnalisez les Icônes de Forum ! Aperçu le l'index avant personnalisation des icones catégorie et forum Dans le panneau d'administration : Affichage Gestions des images (mode avancé) Onglet Icones du Forum Vous pouvez (au choix) Sélectionner une image disponible dans le thême -> bouton "Voir les modèles" Choisir une image sur le disque dur de votre ordinateur -> Bouton "Envoyer une image" Masquer l'image (en la remplaçant par une image invisible) -> Case à cocher "Masquer" Ici, vous pouvez modifier plusieurs images à la suite. N'oubliez pas de valider vos modifications en cliquant sur le bouton "Enregistrer" avant de quitter Choisir une icone parmi les modèles disponibles : Sélectionnez l'icone de votre choix, puis validez en cliquant sur le bouton "Enregistrer" Choisir une image sur votre ordinateur : En cliquant sur le bouton "Choisir...", une fenêtre "Parcourir" s'ouvre : choisissez le dossier puis l'image souhaitée, puis cliquez sur "Ouvrir", puis sur "Envoyer" N'oubliez pas de valider vos modifications en cliquant sur le bouton "Enregistrer" avant de quitter Dimensions de la cellule image catégorie/forum Aperçu de l'index après personnalisation des icones catégories et forum : Comme on le voit sur l'illustration, ci-dessus, le texte de la description empiète sur les icones de catégorie/forum Réglez les dimensions de la cellule image de catégorie et forum : Général Configuration --> Structure des pages Aperçu de l'index après modification des dimensions de la cellule :

Ce tutoriel a été rédigé par Lezèbre. Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.

[Lezebre]

Personnaliser les icones catégories et forums (phpBB3)

Personnalisez les icones de sujet (liste des sujets dans un sous-forum) Aperçu de la liste des sujets avant personnalisation des icones de sujet : Dans le panneau d'administration : Affichage Gestions des images (mode avancé) Onglet "Icones des sujets" Vous pouvez (au choix) Sélectionner une image disponible dans le thême -> bouton "Voir les modèles" Choisir une image sur le disque dur de votre ordinateur -> Bouton "Envoyer une image" Masquer l'image (en la remplaçant par une image invisible) -> Case à cocher "Masquer" Ici, vous pouvez modifier plusieurs images à la suite. N'oubliez pas de valider vos modifications en cliquant sur le bouton "Enregistrer" avant de quitter Choisir une icone parmi les modèles disponibles : Sélectionnez l'icone de votre choix, puis validez en cliquant sur le bouton "Enregistrer" Choisir une image sur votre ordinateur : En cliquant sur le bouton "Choisir...", une fenêtre "Parcourir" s'ouvre : choisissez le dossier puis l'image souhaitée, puis cliquez sur "Ouvrir", puis sur "Envoyer" N'oubliez pas de valider vos modifications en cliquant sur le bouton "Enregistrer" avant de quitter Modifier les dimensions de la cellule icone de sujet Aperçu de la liste des sujets après personnalisation des icones de sujet : Comme on le voit sur l'illustration, ci-dessus, le texte de la description empiète sur les icones de sujet Réglez les dimensions de la cellule icone de sujet : Affichage Couleurs Onglet "Feuille de style CSS" Nous allons coller ce code dans la feuille de style CSS Code: .topiclist dl.icon { min-height: 60px; background-position: 2px 50%; } * html .topiclist dl.icon { height: 60px; } ul.topics dt,ul.topics dd.dterm { padding-left: 60px; } ul.pmlist dt,ul.pmlist dd.dterm { padding-left: 60px; } Les valeurs surlignées ci-dessous en vert sont à modifier en fonction de la hauteur des icones de sujet. La valeur surlignée ci-dessous en orange est à modifier en fonction de la largeur des icones de sujet Dans cet exemple, les icones de sujet font 50px de large sur 50px de haut. Afin de garder une petite marge, nous fixons les valeurs à 60x60 dans le style CSS Aperçu de la liste des sujets, après modification du style CSS :

Ce tutoriel a été rédigé par Lezebre Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.