1 Templates + CSS : Bouton "En ligne/Hors ligne" 26/2/2009, 23:32
Ce tutoriel a été publié par ze_chaofan sur SOS-Forum. Afin que les tutoriels de SOS-Forum restent en libre accès, ainsi que par respect du travail accompli, tout tutoriel copié ou s'en inspirant publié ailleurs qu'ici, devra en citer le ou les auteurs ainsi que la provenance via un lien vers ce sujet sur le SOS-Forum. |
Hello everybody !
Un autre tuto combinant le CSS et les templates.
Celui vous permettra d'afficher à la place du bouton "en ligne" dans vos messages, un bouton "hors ligne" lorsque vous êtes... hors ligne évidement.
Pour ce tuto, il est nécessaire :
> D'être sur un forum en phpbb2
> D'en être le fondateur
> D'avoir deux images, un pour "en ligne", l'autre pour "hors ligne"
> Les deux images doivent être de même dimensions.
Commençons par un petit aperçut avant tout :
La manip :
1- Tout d'abord, mettez votre image "en ligne" à sa place normale, dans la gestion des images. Validez.
2- Maintenant, rendez-vous dans la gestion des couleurs, puis basculez sur l'onglet CSS, et collez ceci :
Remplacez :/*Online_Offline-------------------------------------------------*/
.offlinebutton {
background-color: transparent;
border: none;
background-image: url('url_image_offline');
background-repeat : no-repeat;
background-position : center;
min-width: Xpx;
width: Xpx;
min-height: Ypx;
height: Ypx;
}
url_image_offline > par l'adresse de l'image du bouton "Hors ligne"
X > par la largeur du bouton "en ligne"
Y > par la hauteur du bouton "en ligne"
Validez et c'est fini pour le CSS
3- Maintenant, passons aux templates. Allez donc dans la section Affichage/Templates/Général, puis ouvrez le template "viewtopic_body", et dedans, cherchez ceci et supprimez-le.
{postrow.displayed.ONLINE_IMG}
Puis cherchez alors :
Et insérez ceci :{postrow.displayed.POSTER_RPG}
</span><br />
{postrow.displayed.POSTER_RPG}
</span><br />
<table border=0 cellspacing=0 cellpadding=0 class="offlinebutton"><tr><td>{postrow.displayed.ONLINE_IMG}</td></tr></table><br />
Validez puis confirmez la modification et c'est prêt !
Vous l'aurez remarqué, le bouton a été déplacé, en effet, afin d'éviter les soucis avec les forums les plus petits. J'espère que ce tuto vous aura intéressé !
Dernière édition par ze_chaofan le 27/2/2009, 01:32, édité 2 fois