AccueilDernières imagesRechercherS'enregistrerConnexion

Forum de graphisme, codage et game design proposant des tutoriels, astuces, libres services et commandes dans les domaines de l'infographie amateur, de l'intégration web (HTML et CSS essentiellement) ainsi que dans la conception de RPG sur forum.

Le Deal du moment : -29%
PC portable – MEDION 15,6″ FHD Intel i7 ...
Voir le deal
499.99 €

    Mise en forme de profil - ForumActif

    ClaryF
    ClaryF
    FémininAge : 33Messages : 138

    Lun 17 Mar - 20:57

    Mise en forme du profil



    Bonjour. Alors voilà, je me décide à poster une "petite" demande...je désespère. Je suis à la recherche d'une mise en forme de profil, pour mon forum. Quelque chose de "simple" - en apparence mais je doute que ce soit en pratique - mais de joli, en fait. Je ne trouve pas vraiment mon bonheur..et ce depuis un bon moment.

    Alors voilà. Je remercie d'avance la personne qui voudra bien prendre de son temps pour travailler sur ma demande. ~


    Schéma(s) et Eléments
    Schémas : Alors, pour le schéma, j'ai tenter de faire au plus simple. J'espère que c'est assez clair. Voici ; https://i.servimg.com/u/f58/18/17/15/99/sans_t29.jpg . J'ai appliquer fond noir, parce qu'il s'agit de la couleur de fond de mon forum. L'idée c'est donc des petits "cadres" (?) pour les éléments du profil. Le petit "i am" au dessus du pseudo, si ce n'est pas possible tant pis, c'est juste une fantaisie. Le pseudo je le vois bien entre ses guillemets en assez "grand" donc. Pour terminer, le "Ouvrir" correspondrait à quelque chose de cliquable, qui permettrait d'afficher la "Fiche de personnage".
    Tailles des éléments : La seule taille vraiment indispensable à connaître est la taille de l'avatar ; 200*400 px.
    Effets voulus : Un effet sur l'avatar peut être, comme un voile blanc dessus qui disparaît lorsqu'on passe la souris dessus...je ne sais pas si je m'exprime au mieux.


    Ressources
    Rien de particulier ! ~

    Autres précisions ?
    Je pense avoir tout dis. Au besoin je peux ajouter des précisions si on me les demande. Je remercie encore un bon millions de fois la personne qui s'intéressera à ma demande. ♥ & j'espère poster là il le faut.
    Anonymous
    Invité

    Dim 23 Mar - 10:29

    Plop,

    Mon résultat : www
    ClaryF
    ClaryF
    FémininAge : 33Messages : 138

    Dim 23 Mar - 13:30

    Bonjour.

    Merci d'avoir pris du temps pour cette demande ! ~ C'est niquel, exactement ce que je voyais !
    Anonymous
    Invité

    Dim 23 Mar - 13:33

    Voici donc les codes =3

    CSS
    Code:
    /* --------------------------------- PROFIL --------------------------------- */

    .profilmasque {
      background-color: #201E1E;
      width: 200px;
      padding: 10px;
      font-size: 11px;
      font-family: 'Voltaire', sans-serif !important;
    }

    .profil1 {
      width: 200px;
      font-size: 20px;
      font-family: 'Miniver', cursive;
      background-color: #201E1E;
      border: none;
      color: #B7B3B3;
    }

    .profil {
      background-color: #0D0D0D;
      padding: 10px;
      border-radius: 25px;
    }

    .rang {
      background-color: #201E1E;
      padding: 10px;
      width: 200px;
      text-align: center;
      color: #007BAA !important;
      font-size: 25px;
      font-family: 'Miniver', cursive;
    }

    .rang:hover {
      color: #B7B3B3 !important;
    }

    .avatar_profil {
      width: 200px;
      height: 400px;
      opacity: 0.5;
    }

    .avatar_profil:hover {
      opacity: 1;
    }

    .bloc_pseudo {
      padding: 10px;
      width: 200px;
      position: relative;
      left: 1em;
      text-align: center;
      color: #D5D2D2;
      font-size: 25px;
      font-family: 'Miniver', cursive;
    }

    .pseudo_profil {
      font-family: 'Finger Paint', cursive;
      font-size: 25px !important;
      text-align: center;
    }

    .details_profil {
      background-color: #201E1E;
      padding: 10px;
      width: 200px;
      height: 80px;
      overflow: auto;
      text-align: justify;
      color: #B7B3B3 !important;
      font-size: 11px;
      font-family: 'Voltaire', sans-serif !important;
    }

    /* --------------------------------- FIN PROFIL --------------------------------- */

    Template viewtopic_body, repères ceci :
    Code:
    <!-- BEGIN displayed -->
       <tr class="post post--{postrow.displayed.U_POST_ID}" id="p{postrow.displayed.U_POST_ID}" style="{postrow.displayed.DISPLAYABLE_STATE}">
          <td class="{postrow.displayed.ROW_CLASS}"{postrow.displayed.THANK_BGCOLOR} valign="top" width="150">
             <span class="name"><a name="{postrow.displayed.U_POST_ID}" style="position: relative; top: -30px; width: 1px;" id="{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/empty.gif" alt="" style="width:150px;height:1px" />
          </td>

    Que tu remplaces par :
    Code:
    <!-- BEGIN displayed -->
      <link href='http://fonts.googleapis.com/css?family=Finger+Paint|Miniver|Zeyada' rel='stylesheet' type='text/css'>
       <tr class="post post--{postrow.displayed.U_POST_ID}" id="p{postrow.displayed.U_POST_ID}" style="{postrow.displayed.DISPLAYABLE_STATE}">
          <td class="profil" class="{postrow.displayed.ROW_CLASS}"{postrow.displayed.THANK_BGCOLOR} valign="top" width="150">
                     
                      <br /><div class="rang">{postrow.displayed.POSTER_RANK}</div>
                      <br /><center><div class="avatar_profil">{postrow.displayed.POSTER_AVATAR}</div></center>
                      <span class="bloc_pseudo"><a name="{postrow.displayed.U_POST_ID}" id="{postrow.displayed.U_POST_ID}"></a>I am </span><div class="pseudo_profil">{postrow.displayed.POSTER_NAME}</div><br />
            <div class="details_profil"><!-- BEGIN profile_field -->
                {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
                        <!-- END profile_field --></div><br />
             <div class="profilmasque" onClick="this.firstChild.value=(this.firstChild.value=='Ouvrir')?'Fermer':'Ouvrir';this.lastChild.style.display=(this.firstChild.value=='Ouvrir')?'none':'block';" style="text-align: center;"><input type="button" value="Ouvrir" class="profil1"/><div style="display: none;  text-align:left;">
                {postrow.displayed.POSTER_RPG}
      </div></div>   
                      <br />
             <img src="http://2img.net/i/fa/empty.gif" alt="" style="width:150px;height:1px" />

    Dis-moi si tout colle =P
    ClaryF
    ClaryF
    FémininAge : 33Messages : 138

    Dim 23 Mar - 14:21

    Tout est parfait !
    Un grand merci, vraiment. Je n'oublie bien sûr pas le crédit ! ~
    Anonymous
    Invité

    Dim 23 Mar - 14:21

    Nickel =D
    Bonne continuation alors Wink
    Contenu sponsorisé


      La date/heure actuelle est Sam 27 Avr - 10:35