Voici donc le tutorial, tutoriel concernant l’éditeur qui va vous permettre d’insérer dans vos bases de données des contenus un peu plus classe que du texte issu de textearea basiques ! Tout est géré par la librairie TinyMCE, vous allez voir c’est un jeu d’enfant de s’en servir !
Suivez le chemin et au boulot !
Tout d’abord, téléchargez l’archive pour réaliser le tuto : téléchargez ici
Il contient toujours la même chose : les js, le fichier index ou demo, et le css. Ici, je vous ai laissé les exemples donnés avec l’archive officielle dans le dossier editor. La librairie s’appelle tiny_mce.js dans le dossier editor/jscripts/tiny_mce/ et le css feuille_editer.css.
Trois étapes :
1- Mettez le head pour les js et initialisez votre éditeur en choisissant la richesse de votre éditeur :
Petites explications : Chaque ligne de boutons est donné par theme_advanced_buttonsX où X est la position de la ligne. Ensuite vous insérez les fonctionnalités que vous désirez : bold (mettre en gras), justify (justifier le texte)… Je vais pas vous apprendre Word ! Si ?
2- Insérez votre formulaire qui deviendra alors votre éditeur :
Voir le code de mon formulaire
3- Ajoutez votre code prototype pour gérer la suite : lorsque l’internaute clique sur Envoyer :
Voir le code prototype gérant l’envoie du contenu
Petit cours sur les écouteurs
J’ai donc mis un écouteur sur le bouton et encoder, ré-encoder le tout pour pouvoir les passer en Ajax.
C’est tout ! Pas très compliqué n’est-ce pas !
Hello, très beau site !
Et bon tuto, seulement j’aurai une petite question.
Surement bête. Mais que doit ton mettre dans la page editer.php ? Car je ne parviens pas à gérer le contenu transmis par le formulaire.
Merci beaucoup et bonne continuation !
Salut salut,
Je suppose que tu sais pas trop me répondre pour le moment, pas de soucis, si tu as 2 minutes un moment ca me ferai plaisir
Bisous à plus
Excuse moi, j’avais zappé.
En gros dans le javascript, dans la fonction saveAjax(), tu enlèves la ligne alert(content); et tu fais une requête ajax typique en mettant en paramètre content.
Voici un exemple de requête ajax.
Merci beaucoup pour ce tuto
Bonjour,
Tout d’abord, merci pour ce fabuleux tutoriel qui m’a empêché de devenir chauve à force de m’arracher les cheveux sur l’intégration de TinyMCE dans mon panneau d’administration simplifié que je développe pour une petite collectivité locale… ^^
Mais survient une question, dans ton head, tu indiques un lien vers une feuille css nommée feuille_editer.css, seulement je ne la retrouve nul part dans ton .rar … Où puis-je la récupérer pour finaliser l’intégration de toutes les options de TinyMCE ? (Oui car pour l’instant, seuls mettre en gras et italique marche, et oui, ce sont juste des et …)
Merci encore pour ce tutoriel, et merci d’avoir pour ta future réponse
C’est une erreur de ma part, cette ligne ne doit pas être mise dans le code.
Merci pour ton bon tutoriel! J’ai tenté d’installer tinyMCe de toute les façons, je n’ai pas réussi.
Super et félicitation
bonjour
J’ai réussi à installer TinyMCE, mais pour que ce soit complet, j’aimerais que le visiteur puisse récupérer le texte déjà en ligne dans l’éditeur, afin de le modifier.
Est ce possible sans passer par une BDD?
merci!