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 :
function ma_barre_forum($texte)
{
include_ecrire('inc_layer.php3');
if (!$GLOBALS['browser_barre'])
return "<textarea name='texte' rows='12' class='forml' cols='40'>$texte</textarea>";
global $num_formulaire;
$num_formulaire++;
include_ecrire('inc_barre.php3');
return afficher_barre("document.getElementById('formulaire_$num_formulaire')", true) .
"
<textarea name='texte' rows='12' class='forml' cols='40'
id='formulaire_$num_formulaire'
onselect='storeCaret(this);'
onclick='storeCaret(this);'
onkeyup='storeCaret(this);'
ondbclick='storeCaret(this);'>$texte</textarea>";
}
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 :
function ajouter_num_forum($texte) {
include_ecrire('inc_layer.php3');
if (!$GLOBALS['browser_barre']) {
return $texte;
}
global $num_formulaire;
while(preg_match('@<li class="un_smiley"><span class="smiley_nom">(.*?)</span>@',$texte,$match)) {
$fr = ' '. texte_script($match[1]) .' ';
$texte = str_replace($match[0], '<li class="un_smiley"><a href="javascript:barre_inserer(\''.$fr.'\',document.getElementById(\'formulaire_'.($num_formulaire+1).'\'))" title="Inserer la frimousse: '.$match[1].'"
onMouseOver="helpline(\'Inserer la frimousse: '.$fr.'\',document.getElementById(\'barre_'.($num_formulaire+1).'\'))"
onMouseOut="helpline(\'Utilisez les raccourcis typographiques pour enrichir votre mise en page\', document.getElementById(\'barre_'.($num_formulaire+1).'\'))"><span class="smiley_nom">'.$match[1].'</span>', $texte);
}
return str_replace('</span></li>', '</span></a></li>', $texte);
}
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;
}
Discussions par date d’activité
Une discussion
Merci pour cette contribution, je suis presque arrivé à faire fonctionner les « frimousses » :)
J’ai l’affichage, les liens aux dessus des frimousses, tout comme il faut...
Mais j’ai deux difficultés :
1) J’ai une erreur javascript quand je clique sur le lien qui doit insérer la frimousse et qui ne le fait donc pas.
2) J’aimerai pouvoir mettre des smileys personnalisés, j’ai modifié la liste dans « mes_fonctions.php3 », mais sans résultat. Comment devrais-je m’y prendre ?
Merci d’avance pour tout renseignement.
Qu’elle est l’erreur javascript ? avec quel navigateur ?
il faut modifier la fonction liste_smileys() et changé les noms de fichier listé là en conséquence.
Répondre à ce message
Ajouter un commentaire
Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :
Merci d’avance pour les personnes qui vous aideront !
Par ailleurs, n’oubliez pas que les contributeurs et contributrices ont une vie en dehors de SPIP.
Suivre les commentaires : |