### Install and Setup TinyMCE with Rails Source: https://context7.com/spohlenz/tinymce-rails/llms.txt Demonstrates the installation of the tinymce-rails gem and basic configuration. Includes adding the gem to the Gemfile, running bundle install, defining initial TinyMCE settings in a YAML file, and including TinyMCE assets and editor initialization in Rails views. ```ruby # Gemfile gem 'tinymce-rails' ``` ```bash # Install the gem bundle install ``` ```yaml # config/tinymce.yml license_key: gpl toolbar: - styleselect | bold italic | undo redo - image | link plugins: - image - link ``` ```erb
<%= tinymce_assets data: { turbo_track: "reload" } %> <%= yield %> ``` ```erb <%= form_with model: @post do |f| %> <%= f.label :content %> <%= f.text_area :content, class: "tinymce", rows: 20, cols: 60 %> <%= f.submit %> <% end %> <%= tinymce %> ``` -------------------------------- ### Configure tinymce-rails Installation Method Source: https://github.com/spohlenz/tinymce-rails/blob/main/README.md Sets the installation method for TinyMCE assets. The 'compile' method is the default and adds TinyMCE paths to Sprockets precompilation paths, creating symlinks to digested versions. Use this method unless experiencing issues. ```ruby config.tinymce.install = :compile ``` -------------------------------- ### Custom TinyMCE Asset Installer Source: https://context7.com/spohlenz/tinymce-rails/llms.txt This Ruby code shows how to use the `TinyMCE::Rails::AssetInstaller` class for custom asset installation. It allows programmatic control over the asset copying process, including specifying source and target paths, manifest file location, installation strategy, and logging level. ```ruby # Custom asset installer usage require 'tinymce/rails/asset_installer' assets_path = Rails.root.join("vendor/assets/javascripts/tinymce") target_path = Rails.root.join("public/assets") manifest_path = Rails.root.join("public/assets/.sprockets-manifest-*.json") installer = TinyMCE::Rails::AssetInstaller.new(assets_path, target_path, manifest_path) installer.strategy = :copy installer.log_level = :debug installer.install ``` -------------------------------- ### Configure tinymce-rails Installation Method (Copy) Source: https://github.com/spohlenz/tinymce-rails/blob/main/README.md Sets the installation method for TinyMCE assets to 'copy'. This method copies TinyMCE assets directly into public/assets and appends file information to the asset manifest. Use this if the 'compile' method causes issues. The 'copy_no_preserve' variant is available if file mode preservation is not desired or possible. ```ruby config.tinymce.install = :copy ``` -------------------------------- ### Basic tinymce.yml Configuration Source: https://github.com/spohlenz/tinymce-rails/blob/main/README.md Example of a basic `config/tinymce.yml` file for global TinyMCE configuration. It includes a license key, toolbar items, and plugins. This configuration is automatically reloaded in development mode without restarting the server. ```yaml license_key: gpl toolbar: - styleselect | bold italic | undo redo - image | link plugins: - image - link ``` -------------------------------- ### Initialize TinyMCE with Custom Options Source: https://github.com/spohlenz/tinymce-rails/blob/main/README.md An example of overriding global TinyMCE settings by passing custom options directly to the `tinymce` helper. This allows for specific configurations per editor instance, such as theme, language, and additional plugins. ```erb <%= tinymce theme: "simple", language: "de", plugins: ["wordcount", "paste"] %> ``` -------------------------------- ### Precompile TinyMCE Assets for Production Source: https://context7.com/spohlenz/tinymce-rails/llms.txt This bash command demonstrates how to precompile assets for a Rails application in a production environment. The `assets:precompile` rake task not only compiles regular Rails assets but also installs TinyMCE assets according to the configured strategy, ensuring they are ready for deployment. ```bash # Precompile assets for production RAILS_ENV=production bundle exec rake assets:precompile # This automatically: # 1. Compiles regular Rails assets # 2. Installs TinyMCE assets using the configured strategy # 3. Creates non-digested versions or symlinks for dynamic loading ``` -------------------------------- ### Manual JavaScript Initialization of TinyMCE Source: https://context7.com/spohlenz/tinymce-rails/llms.txt This ERB and JavaScript snippet illustrates initializing TinyMCE directly using its JavaScript API without relying solely on Rails helpers. It includes basic editor setup, event handling for saving changes, and essential toolbar and plugin configurations. ```erb <%= tinymce_assets data: { turbo_track: "reload" } %> <%= text_area_tag :editor, @post.content, rows: 40, cols: 120 %> ``` -------------------------------- ### Define and Use Multiple TinyMCE Configurations in Rails Source: https://context7.com/spohlenz/tinymce-rails/llms.txt Shows how to define multiple distinct TinyMCE configurations in `config/tinymce.yml` and apply them to different editor instances within Rails views. This allows for varied editor setups on the same page. ```yaml # config/tinymce.yml default: license_key: gpl plugins: - image - link toolbar: styleselect | bold italic | undo redo alternate: <<: *default toolbar: styleselect | bold italic | undo redo | table plugins: - table - image - link custom: license_key: gpl plugins: - table - fullscreen - link valid_styles: '*': 'border,font-size' div: 'width,height' ``` ```erb <%= text_area_tag :editor1, "", class: "tinymce", rows: 20, cols: 60 %> <%= tinymce %> <%= text_area_tag :editor2, "", class: "tinymce-alternate", rows: 20, cols: 60 %> <%= tinymce :alternate, selector: ".tinymce-alternate" %> <%= text_area_tag :editor3, "", id: "custom-editor", rows: 20, cols: 60 %> <%= tinymce :custom, selector: "#custom-editor" %> ``` -------------------------------- ### TinyMCE Rails JavaScript API Initialization Source: https://context7.com/spohlenz/tinymce-rails/llms.txt This JavaScript code demonstrates using the TinyMCERails JavaScript API for editor initialization. It shows how to initialize editors with named configurations from `tinymce.yml`, access merged configurations, and manually merge configurations to create custom editor setups. ```javascript // app/assets/javascripts/custom_tinymce.js // Using TinyMCERails JavaScript API document.addEventListener('DOMContentLoaded', function() { // Initialize with a named configuration from tinymce.yml TinyMCERails.initialize('custom', { selector: '.custom-editor', height: 400 }); // Access merged configuration var config = TinyMCERails.configuration.default; var customConfig = TinyMCERails.configuration.custom; // Merge configurations manually var mergedConfig = TinyMCERails._merge(config, { plugins: 'table code', toolbar: 'table | code' }); tinymce.init(mergedConfig); }); ``` -------------------------------- ### Sprockets Configuration for TinyMCE Source: https://context7.com/spohlenz/tinymce-rails/llms.txt This Ruby snippet demonstrates how to configure the Rails application for Sprockets to include TinyMCE assets. It adds `tinymce.js` to the precompile list and sets the installation type to `:compile`. ```ruby # config/application.rb - Sprockets configuration module MyApp class Application < Rails::Application config.assets.precompile << "tinymce.js" config.tinymce.install = :compile end end ``` -------------------------------- ### Add tinymce-rails to Gemfile Source: https://github.com/spohlenz/tinymce-rails/blob/main/README.md This snippet shows how to add the `tinymce-rails` gem to your Rails application's Gemfile. Ensure it's added to the global group, not the `assets` group, and then run `bundle install`. ```ruby gem 'tinymce-rails' ``` -------------------------------- ### Configure TinyMCE Rails Engine Source: https://context7.com/spohlenz/tinymce-rails/llms.txt This Ruby code snippet shows how to configure the TinyMCE Rails engine within the `config/application.rb` file. It allows setting custom paths for TinyMCE assets, specifying the configuration file location, choosing an asset installation strategy, and defining default script tag attributes. ```ruby module MyApp class Application < Rails::Application # Set custom TinyMCE base path config.tinymce.base = "/custom-assets/tinymce" # Set custom configuration file location config.tinymce.config_path = Rails.root.join("config", "editors", "tinymce.yml") # Choose asset installation strategy # :compile - creates symlinks (default, works with most setups) # :copy - copies files directly (use if symlinks don't work) # :copy_no_preserve - copies without preserving file modes config.tinymce.install = :compile # Set default script tag attributes config.tinymce.default_script_attributes = { "data-turbo-track" => "reload", "defer" => true } end end ``` -------------------------------- ### Initialize TinyMCE with Alternate Configuration Source: https://github.com/spohlenz/tinymce-rails/blob/main/README.md This ERB helper demonstrates how to use a specific, named configuration set defined in `config/tinymce.yml`. By passing the name of the configuration (e.g., `:alternate`), TinyMCE will be initialized with those predefined settings. ```erb <%= tinymce :alternate %> ``` -------------------------------- ### Programmatically Manage TinyMCE Configuration in Ruby Source: https://context7.com/spohlenz/tinymce-rails/llms.txt Shows how to use the `TinyMCE::Rails::Configuration` class in Ruby to programmatically create, manage, and convert TinyMCE configurations to JavaScript objects. Demonstrates merging configurations and accessing global settings. ```ruby # lib/tinymce/rails/configuration.rb usage example config = TinyMCE::Rails::Configuration.new({ selector: "textarea.editor", plugins: ["table", "link", "image"], toolbar: "bold italic | link image", height: 400 }) # Convert to JavaScript object notation javascript_config = config.to_javascript # => "{ # selector: \"textarea.editor\", # plugins: \"table,link,image\", # toolbar: \"bold italic | link image\", # height: 400 # }" # Merge configurations base_config = TinyMCE::Rails::Configuration.new_with_defaults({ plugins: ["link"] }) merged_config = base_config.merge({ plugins: ["link", "image", "table"] }) ``` ```ruby # Access global configuration config = TinyMCE::Rails.configuration # => Returns Configuration or MultipleConfiguration object # Iterate through all configurations TinyMCE::Rails.each_configuration do |name, config| puts "Configuration #{name}:" puts config.to_javascript end ``` -------------------------------- ### Manual TinyMCE Initialization with JavaScript Source: https://github.com/spohlenz/tinymce-rails/blob/main/README.md Provides an alternative to using the `tinymce` helper by directly invoking the `tinymce.init` JavaScript function. This method requires manually selecting the target textarea using a CSS selector and defining all configuration options within the JavaScript call. ```javascript tinymce.init({ selector: 'textarea.editor' }); ``` -------------------------------- ### Advanced tinymce.yml with Multiple Configurations Source: https://github.com/spohlenz/tinymce-rails/blob/main/README.md Demonstrates how to define multiple TinyMCE configuration sets in `config/tinymce.yml` using YAML anchors and aliases. A `default` configuration must be specified, and other configurations can inherit from it, overriding specific options. ```yaml default: &default license_key: gpl plugins: - image - link alternate: <<: *default toolbar: styleselect | bold italic | undo redo | table plugins: - table ``` -------------------------------- ### Initialize TinyMCE with Default Configuration Source: https://github.com/spohlenz/tinymce-rails/blob/main/README.md This ERB helper invokes the TinyMCE JavaScript initialization. It uses the global configuration defined in `config/tinymce.yml` by default. No arguments are needed for this basic usage. ```erb <%= tinymce %> ``` -------------------------------- ### Manual TinyMCE Initialization with ERB and JavaScript Source: https://github.com/spohlenz/tinymce-rails/blob/main/README.md Combines Rails' ERB helpers to render a textarea and then uses a JavaScript ` ``` -------------------------------- ### TinyMCE Configuration with Custom Plugin Source: https://context7.com/spohlenz/tinymce-rails/llms.txt This YAML snippet shows how to configure TinyMCE to use a custom plugin. By listing 'mycustomplugin' in the 'plugins' array and 'mycustombutton' in the 'toolbar' string, you enable the custom functionality within the editor. ```yaml # config/tinymce.yml - Using custom plugin default: license_key: gpl plugins: - mycustomplugin - link - image toolbar: mycustombutton | bold italic | link image ``` -------------------------------- ### Initialize TinyMCE Editor with Rails Helpers Source: https://context7.com/spohlenz/tinymce-rails/llms.txt This Ruby code defines helper methods within an ApplicationHelper module to generate TinyMCE JavaScript initialization code. It utilizes the tinymce-rails gem's helper functions to customize editor instances, specifying selectors, languages, and other configuration options. ```ruby module ApplicationHelper include TinyMCE::Rails::Helper def custom_editor_init(locale = I18n.locale) tinymce_javascript(:default, { selector: ".rich-editor", language: locale, height: 500 }) end def editor_configuration_json config = tinymce_configuration(:default, { plugins: ["image", "link", "code"] }) config.to_javascript end end ``` -------------------------------- ### Textarea Initialization with Rails Form Builder Source: https://github.com/spohlenz/tinymce-rails/blob/main/README.md Demonstrates how to apply the `tinymce` class to a textarea when using Rails' form builders. This ensures that the textarea, when rendered, will be targeted by the TinyMCE initializer. ```erb <%= f.text_area :content, class: "tinymce", rows: 40, cols: 120 %> ``` -------------------------------- ### Precompile Custom Plugin Assets Source: https://context7.com/spohlenz/tinymce-rails/llms.txt This configuration snippet tells the Rails asset pipeline to precompile a custom TinyMCE plugin. This ensures that the plugin's JavaScript file is available in the production build. ```ruby Rails.application.config.assets.precompile += [ 'tinymce/plugins/mycustomplugin/plugin.js' ] ``` -------------------------------- ### TinyMCE Rails Initialization and Turbolinks Integration Source: https://context7.com/spohlenz/tinymce-rails/llms.txt This JavaScript code defines the `TinyMCERails` object, which handles TinyMCE initialization and integrates with Turbolinks. It includes logic to reinitialize TinyMCE after Turbolinks navigation and to remove TinyMCE instances before rendering a new page. ```javascript // app/assets/javascripts/tinymce/rails.js handles this automatically window.TinyMCERails = { configuration: { default: {} }, initialize: function(config, options) { if (typeof tinyMCE != 'undefined') { var configuration = TinyMCERails.configuration[config || 'default']; configuration = TinyMCERails._merge(configuration, options); tinymce.init(configuration); } else { setTimeout(function() { TinyMCERails.initialize(config, options); }, 50); } }, setupTurbolinks: function() { document.addEventListener('turbolinks:before-render', function() { tinymce.remove(); }); } }; if (typeof Turbolinks != 'undefined' && Turbolinks.supported) { TinyMCERails.setupTurbolinks(); } ``` -------------------------------- ### Propshaft Configuration for TinyMCE Source: https://context7.com/spohlenz/tinymce-rails/llms.txt This Ruby snippet configures the Rails application to work with Propshaft by excluding the Sprockets directory. This ensures that Propshaft is used for asset management and avoids conflicts. ```ruby # config/application.rb - Propshaft configuration module MyApp class Application < Rails::Application config.assets.excluded_paths << root.join("app/assets/sprockets") end end ``` -------------------------------- ### Propshaft TinyMCE Asset Inclusion Source: https://context7.com/spohlenz/tinymce-rails/llms.txt This ERB snippet demonstrates how to include TinyMCE assets in a Propshaft environment. It generates multiple script tags for TinyMCE's base, plugin, and rails JavaScript files. Manual inclusion using `javascript_include_tag` is also shown. ```erb <%# Propshaft - Multiple script tags %> <%= tinymce_assets %> <%# Generates: %> <%# %> <%# %> <%# %> <%# Or manually include: %> <%= tinymce_preinit %> <%= javascript_include_tag "tinymce/tinymce", data: { turbo_track: "reload" } %> <%= javascript_include_tag "tinymce/rails", data: { turbo_track: "reload" } %> ``` -------------------------------- ### TinyMCE Assets with Turbo Tracking Source: https://context7.com/spohlenz/tinymce-rails/llms.txt This ERB snippet shows how to include TinyMCE assets with Turbo tracking enabled. The `turbo_track: "reload"` option ensures that TinyMCE assets are reloaded correctly when Turbo drives a visit. ```erb <%# Ensure script tags have turbo tracking %> <%= tinymce_assets data: { turbo_track: "reload" } %> ``` -------------------------------- ### Custom Turbo (Hotwire) Integration for TinyMCE Source: https://context7.com/spohlenz/tinymce-rails/llms.txt This JavaScript code provides custom integration for TinyMCE with Turbo (Hotwire). It ensures TinyMCE is removed before a Turbo visit and reinitialized after a Turbo render, maintaining editor functionality across Turbo-driven navigations. ```javascript // Custom Turbo integration for Hotwire document.addEventListener('turbo:before-render', function() { if (typeof tinymce !== 'undefined') { tinymce.remove(); } }); document.addEventListener('turbo:render', function() { if (typeof TinyMCERails !== 'undefined') { TinyMCERails.initialize('default', {}); } }); ``` -------------------------------- ### Basic Textarea Initialization for TinyMCE Source: https://github.com/spohlenz/tinymce-rails/blob/main/README.md Shows how to add the `tinymce` class to a standard HTML textarea element using Rails' `text_area_tag` helper. This class is used by TinyMCE to identify which textareas should be converted into rich text editors. ```erb <%= text_area_tag :content, "", class: "tinymce", rows: 40, cols: 120 %> ``` -------------------------------- ### Using Custom Language in TinyMCE Source: https://context7.com/spohlenz/tinymce-rails/llms.txt This ERB snippet demonstrates how to specify a custom language for TinyMCE using the `tinymce` helper. For additional language packs, the `tinymce-rails-langs` gem is recommended. ```erb <%# Using custom language %> <%= tinymce language: "es" %> <%# For additional language packs, use tinymce-rails-langs gem %> <%# gem 'tinymce-rails-langs' in Gemfile %> ``` -------------------------------- ### Include TinyMCE Assets with ERB Helper Source: https://github.com/spohlenz/tinymce-rails/blob/main/README.md An ERB helper method to include TinyMCE assets in your Rails layout. This method generates a ` %> ``` -------------------------------- ### Include TinyMCE Assets with Sprockets Source: https://github.com/spohlenz/tinymce-rails/blob/main/README.md This JavaScript comment directive is used with Sprockets to include the TinyMCE editor assets in your `application.js` file. This method bundles all necessary TinyMCE files into a single script tag. ```javascript //= require tinymce ``` === COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.