MyBB.support, le portail francophone de MyBB
Un bonnet de Noël sur l'avatar - Version imprimable

+- MyBB.support, le portail francophone de MyBB (https://mybb.fr)
+-- Forum : MyBB.fr (https://mybb.fr/forum-1.html)
+--- Forum : Tutoriels (https://mybb.fr/forum-19.html)
+--- Sujet : Un bonnet de Noël sur l'avatar (/thread-7474.html)



Un bonnet de Noël sur l'avatar - CrazyCat - 30-11-2015

Comme Noël approche, j'ai fait une petite modification pour mettre un bonnet de Noël sur tous les avatars des posteurs (dans la vue des fils).

C'est plutôt simple à faire, mais j'ai bien tâtonné pour trouver exactement quoi faire, alors je vous diffuse ce petit tuto ici.

template:
Il faut modifier le template postbit_avatar pour ajouter un span avec la classe helper.
Code :
<div class="author_avatar"><span class="helper"></span><a href="{$post['profilelink_plain']}"><img src="{$useravatar['image']}" alt="" {$useravatar['width_height']} /></a></div>

Feuille de style:
J'ai créé (depuis l'interface MyBB) une css que j'ai appelée xmas.css. Elle fait une petite modification de author_avatar et la mise en page du span helper, en mode "classique" et en mode "normal":
Code :
div.author_avatar {
  position: relative;
  margin-top: 10px;
}
div.post.classic .helper {
  right: 40px;
  left: auto;
}
div.post .helper {
  background: url("images/small_sh.png") no-repeat transparent;
  display: block;
  left: 35px;
  right: auto;
  top: -10px;
  position: absolute;
  z-index: 5;
  width: 50px;
  height: 55px;
}
Cette feuille de style doit obligatoirement être dans les dernières, pour ne pas être écrasée par les CSS normales de MyBB.
- Les valeurs (en px) des différents réglages right et left sont à ajuster en fonction de l'image que vous désirez afficher.
- Les valeurs de width et height sont celles de l'image.

Voici l'image que j'ai utilisée : [attachment=1586]

Pour le rendu, vous pouvez le voir sur http://ab-plugin.cc/Santa-hat-on-avatar-corners-or-whatever-you-want-t-22.html


 Utilitaire de traduction fourni par Regentronique