2008-10-13 6 views
18

Je souhaite utiliser l'édition de texte enrichi sur les formulaires afin de permettre aux administrateurs de modifier les instructions. Quelles sont les meilleures options pour cela?Quelles sont les meilleures options pour l'édition de texte enrichi dans Rails?

[Pour être plus clair - les admins ne sont pas techniques mais peuvent vouloir contrôler une mise en forme sans utiliser le balisage ou avec aussi peu que possible le balisage. Ce que j'aimerais, c'est qu'ils puissent éditer tout AJAXy en ligne avec un RTE avec des contrôles de formatage, puis soumettre et être capable de voir à quoi les instructions ressembleront à l'utilisateur final sans changer de page.

En ce qui concerne plus particulièrement les plugins, ce que je voudrais savoir est que les plugins Rich test d'édition sont les meilleurs pour une utilisation dans Rails. Le plus facile à implémenter, l'API la plus claire, la plus facile à utiliser, etc ...]

Répondre

11

Pour Tumblon, nous avons commencé avec TinyMCE mais nous basculons à Yahoo Rich Text Editor parce qu'il y avait des problèmes étranges avec la façon dont TinyMCE a travaillé et parce que la documentation de l'éditeur de texte enrichi et défaut look-and-feel est supérieure.

Les deux sont assez faciles à intégrer avec Rails (ils sont juste JavaScript, après tout). Il y a des plugins, mais vous n'en avez pas vraiment besoin.

+0

D'autres options intéressantes pourraient être [Trix] (https://github.com/basecamp/trix) (gem [ici] (https://github.com/maclover7/trix)) et [ckeditor] (https: // github.com/galetahub/ckeditor), qui a un support pour 'carrierwave' et' cancancan' – Pietro

3

Je ne suis pas sûr de bien comprendre la question, mais si vous demandez seulement quel éditeur utiliser, il y a beaucoup d'options et aucune d'entre eux est une question de Rails - vous pouvez utiliser l'un d'eux juste en ajoutant un petit morceau de javascript dans votre balisage. Nice et mise à jour aperçu peut être trouvé ici: http://bulletproofbox.com/web-based-rich-text-editors-compared/.

Modifier: Lien modifié vers google cachce, car le lien d'origine ne fonctionne pas.

+0

Désolé, le lien est cassé. Mettez-le à jour si vous le pouvez. – JasonOng

+0

Oh. On dirait que le site est en panne. J'ai changé le lien vers la version google cachce, donc vous en avez au moins quelque chose. –

2

Il existe un certain nombre de langages de modèle implémentés pour Rails qui donnent une syntaxe relativement simple pour le balisage. J'ai déjà utilisé RedCloth avant, une implémentation de Textile (http://redcloth.org/), et c'est plutôt bon. Des choses comme Liquid (http://www.liquidmarkup.org/) sont un peu plus puissantes, permettant aux templates d'inclure des informations de base de données en ligne. Selon les besoins de votre projet, les deux seraient potentiellement un bon ajustement.

Aucune de ces solutions à elles seules donnent un éditeur de texte enrichi en place, mais sont un bon point de départ sur le back-end pour ce qui pourrait être une solution d'accueil. Si vous laissez seulement les administrateurs entrer des informations, j'imagine qu'ils n'auraient pas peur d'une petite entrée en clair.

6

Je suis passé par des luttes similaires dans le passé, et avait réglé sur YUI. Malheureusement, les résultats de YUI (au moins pour moi, et je l'admets, je me suis précipité et jamais re-factorisé), en html terrible.

Puis ce soir, quand je suis tombé sur ce post, j'ai trouvé PunyMCE. Il y a 2 trucs géniaux: 1) incroyablement léger (comme son nom l'indique), et 2) il y a un plugin pour les rails qui a déjà été créé: puny_mce sur github.

La documentation est assez bon, sauf pour une ou deux choses que je avais omis/me avait gratté ma tête:

  1. Il y a une faute de frappe sous la rubrique « Utilisation », <% rendement: tête%> doit être <% = rendement : tête%>
  2. Si vous voulez utiliser plus que la barre d'outils de base, vous devez incluent: a) soit le profil pré-configuration ou b) les éléments de la barre d'outils et plugins nécessaires pour ces articles dans BOTH l'appel include_puny_mce ET l'appel puny_mce. Cela rend sens - le include_puny_mce est instruire la page sur laquelle javascripts dont il a besoin, et le puny_mce appel est en fait la construction la sortie javascript nécessaire pour générer l'éditeur riche.

Voici un exemple que je mets ensemble pour démontrer:

<% content_for :head do %> 
    <%= include_puny_mce :profiles => [:full] %> 
<% end %> 

<h1>New post</h1> 

<% form_for(@post) do |f| %> 
<%= f.error_messages %> 
<%= f.label :title, "Title" %><br /> 
<%= f.text_field :title %><br /> 
<%= f.label :content, "Post Content" %><br /> 
<%= f.text_area :content, :cols => 100 %> 
<%= puny_mce 'post_content', 'post_content', :profile => :full %> 
<p> 
    <%= f.submit 'Create' %> 
</p> 
<% end %> 

J'espère que cela aide!

0

Je sais que cette menace est assez ancienne, mais je suis tombé sur quelques bonnes options il y a quelques semaines, donc si quelqu'un d'autre est confronté au même problème que moi, je donnerais une réponse plus favorable. Donc mon éditeur préféré est Froala (wysiwyg-editor si vous utilisez des rails) qui a l'air propre, facile à manipuler et supporte les vidéos intégrées, le téléchargement d'images, le téléchargement de fichiers et est entièrement personnalisable pour les utilisateurs backend toute connaissance du développement réactif pour placer les éléments correctement sur la page pour les rendre pleinement réactifs. Nous avons utilisé cet éditeur pour un certain nombre de projets maintenant et les clients l'adorent.

La documentation est satisfaisante mais elle pourrait être meilleure si vous l'utilisez avec des frameworks tels que Rails et Django (comme nous le faisons). Mais je pense qu'il s'améliore tous les mois.

Un autre éditeur très prometteur est Quill (quill-rails si vous utilisez des rails). Nous ne l'avons pas encore utilisé pour des projets mais en expérimentant. Une fois que nous avons plus d'expérience, nous allons poster quelques notes ici et SSC.

Enfin, si vous souhaitez faire ou offrir un montage frontal réactif, vous pouvez jeter un oeil à x-editable. Regardez la démo - c'est plutôt joli!

Questions connexes