Rappel du premier message :
Bulle BD
Aperçu
I - CSS
2 - Templates
Rendez vous dans Affichage > Templates > Général > Viewtopic_body
Repérer ceci
Mettez devant
Mettez derrière la balise "...MESSAGE}"
Style tchat pour contenue rp
1 - Code pour vos messages
Bulle BD
Aperçu
I - CSS
- Code:
#bulle {
position: relative;
color : #000000;
background: #ffffff;/** couleur du fond (se retrouve 2 fois) **/
font-size:16px;
border: 5px solid #FFFFFF; /** taille de la bordure et couleur (se retrouve 2 fois) **/
width:601px;
min-height:100px;} /** dimensions de la cellule (du cadre) **/
#bulle:after, #bulle:before {right: 100%; /** right pour mettre la flèche à gauche ! **/
border: solid transparent; content: ""; position: absolute;}
#bulle:after {border-right-color: #ffffff; /** 2e indication de couleur du fond **/
border-width: 33px; /** grandeur de la flèche **/
top: 50%; /** position de la flèche (se retrouve 2 fois) **/
margin-top: -33px;} /** indication de la grandeur de la flèche (valeur négative) **/
#bulle:before {border-right-color: #FFFFFF; /** 2e indication de la couleur de la bordure **/
border-width: 40px; /** indication de la grandeur de la flèche +7px **/
top: 50%; /** 2e indication de la position de la flèche **/
margin-top: -40px; } /** indication de la grandeur de la flèche +7px (valeur négative) **/
2 - Templates
Rendez vous dans Affichage > Templates > Général > Viewtopic_body
Repérer ceci
- Code:
<div>{postrow.displayed.MESSAGE}</div>
Mettez devant
- Code:
<div id="bulle">
Mettez derrière la balise "...MESSAGE}"
- Code:
</div>
Style tchat pour contenue rp
Aperçu
1 - Code pour vos messages
- Code:
<img style="width: 62px; height: 62px;" src="URLICONSINTERLOCUTEUR" /><img style="width: 549px; height: 62px;" src="http://img15.hostingpics.net/pics/548257tchat2.png"
<div id="bulle" style="font-family:'Aldrich'" /> blabla</div><img style="width: 4589px; height: 62px;" src="http://img15.hostingpics.net/pics/227626tchat.png" /><img style="width: 62px; height: 62px;" src="URLICONSPERSONNEL" />
<a href="http://www.never-utopia.com/" style="font-size:11px; color:#767676; text-decoration:none;">© By ElektraKloo sur Never-Utopia</a>
ATTENTION NE PAS COMBINER LES DEUX SINON CELA FAIT DOUBLE BULLE
Mettre un crédit vers Never-Utopia est obligatoire. Retirer un crédit est interdit.
Si vous avez des problèmes avec ce LS, venez poster ici.
Merci de laisser un message pour donner vos impressions, commentaires et/ou remerciements ^^
Dernière édition par Elektra Kloo le Mar 31 Mar 2015 - 13:03, édité 1 fois
