Publié le 03/01/2011
Auteur fobec
Réseaux sociaux
0 partages
0 tweets
0 plus
4 commentaires

Choisir un editeur WYSIWYG pour son site Web

L'éditeur WYSIWYG est une application permettant d'ajouter et de modifier du contenu directement à partir du navigateur internet. Intégré dans tous les CMS, les fonctions de ces librairies java script (TinyMCE, CKEditor, MarkItUp) sont la mise en forme et l'ajout d'image.

Qu'est ce qu'un WYSIWYG

- Il s'agit d'un éditeur HTML WYSIWYG (What You See Is What You Get) développé en JavaScript,
- les applications disposent de fonctionnalités avancées comme un traitement de texte,
- inclusion d'image, de lien hypertexte et de vidéo dans une page web.

5 WYSIWYG à ajouter dans vos sites internet

Que ce soit pour l'édition de contenu, l'ajout de commentaire ou l'administration d'un site internet, les 5 applications suivantes sont simples à mettre en oeuvre. En complément à la description, vous trouverez une copie d'écran et les principales forces de chaque solution.

TinyMCE

Publié en Open Source par Moxiecode Systems, TinyMCE est un des plus célèbre WYSIWYG. Compatible sur toutes les plateformes, l'éditeur HTML a la capacité de convertir les champs TEXTAREA ou autres éléments HTML en zone d'édition. TinyMCE est facile à intégrer dans les systèmes de gestion de contenu (CMS).

tinyCE

léger et facile à intégrer
dans une application web, seules quelques lignes de code sont nécessaires en PHP, .Net, JSP. Supporte pleinement l'échange d'information en AJAX.
personnalisable par un système de thèmes, plugins, et d'une API,
support multilingue, le pack traduit en 75 langues,
Open Source sous licence LGPL, largement utilisée dans les sites web et la communauté est importante.
Site officiel TinyMCE - tester et charger les sources, démo en ligne de TinyMCE

CKEditor

Conçu comme un traitement de texte MS Word ou OpenOffice, CKEditor permet d'insérer des images, des tableaux et de mettre le texte en forme. Disponible depuis 2003 sous le nom FCKeditor, le projet a été renommé CKEditor disponible sous licence OpenSource et sous une version commerciale.

ckeditor

contenu généré au format XHTML 1.0 et support des feuilles de style,
éditeur complet, en plus des outils courants, CKEditor dispose également des fonctions copier/coller, annuler/refaire,
fonctions avancées: correcteur d'orthographe, coller à partir de Word et personnalisation en fonction du navigateur internet.

Site officiel CKEditor, tester et charger les sources démo en ligne de CKEditor, télécharger CKEditor

MarkItUp

Crée par Jay Salvat, MarkItUp est un plugIn jQuery permettant de transformer une zone textarea en un éditeur HTML. Au lieu d'être un éditeur WYSIWYG complet, MarkItUp est un moteur de balisage léger et entièrement paramétrable. Cette solution est souvent intégrée dans les blogs, les forums et l'ajout de commentaire.
markitup

très léger, le moteur de base pèse moins de 7 Ko,
anti-injection avec l'utilisation des BBCode,
intégration des raccourcis clavier et prévisualisation de page en AJAX.

Site officiel MarkItUp, tester et charger les sources démo en ligne de MarkItUp, télécharger MarkItUp

Aloha

Contrairement aux editeurs HTML ci-dessous, Aloha Editor n'affiche aucune zone d'édition de contenu. Lorsque le site web est chargé, un menu flottant se place directement à coté de l'élément à modifier. Ainsi, nul besoin d'utiliser un iFrame et de charger plusieurs fois la librairie JavaScript. D'après l'auteur, le gain en temps de chargement peut atteindre 80 % par rapport aux autres éditeurs de contenu.
aloha

Site officiel Aloha Editor - tester démo en ligne de Aloha

Yui Rich Text

Développé par Yahoo, l'editeur Yui est un composant du framework Yahoo UI library. Ses principales fonctions sont la mise en forme de texte, l'utilisation de drag-and-drop pour ajouter un élément et le dimensionnement des images.

yui

Site officiel Yahoo Yui, tester et charger les sources: démo en ligne de Yui, télécharger Yui

Ajouter un commentaire

Les champs marqués d'un * sont obligatoires, les adresses emails se sont pas publiées.
avatar Ludwig

Publié par Ludwig

le 05/01/2011 à 07:30:03

Bonjour,
Il me semble que les plugins de gestion d'images sont payants pour TinyMCE et CKeditor, est-ce toujours le cas ?
Il manque amha l'excellent Xinha dans cette liste, qui lui est Open Source et gratuit
Merci pour l'article.

avatar Sylvio

Publié par Sylvio

le 05/01/2011 à 09:18:59

J'ai découvert récemment ElRTE (couplé à  ElFinder) qui a l'air pas mal.

avatar Arkhee

Publié par Arkhee

le 05/01/2011 à 16:46:11

Bonjour,
Je ne connaissais pas Aloha mais je le trouve tres interessant dans le principe, on a vraiment l'impression d'editer directement l'article dans la page, contrairement aux autres.
En pratique quand je mets un site en place (Joomla ou developpement specifique) je prends en general FCKEditor ou CKEditor, principalement pour sa fonction de telechargement d'images et de pieces jointes, je trouve toute cette partie de gestion de medias tres bien faite (et qui a toujours ete gratuite).

avatar jadu

Publié par jadu

le 24/02/2012 à 17:04:34

Et comment met-on en route Xinha lorsque l'extension a été chargée dans Firefox ?????

je n'ai rien trouvé !!!

A lire aussi

Réseaux sociaux
Présentation de l'article
Catégorie
tuto - webmaster
Mise a jour
03/01/2011
Visualisation
vu 16846 fois
Public
Internaute
Auteur de la publication
Fobec
Admin
Auteur de 261 articles
|BIO_PSEUDO|
Commentaires récents

Publié par Laurent dans java

Rectification:
fonctionne en mode plein ecran avec la barre masque sur ajout d'un setUndecorated(true)

Encore merci :)

Publié par medfayz dans java

hi everybody thanks for the code , and please can any one help me to fix that exception.
javax.media.NoPlayerException: Cannot find a Player for :vfw:0

thanks

Publié par amelia dans java

pour 30 sa donne 1346269

Publié par Fobec dans logiciel

prise en charge du format ipV6. L'api est compatible avec tous les ip qu'elles soient au format ipV4 ou ipV6.

Publié par Verkork dans java

Le probleme c'est que ce code ne convient pas quand une partie de la page est dynamique, ie qu'elle est rafraichit toutes les minutes par exemple. Par exemple pour une telle page, c'est...