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.


1 résultat trouvé pour auteur_Elocha

Elocha

Message RP multi perso - 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-


Revenir en haut

La date/heure actuelle est Jeu 28 Mar 2024 - 14:53