Xenforo : Avoir un logo css pivotant à 360° au passage de la souris

  • Auteur de la discussion Auteur de la discussion deleted247906
  • Créé le Créé le
D

deleted247906

Bonjour à tous, voici un tutoriel pour avoir un logo css (liste
Vous devez être inscrit pour voir les liens ! Inscrivez-vous ou connectez-vous ici.
.) tournant à coté d'un pseudo au passage de la souris.
Pour cela, telecharger font awesome
Vous devez être inscrit pour voir les liens ! Inscrivez-vous ou connectez-vous ici.
.
Allez dans votre AdminCP > Apparences > Templates > page_container_js_head
Sous
Code: 
<!--XenForo_Require:JS-->
Mettez
Code: 
<link rel="stylesheet" href="font-awesome-4.1.0/css/font-awesome.min.css">
Ensuit, direction EXTRA.CSS
Donc là je vais mettre en couleurs des parties, la légende se trouve dessous c'est très important !

.username .style3:before {
content: "\f005";
font-family: FontAwesome;
margin-right: 4px;
display: inline-block;
-webkit-transition-duration: 0.8s;
-moz-transition-duration: 0.8s;
-o-transition-duration: 0.8s;
transition-duration: 0.8s;

}
.username:hover .style3:before {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-o-transform: rotate(360deg);

}

Alors, pour ce qui est en rouge : C'est le groupe, pour savoir le numéro d'un groupe allé dans Utilisateurs > Groupe d'utilisateur puis cliquez sur le groupe, regardez dans l'URL le numéro. Remplacez le 3 par le numéro.

f005 : C'est si vous voulez changé le petite icone, là c'est l'étoile pleine. Pour savoir comment changé rendez-vous
Vous devez être inscrit pour voir les liens ! Inscrivez-vous ou connectez-vous ici.
. Cliquez sur l'icone de votre choix, puis regardez:
1423689661-sans-titre.png

J'ai pris comme exemple le logo youtube, mais c'est pareil à tous les logos.
Là en l'occurence si je veux le logo youtube qui tourne, à la place, je vais écrire content: "\f16a";.
J'éspère que ce tutoriel vous aura plus, si vous avez des questions n'hesitez pas ;)
 
Dernière édition par un modérateur:
Merci pour ce tutoriel, tu m'as beaucoup aider ;)
 
désolé de deterrer des anciens sujet mais comment fait on pour assigner un logo a plusieur groupe est ce que je dois C/C le code une 2eme fois et change le groupID?
merci

EDIT: j'ai copié coller le code en entier mais ça ne marche pas
Vous devez être inscrit pour voir les liens ! Inscrivez-vous ou connectez-vous ici.
 
Car le code contient une erreur, ajoute une } à la fin des deux. (j'ai corriger sur le poste)

Et sinon oui c'est juste
 
Je l'ai fais sur des autres forum aucun soucis, et la je bloque sur un autre.

Je fais exactement la même chose que ton post et rien ne change.

Faut une version spéciale de xenforo?
 
Non.
Ta bien installer font awesome & mit la ligne pour l'activer?
 
J'ai bien mis la ligne, mais pas installer FA.

Si FA est pas installer, j'ai juste pas le truc qui tourne et a la place c'est un carré non?

Oui, c'est Scorpion mais je suis chez un pote du coup j'utilise son compte
 
Dernière édition:
Je récupère mon ancien fofo demain soir/après demain, donc je regarderais si je l'ai toujours, j'ai toujours eu des soucis avec xenforo :p
 
C'est possible qu'on face en sorte que il tourne quand on passe la souris, mais que il ne reviennent pas en arrière
 
KiiiNo a dit:
désolé de deterrer des anciens sujet mais comment fait on pour assigner un logo a plusieur groupe est ce que je dois C/C le code une 2eme fois et change le groupID?
merci

EDIT: j'ai copié coller le code en entier mais ça ne marche pas
Vous devez être inscrit pour voir les liens ! Inscrivez-vous ou connectez-vous ici.
Cliquez pour agrandir...
Ta ajoute dans les style de ton groupe
 
Comment installer Font Awesome?
 
Ben tu le télécharges comme j'ai dit & tu met la ligne où j'ai dit
 
Bonjour,
Sa ne fonctionne pas pour moi j'ai tout installer j'ai le style UI.X j'ai mis la ligne pour activer et rien ne change
AIDEZ MOI SVP
 
Merci pour le tutoriel !!
Voici mon forum pour voir le rendu :
Vous devez être inscrit pour voir les liens ! Inscrivez-vous ou connectez-vous ici.
 
Retour
Haut