La contrib Smileys III : Un point d’entrée pour les Frimousses prend déjà en main la conversion des frimousses en images et propose une balise #SMILEY_DISPO pour afficher une liste de frimousses utilisables dans le site. Ici, nous allons juste insérer cette information directement dans le squelette de la balise #FORMULAIRE_FORUM et ajouter la possibilité d’insérer automatiquement une frimousse dans le formulaire (comme pour la barre de typo).
Une démo se trouve ici.
Modifier le squelette
Avant toute chose, il faut copier le squelette de base : formulaire_forum.html du répertoire formulaire vers votre dossier squelette.
Ajouter la liste des frimousses dans ce squelette est simple :
- Il faut s’assurer que le css proposé dans la contrib est bien dans les feuilles de style du site,
- il faut ajouter, ligne 14, la balise qui liste les smileys : #SMILEY_DISPO
</fieldset>
<br />
<fieldset class="spip_encadrer">devient donc :
</fieldset>
<br />
#SMILEY_DISPO
<fieldset class="spip_encadrer">Si vous utilisez le style SPIP par défaut, il faut modifier un petit peu le style de la classe spip_encadrer pour que le formulaire ne se superpose pas aux frimousses. Ajouter donc ce style dans votre fichier css (il faut qu’il soit importé après le fichier css de spip) :
.spip_encadrer {
width : auto;
margin-right: 1em;
}Rendre la liste interactive
La liste de frimousses n’interagit actuellement pas avec le formulaire. Voici les modifications qu’il faut faire pour que cela marche.
Spip utilise le filtre barre_forum pour insérer le formulaire du message avec la barre de typo. Cette barre garde un compteur $num_formulaire pour savoir dans quel formulaire sur cette page la barre doit insérer les raccourcis. Il faut modifier un peu ce filtre pour avoir accès à ce numéros. On va donc en déclarer une copie dans mes_fonctions :
Elle fait essentiellement la même chose, mais rend le numéros de formulaire global pour que tous puissent y accéder.
Changez aussi l’appel au filtre dans le squelette de formulaire. La ligne 18 devient :
[(#ENV{texte}|ma_barre_forum)]
Il faut maintenant ajouter, sur les smileys, le javascript pour qu’ils soient clicables. On déclare un nouveau filtre dans mes_fonctions qui fait cela :
On peut alors l’appliquer à la nouvelle balise dans le squelette du formulaire :
[(#SMILEY_DISPO|ajouter_num_forum)]Vous pouvez aussi ajouter un style à la feuille css des smileys pour que ceux ci n’ai pas une tête de schtroumpf :
ul.listes_smileys li.un_smiley a {
color: black;
text-decoration: none;
}
RSS 2.0