{"id":23744787,"url":"https://github.com/david-uhlig/example-tinymce-rails7-turbo","last_synced_at":"2026-04-16T19:07:02.186Z","repository":{"id":269212036,"uuid":"492178758","full_name":"david-uhlig/example-tinymce-rails7-turbo","owner":"david-uhlig","description":"An example integration of TinyMCE in Rails 7 that doesn't break with Turbo Drive","archived":false,"fork":false,"pushed_at":"2025-01-21T14:16:54.000Z","size":38,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-06-01T02:53:29.793Z","etag":null,"topics":["demo","example","rails","ruby","tinymce"],"latest_commit_sha":null,"homepage":"","language":"Ruby","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/david-uhlig.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2022-05-14T10:08:06.000Z","updated_at":"2025-01-21T14:16:57.000Z","dependencies_parsed_at":"2024-12-21T20:19:35.584Z","dependency_job_id":"b9df3582-2e27-45ef-aae1-293699ec0098","html_url":"https://github.com/david-uhlig/example-tinymce-rails7-turbo","commit_stats":null,"previous_names":["david-uhlig/example-tinymce-rails7-turbo"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/david-uhlig/example-tinymce-rails7-turbo","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/david-uhlig%2Fexample-tinymce-rails7-turbo","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/david-uhlig%2Fexample-tinymce-rails7-turbo/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/david-uhlig%2Fexample-tinymce-rails7-turbo/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/david-uhlig%2Fexample-tinymce-rails7-turbo/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/david-uhlig","download_url":"https://codeload.github.com/david-uhlig/example-tinymce-rails7-turbo/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/david-uhlig%2Fexample-tinymce-rails7-turbo/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31900057,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-16T18:22:33.417Z","status":"ssl_error","status_checked_at":"2026-04-16T18:21:47.142Z","response_time":69,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["demo","example","rails","ruby","tinymce"],"created_at":"2024-12-31T12:49:01.903Z","updated_at":"2026-04-16T19:07:02.164Z","avatar_url":"https://github.com/david-uhlig.png","language":"Ruby","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Example Integration of TinyMCE in Rails 7 with Turbo Drive Support\n\nThis example project demonstrates the integration of the [TinyMCE](https://www.tiny.cloud/) editor in Rails 7. It utilizes the well known [tinymce-rails](https://github.com/spohlenz/tinymce-rails) gem and offers full Turbo Drive support through an additional Stimulus controller.\n\nSince Rails 7 the [turbo-rails](https://github.com/hotwired/turbo-rails) library is included by default. Turbo Drive intercepts link clicks and form submits. It makes sure that only the `\u003cbody\u003e` part of the page is rerendered instead of the whole page. \n\nThis leads to TinyMCE not being properly detached and reattached when a Turbo Drive response is rendered. The textarea will appear without the TinyMCE editor. The Stimulus controller helps to reattach TinyMCE and respects the settings in `config/tinymce.yml`.\n\n## Instructions\n\nDetails about the integration can be found in this [Gist](https://gist.github.com/david-uhlig/ccdda4800156e1dadeedfc0411736267).\n\n## Try out the example integration\n\n**1. Clone the repository**\n\n```\ngit clone https://github.com/david-uhlig/example-tinymce-rails7-turbo\ncd example-tinymce-rails7-turbo/\n```\nThen run `bundle install`\n\n**2. Start the server**\n\n```\nrails s --port 3000\n```\nOpen http://localhost:3000 in your browser.\n\n## Sources\n\n* `tinymce-rails` [README](https://github.com/spohlenz/tinymce-rails/blob/main/README.md) for the general setup.\n* Blog post \"[Making TinyMCE work with Rails, Turbolinks and Stimulus](https://dev.to/djchadderton/making-tinymce-work-with-rails-turbolinks-and-stimulus-2ooa)\" from djchadderton with the main idea for the Stimulus controller included in this demo.\n\n## Notes\n\n### Without the `tinymce-rails` gem\n\nThe `tinymce-rails` gem is not strictly necessary. You may also use the Tiny Cloud CDN similarly as described [here](https://www.tiny.cloud/docs/tinymce/6/rails-cloud/).\n\n**1. Add the following line to the `\u003chead\u003e` section of `app/views/layouts/application.html.erb`**\n\n```html\n\u003cscript src=\"https://cdn.tiny.cloud/1/no-api-key/tinymce/6/tinymce.min.js\" referrerpolicy=\"origin\"\u003e\u003c/script\u003e\n```\n\n**2. Add the initialization to your Stimulus controller**\n\n```js\n    initialize() {\n        this.defaults = {\n            selector: '.tinymce',\n            toolbar: [\n                'styleselect | bold italic | undo redo',\n                'image | link'\n            ],\n            plugins: 'lists link image table code help wordcount'\n        }\n    }\n```\n\n**3. Replace the connect function in the Stimulus controller**\n\n```js\n    connect() {\n        let config = Object.assign({ target: this.inputTarget }, this.defaults)\n        tinymce.init(config)\n    }\n```\n\nThe settings will no longer be read from `config/tinymce.yml` but from the Stimulus controller instead.\n\n## Using `importmap`\n\nI would be very interested in a solution utilizing `bin/importmap pin tinymce`. This seems to be the favorable way going forward in Rails 7. I had no luck making it work, though.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdavid-uhlig%2Fexample-tinymce-rails7-turbo","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdavid-uhlig%2Fexample-tinymce-rails7-turbo","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdavid-uhlig%2Fexample-tinymce-rails7-turbo/lists"}