Bienvenue
sur
Never-Utopia

Tu es déconnecté.

Never-Utopia

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.


    Message RP multi perso

    Partagez
    FémininAge : 66Message(s) : 255

    Les Guildes
    Guilde des Conteurs:
    2/10  (2/10)
    Guilde des Illusionnistes:
    0/0  (0/0)
    Guilde des Architectes:
    0/0  (0/0)
    Elocha
    le Lun 21 Déc 2015 - 15:09


    Bonjour,

    Je me lance dans l'univers incroyable du codage, et vous propose à la suite ma première réalisation personnelle. Il s'agit d'un code qui va faire apparaitre sur le forum, en plus du message RP à proprement parlé, un profil qui n'est pas le votre, par dessus votre profil de compte. J'utilise ça pour jouer des PNJ sur un forum où je suis animatrice. J'ai bidouillé ça sur une idée de Okhmhaka [ICI] qui a changé ma vie de MJ \o/ (maitre du jeu). Du coup, j'ai préparé autant de "code" que de PNJ, chacun le sien, et je n'ai plus qu'à insérer le texte du RP.
     
    Je le propose ici parce que je mélange encore un peu le BBcode et le HTML et qu'avant de le mettre en LS je me dis qu'il faut le nettoyer un peu.


    A quoi ça ressembleuuu ?
    Voilà l'aperçu : Ce qu'on fait est qu'on crée une mise en page qui va aller "par-dessus" la colone du profil et qui va aller le cacher avec votre faux profil. Du coup, dépendement de la largeur/hauteur de votre propre profil, vous devrez sans doute modifier un peu le code pour qu'il corresponde à votre forum.

    Il faut poster à la suite pour le voir ^^. Merci de garder le "copyright" au moins pour le forum ici.

    Le Code


    Pour un profil à gauche
    Code:
    <table style="position: relative; z-index: 15; margin-left:-210px; margin-top:-37px; width:770px"><tr><td style="vertical-align: top; height: 400px;"><img style="border:4px solid #BB9600;" src="http://i66.tinypic.com/14iz7te.png"/></td><td rowspan="2"; valign="top"><div style="border-right:4px solid #BB9600; padding: 10px; height:800px; overflow: scroll"><span style="font-family: Time New Roman; font-size:34px; letter-spacing: -3px;font-variant: small-caps; text-shadow: 3px 3px 3px grey; color: #BB9600;">Titre du Rp.</span><br/>
    <p style="text-align: justify;">
    TEXTE DU RP TEXTE DU RP TEXTE DU RP TEXTE DU RP
    </p>
    </div></td></tr><tr><td style="vertical-align: top; width: 200px; height: 400px; color: #BB9600;">
    <span style="font-size:200%">Prénom<br/>NOM</span><br/><span style="font-size:100%">
    <p align="justify">âge, civilités etc<br/>taille ~poids<br/><br/><br/>
    Petite bio jolie pour ceux qui aime ça, ou bien compétences et statistiques quand vous en avez. Il y a largement la place de mettre du texte comme vous voulez.<br/><br/></p></span>
    </td></tr></table>
    <p style="text-align:right";><strong>Réponse attendue pour le XX-XX-XX au plus tard</strong></p>
    <div style="texte-align:center; color:#cccccc; font-size:75%;">Code par Elocha sur <a href="url=http://www.never-utopia.com/">Nerver-Utopia</a></div>

    Pour un profil à droite :
    Code:
    <table style="margin-right:-210px; margin-top:-40px; width:800px"><tr><td rowspan="2"; valign="top"><div style="border-right:4px solid #BB9600; padding: 10px; height:800px; overflow: scroll"><span style="font-family: Time New Roman; font-size:34px; letter-spacing: -3px;font-variant: small-caps; text-shadow: 3px 3px 3px grey; color: #BB9600;">Titre du Rp.</span><br/>
      <p style="text-align: justify;">
    TEXT Du RPTEXT Du RP TEXT Du RP TEXT Du RP TEXT Du RP TEXT Du RP TEXT Du RP
      </p>
    </div></td>
      <td style="height: 400px; vertical-align: top;"><img style="border:4px solid #BB9600;" src="http://i66.tinypic.com/14iz7te.png"/></td></tr><tr><td style="height: 400px; width: 200px; vertical-align: top; color: #BB9600;"><span style="font-size:200%">Prénom<br/>NOM</span><br/><span style="font-size:100%">
      <p style="text-align: justify;">âge, civilités etc<br/>taille ~poids<br/><br/><br/>
    Petite bio jolie pour ceux qui aime ça, ou bien compétences et statistiques quand vous en avez. Il y a largement la place de mettre du texte comme vous voulez.<br/><br/></p></span>
      </td></tr></table>
      <p style="text-align:right; font-size:100%;">Réponse attendue pour le XX-XX-XX au plus tard</p>
    <div style="texte-align:center; color:#cccccc; font-size:75%;">Code par Elocha sur <a href="url=http://www.never-utopia.com/">Nerver-Utopia</a></div>

    Usage


    Structure : Évidement ici c'est un dessin avec la colonne de profil à gauche...
    le tableau tout nu

    • Il faudra jouer sur les positions en début de code ainsi que sur la largeur des colonnes pour bien superposer le profil et le message sur ce que fait le forum normalement.
    • J'ai gardé deux lignes dans la première colonne parce que, ainsi, je peux gérer la partie basse du profil selon mes besoin séparément de la partie haute (avatar du PNJ).
    • Pour ceux qui affichent la colonne de profil à droite il suffit d'inverser l'ordre des colonnes dans le code et de changer l'alignement des marges (je vous propose les deux codes).
    • Sur cette version, les avatars sur ce forum font 200*400 et ne sont pas "resized".
    • Pour chaque personnage il faut changer l'avatar, la couleur éventuellement, et bien sûr le petit texte de présentation de votre PNJ.
    • Astuce : les couleurs du cadre sont celle du groupe en fait, ce qui permet aux joueurs d'identifier le PNJ rapidement -et pratiquement inconsciemment-


    Dernière édition par Elocha le Mar 26 Juil 2016 - 13:39, édité 6 fois


    eLoChA.
    FémininAge : 22Message(s) : 5018

    Les Guildes
    Guilde des Conteurs:
    0/10  (0/10)
    Guilde des Illusionnistes:
    0/10  (0/10)
    Guilde des Architectes:
    10/10  (10/10)
    NyoTheNeko
    le Lun 21 Déc 2015 - 16:54
    Tu as posté au mauvais endroit ^^ Je déplace! =D


    FémininAge : 66Message(s) : 255

    Les Guildes
    Guilde des Conteurs:
    2/10  (2/10)
    Guilde des Illusionnistes:
    0/0  (0/0)
    Guilde des Architectes:
    0/0  (0/0)
    Elocha
    le Lun 21 Déc 2015 - 17:12
    merf !merci Embarassed


    eLoChA.
    FémininAge : 24Message(s) : 1399

    Les Guildes
    Guilde des Conteurs:
    0/0  (0/0)
    Guilde des Illusionnistes:
    0/0  (0/0)
    Guilde des Architectes:
    0/0  (0/0)
    Kelalin
    le Lun 21 Déc 2015 - 18:47
    Merci pour le partage ! (`・ω・´)
    FémininAge : 66Message(s) : 255

    Les Guildes
    Guilde des Conteurs:
    2/10  (2/10)
    Guilde des Illusionnistes:
    0/0  (0/0)
    Guilde des Architectes:
    0/0  (0/0)
    Elocha
    le Lun 21 Déc 2015 - 22:56
    bon j'ai ajouté ce que j'ai pu MAIS je n'ai pas été en mesure de reproduire ce code sur un autre forum pour que ça marche, je ne sais pas pourquoi. le tableau ne s'affiche pas hors des marges du postbody, faire mumuse avec des z-index n'y change rien ><.

    je suis désespoir XD


    eLoChA.
    FémininAge : 22Message(s) : 5018

    Les Guildes
    Guilde des Conteurs:
    0/10  (0/10)
    Guilde des Illusionnistes:
    0/10  (0/10)
    Guilde des Architectes:
    10/10  (10/10)
    NyoTheNeko
    le Mer 2 Mar 2016 - 17:58
    Hello Elocha!
    Il y a plusieurs soucis avec ton code: notamment, tu utilises la balise center, la balise small et la balise font, toutes les trois dépréciées. Tu devrais les remplacer les trois par une seule et unique div qui mettrait un text-align: center, une taille petite et un color.
    Ensuite, tu as des balises ouvertes qui ne sont jamais fermées (une balise tr et une balise div) dans tes deux codes.
    Ensuite, si je comprends bien, tu essaies de faire en sorte que le nouveau profil recouvre l'actuel d'une personne c'est bien ça?


    FémininAge : 66Message(s) : 255

    Les Guildes
    Guilde des Conteurs:
    2/10  (2/10)
    Guilde des Illusionnistes:
    0/0  (0/0)
    Guilde des Architectes:
    0/0  (0/0)
    Elocha
    le Mer 2 Mar 2016 - 20:33
    Ah merci !

    oui c'est bien ce que j'essaie de faire.

    (je corrige le code en fonction de tes remarques)


    eLoChA.
    FémininAge : 22Message(s) : 5018

    Les Guildes
    Guilde des Conteurs:
    0/10  (0/10)
    Guilde des Illusionnistes:
    0/10  (0/10)
    Guilde des Architectes:
    10/10  (10/10)
    NyoTheNeko
    le Jeu 3 Mar 2016 - 13:06
    Dans ta seconde td tu as encore un font ^^


    FémininAge : 25Message(s) : 18542

    Les Guildes
    Guilde des Conteurs:
    4/10  (4/10)
    Guilde des Illusionnistes:
    3/10  (3/10)
    Guilde des Architectes:
    4/10  (4/10)
    Neva
    le Mar 19 Juil 2016 - 11:34
    @Elocha , tu es toujours là ? Tu as du temps pour finir de modifier le code ? :)


     
    FémininAge : 23Message(s) : 2596

    Les Guildes
    Guilde des Conteurs:
    0/10  (0/10)
    Guilde des Illusionnistes:
    1/10  (1/10)
    Guilde des Architectes:
    13/20  (13/20)
    Onyx
    le Dim 2 Oct 2016 - 22:53
    Salut !

    N'ayant pas eu de retour, j'ai effectué les modifications. Du coup, je valide le code !

    Merci de ton partage !


    FémininAge : 66Message(s) : 255

    Les Guildes
    Guilde des Conteurs:
    2/10  (2/10)
    Guilde des Illusionnistes:
    0/0  (0/0)
    Guilde des Architectes:
    0/0  (0/0)
    Elocha
    le Lun 3 Oct 2016 - 10:14
    Oui, toujours là.
    j'avais fait les modifications mais n'avais pas pu posté (je n'avais plus les droits sur le moment ^^)


    eLoChA.
    Contenu sponsorisé
    Aujourd'hui à 7:00

      La date/heure actuelle est Dim 4 Déc 2016 - 7:00