Pour faire cela, il est toujours plus aisé d'utiliser le Profil Simple.
Contrairement au Profil Avancé, le profil Simple a moins d'options. On ne peut pas laisser de commentaire, on ne voit pas les admis et les statistiques sont moins détaillées. Considérant que ce sont des éléments très peu utilisés, ce n'est pas une grosse perte. Le gros avantage du profil Simple au profil Avancé, c'est qu'on a accès au template et c'est exactement ce qu'on veut faire ici.
Avec le profil Simple, la première chose à faire est d'aller dans le template X.
Le Template est composé de plusieurs éléments sur lesquels on va passer.
Voici le fil d'Ariane au dessus du profil :
- Code:
-
<table width="100%" border="0" cellspacing="2" cellpadding="0" align="center">
<tr>
<td><span class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a></span></td>
</tr>
</table>
Nous avons ensuite un tableau qui va contenir plusieurs sections.
IMAGE.
Nous allons avoir un grand tableau avec 6 lignes.
- En bleu, nous avons la 1ère ligne, celle du titre "Voir le profil de ..."
- En rouge, nous avons la 2ème ligne, celle des en-êtes des deux premières sections.
- En vert, nous avons la 3ème ligne qui contient:
- - À gauche, l'avatar, le rang, la présence, la gestion des amis et les options des Admins.
- - À droite, les statistiques et les champs de profil.
- En mauve, nous avons les lignes 4 et 5, celles des champs de contact.
- En orange, nous avons les lignes 6 à 8, celles de la feuille de personnage RPG.
Du coup, nous allons commencer les lignes 1 et 2 :
- Code:
-
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0" align="center"><!-- Début du tableau qui comprend tout le profil -->
<tr><!-- Première ligne qui indique "Voir le profil de PSEUDO" -->
<th class="thHead" colspan="2" nowrap="nowrap" height="25">
<h1 class="h_member">{L_VIEWING_PROFILE}</h1>
</th>
</tr>
<tr><!-- Deuxième ligne qui indique, "Présence sur le forum" à gauche et "Tout à propos de PSEUDO" à droite -->
<td class="catLeft" align="center" width="40%" height="28"><b><span class="gen">{L_USER_PRESENCE}</span></b></td><!-- "Présence sur le forum" à gauche -->
<td class="catRight" width="60%" align="center"><b><span class="gen">{L_ABOUT_USER}</span></b></td><!-- "Tout à propos de PSEUDO" à droite -->
</tr>
Ensuite, on arrive enfin aux informations du profil de la 3ème ligne. On va voir la section "Présence sur le forum" à gauche pour commencer :
- Code:
-
<tr><!-- Troisième ligne -->
<td class="row1" align="center" valign="top" height="120"><!-- On est à gauche -->
<table width="100%" border="0" cellspacing="1" cellpadding="0"><!-- Les informations à gauche sont dans un tableau -->
<tr><!-- Ligne de l'avatar -->
<td valign="middle" nowrap="nowrap" align="right" width="20%"><span class="gen">{L_AVATAR_IMG} </span></td><!-- "Avatar:" -->
<td width="80%"><b><span class="gen">{AVATAR_IMG}</span></b></td><!-- Image de l'avatar -->
</tr>
<tr><!-- Ligne du rang -->
<td valign="middle" nowrap="nowrap" align="right"><span class="gen">{L_RANK}: </span></td><!-- "Rang:" -->
<td><b><span class="gen">{POSTER_RANK}</span></b></td><!-- Rang (incluant le nom et l'image) -->
</tr>
<!-- BEGIN switch_show_status -->
<tr><!-- Ligne de présence (s'affiche seulement si on ne cache pas notre présence) -->
<td valign="middle" nowrap="nowrap" align="right"><span class="gen">{L_STATUT}: </span></td><!-- Le "Statut:" -->
<td><b><span class="gen">{USER_ONLINE}</span></b></td><!-- Affiche si la personne est connectée ou non -->
</tr>
<!-- END switch_show_status -->
<!-- BEGIN switch_allow_friendsfoes -->
<tr><!-- Ligne pour gérer les amis et les ignorés -->
<td valign="middle" nowrap="nowrap" align="right"><span class="gen">{L_FRIENDS_AND_FOES}: </span></td><!-- "Amis et ignorés:" -->
<td><span class="gen"><strong>{FRIENDSFOES}</strong></span></td>
</tr><!-- Permet de supprimer de la liste d'amis ou de la liste d'ignorés -->
<!-- END switch_allow_friendsfoes -->
<!-- BEGIN switch_auth_user -->
<tr><!-- Ligne pour les administrateurs -->
<td valign="middle" nowrap="nowrap" align="right"><br /><span class="gen">{L_ADMINISTRATE_USER}: </span></td><!-- "Administrer l'utilisateur:" -->
<td><br /><strong><span class="gen">{ADMINISTRATE_USER}{BAN_USER}</span></strong></td><!-- Permet d'accéder au profil dans la panneau d'administration ou de bannir l'utilisateur -->
</tr>
<!-- END switch_auth_user -->
</table>
</td>
Maintenant, on passe à droite, à savoir la section des statistiques et des champs de profil.
- Code:
-
<td class="row1" rowspan="3" valign="top"><!-- On est à droite -->
<table width="100%" border="0" cellspacing="1" cellpadding="0"><!-- Les informations sont dans un tableau -->
<tr><!-- Ligne de la dernière visite -->
<td align="right" valign="top" nowrap="nowrap"><span class="gen">{L_LAST_VISITED}: </span></td><!-- "Dernière visite:" -->
<td><b><span class="gen">{LAST_VISIT_TIME}</span></b></td><!-- Date de la dernière visite -->
</tr>
<!-- BEGIN switch_dhow_mp -->
<tr><!-- Ligne du nombre de MP -->
<td align="right" valign="middle" nowrap="nowrap"><span class="gen">{L_PRIVATE_MSG}: </span></td><!-- "Messages privés" -->
<td><b><span class="gen">{PRIVATE_MSG}</span></b></td><!-- Nombre de messages privés -->
</tr>
<!-- END switch_dhow_mp -->
<!-- BEGIN profile_field -->
<tr id="field_id{profile_field.ID}"><!-- Ligne de chaque champ de profil -->
<td width="40%" align="right" valign="top" nowrap="nowrap"><span class="gen">{profile_field.LABEL} </span></td><!-- Le nom du champ de profil -->
<td width="60%">
<div class="gen" style="font-weight:bold;">{profile_field.CONTENT}</div><!-- Contenu du champ -->
<br />
<!-- BEGIN profil_type_user_posts -->
<span class="genmed">[{POST_PERCENT_STATS} / {POST_DAY_STATS}]</span><!-- Pour le champ des messages, on a les statistiques du nombre de messages -->
<br />
<span class="genmed">
<a rel="nofollow" class="genmed" href="/st/{PUSERNAME}">{L_SEARCH_USER_POSTS} :</a><!-- Sujets ouverts par l'utilisateur -->
<br />
- <a rel="nofollow" class="genmed" href="/sta/{PUSERNAME}">{L_TOPICS}</a><!-- Sujets où l'utilisateur a participé -->
<br />
- <a rel="nofollow" class="genmed" href="/spa/{PUSERNAME}">{L_POSTS}</a><!-- Messages de l'utilisateur -->
</span>
<!-- END profil_type_user_posts -->
</td>
</tr>
<!-- END profile_field -->
</table>
</td>
</tr>
Donc si on résume, on une ligne pour la dernière visite, une ligne pour les messages privés, puis la section des champs de profil avec une particularité pour le nombre de messages qui a des statistiques.
Passons maintenant à la 4ème et 5ème ligne, soit la section des champs de contact.
- Code:
-
<tr><!-- Quatrième ligne ligne -->
<td class="catLeft" align="center" height="28"><b><span class="gen">{L_CONTACT} {USERNAME}</span></b></td><!-- Troisième ligne -->
</tr>
<tr><!-- Cinquième ligne -->
<td class="row1" valign="top" height="{S_CONTACT_HEIGHT}">
<table width="100%" border="0" cellspacing="1" cellpadding="0"><!-- Comme d'habitude, les informations sont dans un tableau... -->
<!-- BEGIN contact_field -->
<tr id="field_id{contact_field.ID}"><!-- Ligne de chaque champ de contact -->
<td width="40%" align="right" valign="middle" nowrap="nowrap"><span class="gen">{contact_field.LABEL} </span></td><!-- Label d'un champ de contact -->
<td width="60%" valign="middle">
<div class="gen" style="font-weight:bold;">{contact_field.CONTENT}</div>
</td><!-- Contenu du champ de contact -->
</tr>
<!-- END contact_field -->
<!-- Cette section est pour que l'Admin puisse laisser un message -->
<!-- BEGIN switch_admin_user_comment_active -->
<tr>
<td align="right" valign="middle" nowrap="nowrap" width="50%">
<span class="gen">{L_COMMENTS} :</span><br /><span class="gensmall">{L_MODS_AND_ADMINS}</span>
</td>
<td class="row1" valign="middle">
<table align="center">
<tr>
<td>
{ADMIN_USER_COMMENT}
</td>
</tr>
</table>
</td>
</tr>
<!-- END switch_admin_user_comment_active -->
</table>
</td>
</tr>
Et voilà ! Ce n'était pas aussi compliqué de d'habitude au moins. Je n'ai pas détaillé la section où les Admins/Modos peuvent laisser un message parce que je n'ai jamais trouvé comment activer cette section...
Bon, la section de la feuille RPG n'est pas un petit morceau. On y a 3 lignes :
- La ligne 6 comprend le titre de la feuille de personnage.
- La ligne 7 comprend les champs des personnages.
- - À gauche, on a l'avatar de la feuille de personnage (et les champs qu'on a décidé d'afficher à gauche).
- - À droite on a les champs de la feuille de personnage
- La ligne 8 nous envoie sur la page pour modifier la feuille de personnage pour les Admins.
Vous saviez qu'on avait une option quand on crée les champs de la feuille de personnage pour décider si on les affiche à droite ou à gauche? Pas moi. Je dirais que c'est totalement inutile, à moins que vous souhaitiez créer 2 groupes de champs dans la feuille RPG, ce qui intéresserait peut-être certains d'entrevous ?
Bref, assez de blabla, voilà :
- Code:
-
<!-- BEGIN switch_rpg -->
<tr><!-- Sixième ligne -->
<td colspan="2" class="catLeft" align="center"><b><span class="gen">{L_VIEWING_RPG}</span></b></td><!-- Titre de la feuille de personage -->
</tr>
<tr><!-- Septième ligne -->
<td class="row1" align="center" valign="top" height="6"><!-- À gauche -->
{RPG_IMAGE}<!-- Avatar RPG -->
<br /><br />
<table width="100%" border="0" cellspacing="1" cellpadding="0"><!-- Tableau des champs affichés à gauche -->
<!-- BEGIN rpg_fields_left -->
<tr><!-- Chaque champ RPG -->
<td align="right" valign="middle" nowrap="nowrap">
<span class="gen">{switch_rpg.rpg_fields_left.F_NAME} : </span>
</td><!-- Label du champ RPG -->
<td width="100%" valign="middle" nowrap="nowrap">
<b><span class="gen">{switch_rpg.rpg_fields_left.F_VALUE_NEW}</span></b>
</td><!-- Contenu du champ rpg -->
</tr>
<!-- END rpg_fields_left -->
</table>
</td>
<td class="row1" align="center" valign="top" height="6"><!-- À droite -->
<table width="100%" border="0" cellspacing="1" cellpadding="0"><!-- Tableau des champs affichés à droite -->
<!-- BEGIN rpg_fields -->
<tr><!-- Chaque champ RPG -->
<td align="right" valign="middle" nowrap="nowrap">
<span class="gen">{switch_rpg.rpg_fields.F_NAME} : </span>
</td><!-- Label du champ RPG -->
<td width="100%" valign="baseline">
<b><span class="gen">{switch_rpg.rpg_fields.F_VALUE_NEW}</span></b>
</td><!-- Contenu du champ RPG -->
</tr>
<!-- END rpg_fields -->
</table>
</td>
</tr>
<tr><!-- Huitième ligne -->
<td colspan="2" align="center" class="row1">
{U_ADMIN_RPG}<!-- Bouton "Modifier" -->
</td>
</tr>
<!-- END switch_rpg -->
</table><br />
Le reste, c'est le javascript de la page auquel on ne touche surtout pas.