Using TinyMCE Content CSS with Rails Asset Pipeline
TinyMCE lets you do this using the
Unfortunately, whilst this is fine in development, where CSS and other assets are compiled on demand, when deploying to a server and running under production, the URL above becomes invalid, causing 404 errors and broken styles.
Linking to Precompiled Content CSS
To ensure the content CSS assets are compiled, we first need to add them to the precompiled assets list:
# config/initializers/assets.rb Rails.application.config.assets.precompile += %w( tinymce-content.css )
Next, we need to ensure that the
content_css option uses the compiled asset’s URL. We can do this by using a snippet of
ERB in our coffeescript file:
Note that you also need to add the
.erb extension to the filename.
With that, the correct compiled URL for
tinymce-content.css will be inserted into your
tinymce.init call, and the styles will be loaded correctly into the editor.
Testing it out in development
You can check the correct styles are loaded in development when precompiled by running:
$ bin/rake assets:precompile
Then restart your server and load the page with your editor.
Don’t forget to remove the precompiled assets with:
$ bin/rake assets:clobber