Ce tutoriel a été publié par final-blond -sur la base du "voir/cacher" des profils du SF-BB de ze_chaofan- sur SOS-Forum. Afin que les tutoriels de SOS-Forum restent en libre accès, ainsi que par respect du travail accompli, tout tutoriel copié ou s'en inspirant publié ailleurs qu'ici, devra en citer le ou les auteurs ainsi que la provenance via un lien vers ce sujet sur le SOS-Forum.

Bonjour Ladys n'Gentlemen,

Après avoir trouvé une manière d'Afficher/cacher le profil des posts avec un système de bouton qui s'alterne sur Afficher et ensuite sur Cacher comme ici
j'aimerais savoir comment remettre le cadre qui entoure les champs du profil et le rend bien plus propre et plus joli comme ici sur SF.

Voici ce que j'ai dans le template viewtopic_body :

Code:

{postrow.displayed.RANK_IMAGE}</div><br />
<div align="left"><div class="quotetitle"><input type="button" value="View Profil" style="width:70px;font-size:10px;margin:0px;padding:0px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';        this.innerText = ''; this.value = 'Hide Profil'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'View Profil'; }" /></div><div class="quotecontent"><div style="display: none;"><br /><font size="1">

 <!-- BEGIN profile_field -->
  <b>{postrow.displayed.profile_field.LABEL}</b> <font color="black">{postrow.displayed.profile_field.CONTENT}</font>{postrow.displayed.profile_field.SEPARATOR}
  <!-- END profile_field -->

{postrow.displayed.POSTER_RPG}

</font></div></div></div>

Et dans le CSS le code par défaut de la version 1.1.0 :

/*Menu_Profil-------------------------------------------------*/
.profilpop { padding: 5px; margin-left: -2px; background-color: #FAFAFA; border: 1px solid #02374F;}

---

---

Pour ceux qui ne souhaitent pas ajouter ce petit espace qui se forme, mais plutôt inclure le profil dans sa colonne normale, voici comment faire :

Rendez-vous dans ce même template (PA >> Affichage >> Templates >> Général >> viewtopic_body)
Cherchez (Ctrl + F) :

Code:

<tr class="post">

Sélectionnez :

Code:

<tr class="post">
      <td class="{postrow.displayed.ROW_CLASS}"{postrow.displayed.THANK_BGCOLOR} valign="top" width="150">
         <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><br />
         <img src="http://2img.net/i/fa/vide.gif" alt="" style="width:150px;height:1px" />
      </td>

Et tu remplacez par :

Code:

<tr class="post">
      <td class="{postrow.displayed.ROW_CLASS}"{postrow.displayed.THANK_BGCOLOR} valign="top" width="150">
        <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 />
            <div onClick="this.firstChild.value=(this.firstChild.value=='See')?'Mask':'See';this.lastChild.style.display=(this.firstChild.value=='See')?'none':'block';" style="text-align: center;"><input type="button" value="See" class="profil1"/><div style="display: none; text-align: left;">
            <!-- 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}
            </div></div>
        </span><br />
        <img src="http://2img.net/i/fa/vide.gif" alt="" style="width: 150px; height: 1px;" />
      </td>

Vous aurez ça.

Nota : Vous pourrez changer le "See" et le "Mask" par ce que ce que vous voulez, mais alors il faut le faire partout où se trouvent ces attributs.

Nota 2 : Tuto récupéré sur le fdf dans le cadre de cette entraide (il y a un lien au-dessus de mon post).

Hum, j'en suis pas tout à fait sûr, mais essaye.
Dans ton template, remplace ceci :

Code:

<font size="1">

 <!-- BEGIN profile_field -->
 
<b>{postrow.displayed.profile_field.LABEL}</b> <font
color="black">{postrow.displayed.profile_field.CONTENT}</font>{postrow.displayed.profile_field.SEPARATOR}
  <!-- END profile_field -->

{postrow.displayed.POSTER_RPG}

</font>

Par ceci :

Code:

<div style='position:absolute;' class="profilpop"><span class="genmed"><font size="1">


  <!-- 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}

</font></span></div>