---
title: "Rails integration"
description: "Seamlessly integrates TinyMCE into the Rails asset pipeline."
canonical_url: "https://www.tiny.cloud/docs/tinymce/latest/rails-cloud/"
md_url: "https://www.tiny.cloud/docs/tinymce/5/rails/index.md"
version: "5"
last_updated: "2024-04-09T09:35:32Z"
tokens: 2342
---
Important This page documents TinyMCE 5. For new projects, Tiny recommends using the latest, most up-to-date version. [See TinyMCE 8 documentation](../../latest/rails-cloud/).
# Rails integration

TinyMCE can be added to a Ruby on Rails project using either:

- [TinyMCE in Ruby on Rails using the Tiny Cloud](#tinymceinrubyonrailsusingthetinycloud)
- [TinyMCE in Ruby on Rails using TinyMCE self-hosted](#tinymceinrubyonrailsusingtinymceself-hosted)
- [The third-party TinyMCE Ruby on Rails gem](#thethird-partytinymcerubyonrailsgem)

## TinyMCE in Ruby on Rails using the Tiny Cloud

The Tiny Cloud can be used to integrate TinyMCE into Ruby on Rails projects.
This procedure creates a [basic Ruby on Rails application](https://guides.rubyonrails.org/getting_started.html) containing a TinyMCE editor based on our [Basic example](../basic-example/).

### Prerequisites

This procedure requires the following programs:

- [Node.js](https://nodejs.org/)
- [Yarn](https://yarnpkg.com/)
- [Ruby](https://www.ruby-lang.org/)
- [SQLite 3+](https://sqlite.org/index.html)
- [Ruby on Rails](https://rubyonrails.org/)

### Procedure

On a command line or command prompt:

1. Create a new Ruby on Rails project.

```sh
rails new myTinySite
```
2. Navigate into the project directory.

```sh
cd myTinySite/
```
3. Create a new Rails controller, such as:

```sh
rails generate controller Welcome index
```

```
This creates a controller named `Welcome` with an action named `index`.
```
4. Set the project home page to `index`.

  1. Using a text editor, open `config/routes.rb`, such as:

```sh
nano config/routes.rb
```
  2. Add `root 'welcome#index'` to set `index` as the project home page. For example:

```ruby
Rails.application.routes.draw do
  get 'welcome/index'

  root 'welcome#index'
end
```
5. Add the following lines within the `<head>` element of `app/views/layouts/application.html.erb` to automatically include TinyMCE on pages using the `application` layout:

```html
<script src="https://cdn.tiny.cloud/1/no-api-key/tinymce/5/tinymce.min.js" referrerpolicy="origin"></script>
<script>
  tinymce.init({
    selector: '.tinymce',
    height: 500,
    menubar: false,
    plugins: [
      'advlist autolink lists link image charmap print preview anchor',
      'searchreplace visualblocks code fullscreen',
      'insertdatetime media table paste code help wordcount'
    ],
      toolbar: 'undo redo | formatselect | ' +
      ' bold italic backcolor | alignleft aligncenter ' +
      ' alignright alignjustify | bullist numlist outdent indent | ' +
      ' removeformat | help'
  });
</script>
```
6. Create a `<textarea>` with the initial content `Hello, World!` for TinyMCE by adding the following lines to `app/views/welcome/index.html.erb`:

```html
<%= text_area_tag :content, "Hello, World!", :class => "tinymce" %>
```
7. On a command line, from the project’s root directory, start the Ruby on Rails server.

```sh
rails server
```
The page containing the TinyMCE will be accessible at `http://localhost:<port>/` (default: http://localhost:3000/).

## TinyMCE in Ruby on Rails using TinyMCE self-hosted

Self-hosted instances of TinyMCE can be integrated into Ruby on Rails projects.
This procedure creates a [basic Ruby on Rails application](https://guides.rubyonrails.org/getting_started.html) containing a TinyMCE editor based on our [Basic example](../basic-example/).

### Prerequisites

This procedure requires the following programs:

- [Node.js](https://nodejs.org/)
- [Yarn](https://yarnpkg.com/)
- [Ruby](https://www.ruby-lang.org/)
- [SQLite 3+](https://sqlite.org/index.html)
- [Ruby on Rails](https://rubyonrails.org/)

### Procedure

On a command line or command prompt:

1. Create a new Ruby on Rails project.

```sh
rails new myTinySite
```
2. Navigate into the project directory.

```sh
cd myTinySite/
```
3. Create a new Rails controller, such as:

```sh
rails generate controller Welcome index
```

```
This creates a controller named `Welcome` with an action named `index`.
```
4. Set the project home page to `index`.

  1. Using a text editor, open `config/routes.rb`, such as:

```sh
nano config/routes.rb
```
  2. Add `root 'welcome#index'` to set `index` as the project home page. For example:

```ruby
Rails.application.routes.draw do
  get 'welcome/index'

  root 'welcome#index'
end
```
5. Add the following lines within the `<head>` element of `app/views/layouts/application.html.erb` to automatically include TinyMCE on pages using the `application` layout:

```html
<script src="/path/to/tinymce.min.js"></script>
<script>
  tinymce.init({
    selector: '.tinymce',
    height: 500,
    menubar: false,
    plugins: [
      'advlist autolink lists link image charmap print preview anchor',
      'searchreplace visualblocks code fullscreen',
      'insertdatetime media table paste code help wordcount'
    ],
      toolbar: 'undo redo | formatselect | ' +
      'bold italic backcolor | alignleft aligncenter ' +
      'alignright alignjustify | bullist numlist outdent indent | ' +
      ' removeformat | help'
  });
</script>
```
6. Create a `<textarea>` with the initial content `Hello, World!` for TinyMCE by adding the following lines to `app/views/welcome/index.html.erb`:

```html
<%= text_area_tag :content, "Hello, World!", :class => "tinymce" %>
```
7. On a command line, from the project’s root directory, start the Ruby on Rails server.

```sh
rails server
```
The page containing the TinyMCE will be accessible at `http://localhost:<port>/` (default: http://localhost:3000/).

For information on self-hosting TinyMCE, see: [Installing TinyMCE](../installation/).

## The third-party TinyMCE Ruby on Rails gem

> **Important:** This Integration is maintained by a third-party developer. Tiny Technologies, Inc. bears no responsibility for this integration, which is not covered by the Tiny Self-Hosted Software License Agreement. For issues related to the integration, contact the third-party project directly.
Sam Pohlenz maintains the [TinyMCE Ruby on Rails gem](https://github.com/spohlenz/tinymce-rails) for integrating TinyMCE into the Ruby on Rails asset pipeline.
This procedure creates a [basic Ruby on Rails application](https://guides.rubyonrails.org/getting_started.html) containing a TinyMCE editor based on our [Basic example](../basic-example/).

### Prerequisites

This procedure requires the following programs:

- [Node.js](https://nodejs.org/)
- [Yarn](https://yarnpkg.com/)
- [Ruby](https://www.ruby-lang.org/)
- [SQLite 3+](https://sqlite.org/index.html)
- [Ruby on Rails](https://rubyonrails.org/)

### Procedure

On a command line or command prompt:

1. Create a new Ruby on Rails project.

```sh
rails new myTinySite
```
2. Navigate into the project directory.

```sh
cd myTinySite/
```
3. Create a new Rails controller, such as:

```sh
rails generate controller Welcome index
```

```
This creates a controller named `Welcome` with an action named `index`.
```
4. Set the project home page to `index`.

  1. Using a text editor, open `config/routes.rb`, such as:

```sh
nano config/routes.rb
```
  2. Add `root 'welcome#index'` to set `index` as the project home page. For example:

```ruby
Rails.application.routes.draw do
  get 'welcome/index'

  root 'welcome#index'
end
```
5. Using a text editor, open the project `Gemfile` and add the line:

```sh
gem 'tinymce-rails'
```
Do not add this line within a `group` - `end` element.
6. Install the `tinymce-rails` gem using `bundle`:

```sh
bundle install
```
7. Create a TinyMCE configuration file.

  1. Create the `config/tinymce.yml` file:

```sh
touch config/tinymce.yml
```
  2. Add a TinyMCE configuration. The configuration must be in the [YAML format](https://yaml.org/spec/1.2/spec.html), such as:

```yml
height: 500
menubar: false
toolbar:
  - undo redo | formatselect | bold italic backcolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | removeformat | help
plugins:
  - advlist autolink lists link image charmap print preview anchor
  - searchreplace visualblocks code fullscreen
  - insertdatetime media table paste code help wordcount
```
8. Add the following lines within the `<head>` element of `app/views/layouts/application.html.erb` to automatically include TinyMCE on pages using the `application` layout:

```html
<%= tinymce_assets %>
 <script type="text/javascript" src="/assets/tinymce.js"></script>
```
9. Create a `<textarea>` with the initial content `Hello, World!` for TinyMCE by adding the following lines to `app/views/welcome/index.html.erb`:

```html
<%= text_area_tag :content, "Hello, World!", :class => "tinymce" %>
 <%= tinymce %>
```
10. On a command line, from the project’s root directory, start the Ruby on Rails server.

```sh
rails server
```
The page containing the TinyMCE will be accessible at `http://localhost:<port>/` (default: http://localhost:3000/).

For information on creating advanced configurations for the third-party TinyMCE Ruby on Rails integration, visit the project on GitHub: [Rails Integration for TinyMCE](https://github.com/spohlenz/tinymce-rails).
