phpBB2 / punBB : Encadrer l’avatar et / ou le profil des membres

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

  • 0

Tutoriel phpBB2 / punBB : Encadrer l’avatar et / ou le profil des membres

Message par Matriochka le Jeu 4 Juil 2013 - 14:35

Encadrer l’avatar et / ou le profil des membres

Le tutoriel qui suit vous permettra d’intégrer un cadre personnalisable dans la case "Auteur" des messages sur votre forum Forumactif.

Démonstrations :
- Avatar encadré
- Profil complet encadré

Avant toute modification, assurez-vous que votre forum respecte les conditions suivantes :
- Vous devez être le fondateur du forum et avoir accès aux templates de celui-ci,
- Votre forum doit être en version phpBB2 ou en version punBB.



Modification du template viewtopic_body

Rendez-vous dans Panneau d’administration → Affichage → Templates → Général et ouvrez le template intitulé viewtopic_body à l’aide du rouage orange.

- Si vous désirez encadrer l’avatar, localisez cette variable :
Code:
{postrow.displayed.POSTER_AVATAR}
Remplacez-la par :
Code:
<div class="post_avatar">{postrow.displayed.POSTER_AVATAR}</div>
(Cette modification est valable pour la version phpBB2 comme pour la version punBB)

- Si vous désirez encadrer l’ensemble du profil, localisez toute cette partie :
Code:
<span class="name"><a name="{postrow.displayed.U_POST_ID}"></a><strong>{postrow.displayed.POSTER_NAME}</strong></span><br />
            <span class="postdetails poster-profile">
            {postrow.displayed.POSTER_RANK}<br />
            {postrow.displayed.RANK_IMAGE}{postrow.displayed.POSTER_AVATAR}<br /><br />
            <!-- BEGIN profile_field -->
            {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
            <!-- END profile_field -->
            {postrow.displayed.POSTER_RPG}
         </span>
Remplacez-la par :
Code:
<div class="post_profile"><span class="name"><a name="{postrow.displayed.U_POST_ID}"></a><strong>{postrow.displayed.POSTER_NAME}</strong></span><br />
            <span class="postdetails poster-profile">
            {postrow.displayed.POSTER_RANK}<br />
            {postrow.displayed.RANK_IMAGE}{postrow.displayed.POSTER_AVATAR}<br /><br />
            <!-- BEGIN profile_field -->
            {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
            <!-- END profile_field -->
            {postrow.displayed.POSTER_RPG}
         </span></div>
(Cette modification n’est valable que pour la version phpBB2)

Une fois la modification faite, enregistrez-la puis publiez le template en cliquant sur le "Plus" vert dans le listing des templates.


Modification de la feuille de styles CSS

Rendez-vous dans Panneau d’administration → Affichage → Couleurs → Onglet "Feuille de styles CSS".

- Si vous avez encadré l’avatar, ajoutez ce code à la feuille :
Code:
div.post_avatar img {
border:1px solid #000000;
background:#FFFFFF;
padding:3px;}

- Si vous avez encadré l’ensemble du profil (sous phpBB2), ajoutez ce code à la feuille :
Code:
div.post_profile {
border:1px solid #000000;
background:#FFFFFF;
padding:3px;}

- Si vous voulez encadrer l’ensemble du profil (sous punBB), ajoutez ce code à la feuille :
Code:
div.user {
border:1px solid #000000;
background:#FFFFFF;
padding:3px;}

N’oubliez pas d’enregistrer votre modification.

Explications :
background:#FFFFFF; permet de donner un fond de couleur blanche
border:1px solid #000000; permet d’intégrer une bordure pleine d’un pixel d’épaisseur et de couleur noire
padding:3px; permet d’espacer le contenu et la bordure de 3 pixels


Lectures complémentaires

- Tutoriel sur le HTML
- Tutoriel sur le CSS
- Explications sur les variables des templates

Matriochka
+ Hyperactif +

Messages : 7604
Inscrit(e) le : 14/07/2010

Matriochka 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