2011-09-02 14 views
7

Railsで「共通の」WYSIWYGを使用するのに問題があります。 RedClothで一度もやらなければなりませんでした。jQueryとRuby on Rails 3.1(Sprockets)ではどのようなWYSIWYGがうまく機能しますか?

tinymce-railsを使用しようとしましたが、機能しませんでした。 nicEditも試してみましたが、あなたがオンラインライブラリを呼び出したとき(そして放棄されているように見える)に限ります。

良いWYSIWYG、つまりjQueryとRails 3.1(Sprockets)が使いやすい人は誰ですか?

+0

最近見えてうまくいくはずです。どのようなエラーがありましたか? – nathanvda

+0

最近ですが、実装するのは本当に難しいです。アイデアは、レール3.1(レール3のために存在するように)のために働く宝石か何かを持つことです。 – ersamy

+0

ドキュメントから、本当に簡単になるはずです。どのステップがうまくいかなかったのですか? – nathanvda

答えて

13

を試してみてください。

はちょうどあなたのlib /資産/ JavaScriptのにフォルダを投げると、あなたが必要なとき、それはこのようにそれを参照:

= javascript_include_tag "ckeditor/ckeditor.js" 

とJavaScriptで

:javascript 
    $(function(){ 
    CKEDITOR.replace('input', 
     { 
     // Optional params: 
     skin : 'office2003', 
     height: '700px' 
     }); 
    }) 
+4

注:Herokuで作業するには、これをckeditor.jsの最上部に追加する必要があることがわかりました:var CKEDITOR_BASEPATH = '/ assets/ckeditor /'; – Plattsy

+0

それは私のためにもうまくいく。先端に感謝します。 tiny_mceからの切り替え – allesklar

+0

1ページに複数のckeditorフィールドが必要な場合は、代わりにaloha-editorまたはmercury editorを使用してください。 Mercuryは、非IEのブラウザを編集用に制限していますが、それは通常問題ではありません。 – leifcr

3

Mercury Editorは有望です。私は次のレールプロジェクトでそれを試してみる予定です。

http://jejacks0n.github.com/mercury/

+0

私はもっとシンプルな、それは素晴らしいと思うものを探しています。 – ersamy

+0

あなたは幸運なことに、顧客がいらない – AlfonsoML

+0

マーキュリーを設定する方法を示すRailscasts [エピソード](http://railscasts.com/episodes/296-mercury-editor)があります。 –

8

かなりのために、この問題で苦労した後、しばらくして、Rails 3.1と資産パイプラインで標準のtinyMCEを使用するためのソリューションを考え出しました。

  1. 私はtinyMCE jQueryパッケージを使い始めました。
  2. TinyMCEのためのベンダーにディレクトリを作成します。/vendor/assets/javascripts/tiny_mce
  3. 場所をあなたの/public/javascriptsフォルダ内のディレクトリだけでjquery.tinymce.js内部/vendor/assets/javascripts/tiny_mce
  4. 場所の残りのTinyMCEファイル、tiny_mce
  5. というディレクトリの中にTinyMCEのを追加します。あなたのapplication.jsそうのように:

    //=require jquery 
    ... 
    //=require tiny_mce/jquery.tinymce.js 
    
  6. 私はでTinyMCEのを初期化します

    $('.tinymce').each(function(i){ 
    $(this).tinymce({ 
        script_url : '/javascripts/tiny_mce/tiny_mce.js', 
        ... 
    

動作するはずです:としても、それは今のファイルをサポートしていますというのTinyMCEを伝えるためにscript_urlパスを設定するには、私のpublic/javascripts/tiny_mceディレクトリに住んでいます。これで、アセットパイプラインを使用してtinyMCEをロードし、パブリックディレクトリからサポートアセットとjavascriptを提供しています。

+1

これは最上位にする必要があります – pduersteler

0

Luufは既にAloha-Editorに言及しています。それはまだ重い開発の下にありますが、かなり有望です。

aloha-config.jsファイルをアセットパスのどこにでも置くだけで、alohaファイルはベンダー/アセットに移動します。

例の設定:

(function(window, undefined) { 
     if (window.Aloha === undefined || window.Aloha === null) { 
     var Aloha = window.Aloha = {}; 
      } 

    Aloha.settings = { 
     logLevels: {'error': true, 'warn': true, 'info': true, 'debug': false, 'deprecated': true}, 
     baseUrl: "/assets/lib", 
     errorhandling: false, 
     plugins: false 
    }; 
    })(window); 

ライン "baseUrlには、" 最も重要です。これを/ assets/libに設定すると、資産パイプラインとの互換性が確保されているようです。

まだ連結を試みていないが、それがどのように動作するかを知ってからコメントを投稿する。

よろしくお願いいたします。

0

アロハエディタ

http://aloha-editor.org/

それはその& Mercery間タフだ - しかし、アロハは、よりよい「感じ」を持ち、それが広いブラウザをサポートしています。

関連する問題