[Résolu] [TUTO] Configurer la smilebox de WysiBB editor - Programmation - JavaScript

Balatharas Le 3 septembre 2016 à 14:02 (Édité le 9 avril 2019 à 20:45)

Hello, me revoilà pour un nouveau tuto 😋 ! Aujourd'hui je vais vous montrer comment utiliser la smilebox de Wysibb, comme celle-ci:

Tuto demandé par @Blast0Kd

Étape n°1 Le bouton:
Alors d'abord on va aller dans le fichier jquery.wysibb.js que vous avez sans doute insérer pour avoir les boutons en français. Vers la ligne 307 (normalement) vous allez avoir smilebox.
Copiez, puis collez a la ligne 307 ceci:

smilebox: {
   title: 'Insérer un emoji',
   subInsert: true,
   type: 'smilebox',
   buttonHTML: '<span class="fonticon ve-tlb-smilebox1">\uE00b</span>'
},

Normalement, dans votre éditeur, le bouton devrait apparaître, mais vous ne pouvez pas cliquer dessus.

Étape n°2 Liste de smileys:
Maintenant, il vous faut aller a la ligne 439 de votre fichier jquery.wysibb.js.
Vous aurez smilelist qui sera masqué par des //. Vous l'aurez compris, démasquez le. Normalement, sur votre éditeur vous pourrez désormais faire apparaître la liste d'emojis, mais vous aurez ceci a la place:

Étape n°3 Affichage:
Pour afficher vos smileys, rien de plus simple, il vous suffit d'adapter ce code:

smileList: [
   {img: '<img src="DossierEmojis/votre_emoji.png/gif" class="sm">', bbcode:"signes a remplacer", title: ''},
],

Je vous laisse adapter le src, ne pas toucher a class, adapter le bbcode, et le title.
Pour ceux qui ne comprennent pas le code (j'en doute mais on ne sait jamais):

src = Chemin du smiley
class = class CSS définie dans le fichier wysibb.css /!\ Attention ne pas toucher /!\
bbcode = correspond au signes devant être remplacés (ex: sans espace = :' ( ------> 😭)
title = petit texte/mot qui apparaît au survol du smiley dans la box

titleV2 = vous pouvez mettre: "title:CURLANG.sm1," qui est le titre du smiley 1 défini en haut du fichier:

//smiles
   sm1: "Sourire",
   sm2: "Rire",
   sm3: "Clin d'oeil",
   sm4: "Merci",
   sm5: "Gronder",
   sm6: "Choc",
   sm7: "En colère",
   sm8: "Douleur",
   sm9: "Malade"

Voilà ! Des questions ?

postez une réponse !
EDIT: Suite a la maj de WysibbEditor il faut maintenant modifier le fichier jquery.wysibb.js et non jquery.wysibb.fr.js
Beignet

Profil introuvable Le 3 septembre 2016 à 15:26

Salut 'Beignet' 😉
Continue tes tutoriels, c'est super de ta part ! 😉

Balatharas Le 3 septembre 2016 à 17:01

Je pense continuer oui @Jerem971 😋

Blast0Kd Le 4 septembre 2016 à 14:48

merci mon petit 😉

coucougael94 Le 31 décembre 2016 à 18:21

Réouverture...
Comment on fait pour les sprites d'emoticones ?

Balatharas Le 1 janvier 2017 à 22:50

Comment ça les sprites d'emoticones ? @coucougael94

konis Le 11 juillet 2018 à 12:40

C'est du tok 😷 sa marche pas mon gars 😠

Balatharas Le 11 juillet 2018 à 16:47

Si j'ai fait ce tuto c'est parce que la démarche à fonctionné pour moi et des collègues developpeurs. Donc merci de t'expliquer avant de t'énerver @konis

konis Le 13 juillet 2018 à 21:33

Montre ton code parce que je vois pas de ligne 307. Sa s'arrête a 72 chez moi

Balatharas Le 17 juillet 2018 à 01:47

De quel fichier parles tu ? Si c’est de jquery.wysibb.js ce n’est pas normal

konis Le 20 juillet 2018 à 14:04

Ta dit le fichier fr non ?

konis Le 20 juillet 2018 à 14:17

Balatharas Le 8 août 2018 à 20:28

Le fichier fr sers seulement a traduire les boutons ! Il faut modifier jquery.wysibb.js

konis Le 22 août 2018 à 23:06

Donne le code c'est plus simple

Balatharas Le 24 août 2018 à 21:40

Le code est dans le topic, il faut lire attentivement stp

konis Le 24 août 2018 à 22:23

Mais stp ta les emojies icons la

Balatharas Le 27 août 2018 à 15:05

???

Profil introuvable Le 3 septembre 2018 à 01:34

Re:

@konis, si tu veux que @Balatharas et tout le reste de la communauté te comprenne, le mieux c'est de prendre le temps d'écrire et de former tes mots. On est pas sur mobile en langage SMS. Les règles à ne pas oublier.

[TUTO] Configurer la smilebox de WysiBB editor

Échange

Articles / Vidéos

Ressources