Bonjour (:
A partir de ce tuto => http://www.css-actif.com/t12680-infobulle-avec-effets-css3 et de ce tuto =>http://www.css-actif.com/t11372-infos-du-profil-derriere-l-avatar-comme-cssactif?highlight=Rechercher+++++Avatar

C'est possible de faire un mix des deux ? Je m'explique : au survolage de l'avatar une infobulle avec les information du personnage du type Clan, Rang, Âge, Relations ? :DD
Merciii !

Bonsoir,

Probablement, oui.

Il y a justement un tutoriel qui permet de placer le profil dans l'infobulle : http://www.css-actif.com/t5685-mettre-les-infos-de-profil-dans-une-infobulle

A toi de l'adapter avec le style d'infobulle que tu veux.

(En dehors de la fonction recherche, il existe aussi le sens commun : tu as de bonnes chances de trouver d'autres tutoriels intéressants dans une catégorie intitulée "profil" :p)

Merci (:
Et si je veux que ce soit seulement la feuille du personnage dans l'infobulle et que tout ce qui est "Localisation, Message, âge " n'y soient pas ?
Sachant qu'avant que je mette le code, mon onglet contact & info se trouvait sous le profil /:

Citation :

Et si je veux que ce soit seulement la feuille du personnage dans l'infobulle et que tout ce qui est "Localisation, Message, âge " n'y soient pas ?

Bah tu n'y mets que la partie de code qui correspond, et tu laisses le reste à sa place '_' C'est à dire juste ça :

Code:

{postrow.displayed.POSTER_RPG}

Pourtant c'est ce que j'ai fait :


Mais il n'y a rien qui s'affiche dans l'infobulle et rien sous l'avatar.

Heu, oui, c'est normal XD


Les champs de profil constituent ce bloc ci :

Code:

<!-- BEGIN profile_field -->
    {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
<!-- END profile_field -->

Si tu en retires un bout, ça ne marchera pas. En l'occurence ici, tu as retiré les deux commentaires BEGIN et END qui ne sont pas là pour décorer.

Et à l'inverse, les champs de profil RPG concernent cette SEULE variable :

Code:

{postrow.displayed.POSTER_RPG}

Il manque également un </div> à la fin (juste après le commentaire qui dit, justement, "fermeture du div blocProfil".)

J'ai fais tout fouilli quoi >.<
Voilà ce que ça me donne au final :


Cependant je retombe au début : j'ai toujours âge, localisation, date d'inscription dans l'infobulle alors que j'aimerais que ces infos se trouvent sous l'avatar et que dans l'infobulle il y ait trois champs originaire de la feuille du personnage (que j'ai généré)
J'avais essayé donc de déplacer les trois commentaire qui se trouvent entre Begin / END sous "Fermeture bloc profil" mais rien du tout ;_;

Je commence à me demander si tu le fais exprès

Tu as DEUX blocs de codes importants.
1 - celui qui contient les champs de profil :

Code:

<!-- BEGIN profile_field -->
    {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
<!-- END profile_field -->

2 : Celui qui contient les champs de profil RPG :

Code:

{postrow.displayed.POSTER_RPG}

Ces deux ne doivent pas être mélangés (je vois pas pourquoi tu as fait ça )

Ensuite, tu veux mettre quelque chose dans une infobulle au survol de l'avatar.

Ton code doit ressembler à ceci :

Code:

<!-- OUVERTURE DU DIV .blocProfil -->
<div class="blocProfil">
  {postrow.displayed.RANK_IMAGE}
  <!-- DEBUT PROFIL MODIFIÉ : Infos de profil en infobulle -->
  <div class="ProfilInfobulle">
    {postrow.displayed.POSTER_AVATAR}
    <div>
      ICI CE QUI APPARAIT DANS L'INFOBULLE
    </div>
  </div>
  <!-- FIN PROFIL MODIFIÉ -->
<!-- FERMETURE DU DIV .blocProfil -->
</div>
ICI TU METS LE RESTE, profil, whatever.

J'ai mis deux "ICI ...", tu dois remplacer chacun des deux par un des blocs 1 ou 2 que j'ai mentionné juste au dessus.

Fais ça, valide le template, montre moi le résultat sur ton forum et sur ton code, et ne touche à rien d'autre (pas de "j'ai effacé parce que ça ne marchait pas", s'il te plait)

Gomen gomen gomen gomen...
Mon rendu :

=> http://forum---test.creationforum.net/t1-votre-1er-sujet

Voilà, maintenant on a des bases à peu près saines @_@

Maintenant, la question est de savoir pour quelle obscure raison le poster_rpg ne fait pas ce qu'il est sensé faire... Je viens de tester sur mon forum et ça marche au poil O_o

Les champs de profil rpg sont bien actifs ?

Je me le demande, est-ce qu'il faut faire quelque chose en particulier ?
Je peux créer des champs pour la feuille de personnage, normalement si cela se peut alors ça veut dire que le champs profil RPG est activé non ? :/

"Ce membre n'a pas activé sa feuille de personnage." Il faut que tu actives la feuille de personnage de ton compte...

Ha, bah c'est tout bon !

Aussi, qu'est-ce que je dois faire jouer pour relever un peu mes infos dans l'infobulle, changer la couleur des intitulés et sophistiquer un peu l'infobulle ?

Une seule réponse à ça : Jongler avec les CSS XD

Tant que je ne dois pas jongler avec le template ça me va !
Pour revenir très rapidement au profil, à quel endroit je dois mettre le Label, Separator etc pour qu'ils soient dans le cadre rose sous l'avatar ?

Il faut le placer juste avant "fermeture du div blocprofil" @_@

Si je mets
ça permettra que les infos ne soient pas en partie mangées par l'avatar ou pas ?
Aussi, pourrais rapidement m'aider à trouver où je dois mettre les rouges et je sais pas du tout où mettre leur compagnes

Edite le et signale moi quand tu l'auras fait u_u'

Edit : Pour l'avatar qui mange le profil, d'une NE METS SURTOUT PAS DE BR (c'est le style qui s'occupe de la mise en page, pas les sauts de ligne !), d'autre part le problème vient de ton CSS :
Le sélecteur .postdetails.poster-profile a img s'est vu attribuer une marge négative qui n'a rien à faire là : retire-là.

J'ai supprimé le HTML de mon précédant message donc, mais je comprends pas, ça ne posait pas de problème avant quand je te montrais le même bout de HTML ? D:

Relit ton message et tu comprendras de quoi je parlais...

J'ai voulu aller trop vite, désolée.
Donc :

Citation :

Si je mets

Code:

<br>

ça permettra que les infos ne soient pas en partie mangées par l'avatar ou pas ?
Aussi, pourrais rapidement m'aider à trouver où je dois mettre les
manquantes ? Je vois qu'il y a des

Code:

</div>

rouges et je sais pas du tout où mettre leur compagnes

Aussi concernant la marge négative ( je vois pas trop ce que c'est) c'est bien de cela que tu veux parler :

Code:

<div class="postdetails poster-profile">

?

Non, je parle du CSS, et du sélecteur que j'ai mentionné. Il y a un margin avec une valeur de -10px u_u'

Les div rouges sont probablement causés par le fait que tu écris <br> au lieu de <br />. L'analyseur de FA est naturellement basé sur le xHTML, si tu ne fermes pas les balises orphelines il va tiquer.

Ha merci j'ai réussi (:
Pour l'infobulle est-ce qu'il y a des tuto qui nous donnent une liste avec toutes les personnalisations qu'on peut y faire via CSS ou pas ?
Aussi pour l'infobubble je n'arrive pas à redresser les info qui sont à l'interieur, je cherche niveau CSS mais je crains que ce ne soit dans les templates qu'il faille y aller /:

Pour le CSS, je t'oriente vers la section du forum consacrée aux Bases du CSS, il n'y a pas de formules magiques pour s'en servir.

Je n'ai pas compris ce que tu voulais dire par "redresser les infos" '_'

Et fondamentalement, tu n'as plus besoin des templates, le reste est juste de la magouille CSS avec les bons sélecteurs, en l’occurrence :

• .blocProfil pour le bloc à fond rose qui contient l'avatar et le profil
  
• .ProfilInfobulle pour le bloc qui contient l'avatar + infobulle
  
• .postdetails.poster-profile a img pour cibler l'avatar tout seul
  
• div.ProfilInfobulle > div pour cibler l'infobulle (à ce stade là elle est cachée mais on peut lui donner des effets quand même)
  
• div.ProfilInfobulle:hover > div pour cibler l'infobulle (quand elle s'affiche)
  
• .blocProfil > div + div pour cibler les informations de profil en dessous de l'avatar
  
• .postdetails.poster-profile + div pour cibler la partie avec le bouton "contact&Infos"
  
• .postdetails.poster-profile + div input pour mettre en forme le bouton input

Dans mon infobulle les infos sont un peu trop décalée vers le bas de l'infobulle, c'est de ça que je voulais parler en disant " redresser "

Merci pour l'explication détaillée des sélecteurs ! J'ai lu le cours proposé par Orange également. Mais si on veut créer une bordure sur un côté sur deux de l'infobulle ? On doit utiliser le paragraphe qui parle des margin, border, padding ? :>.<: