2018-04-13 19:23:04 -04:00
|
|
|
# Action Text
|
2018-02-14 15:44:38 -05:00
|
|
|
|
|
|
|
🤸♂️💰📝
|
|
|
|
|
|
|
|
## Installing
|
|
|
|
|
|
|
|
Assumes a Rails 5.2+ application with Active Storage and Webpacker installed.
|
|
|
|
|
|
|
|
1. Install the gem:
|
|
|
|
|
2018-02-14 15:49:19 -05:00
|
|
|
```ruby
|
|
|
|
# Gemfile
|
2018-06-27 07:38:24 -04:00
|
|
|
gem "actiontext", github: "basecamp/actiontext", require: "action_text"
|
|
|
|
gem "image_processing", "~> 1.2" # for Active Storage variants
|
2018-02-14 15:49:19 -05:00
|
|
|
```
|
|
|
|
|
2018-07-31 18:55:53 -04:00
|
|
|
1. Install the npm package (with a local reference to this checked out repository):
|
2018-02-14 15:44:38 -05:00
|
|
|
|
2018-02-14 15:49:19 -05:00
|
|
|
```sh
|
2018-07-31 18:55:53 -04:00
|
|
|
$ yarn add file:../actiontext
|
2018-02-14 15:49:19 -05:00
|
|
|
```
|
|
|
|
|
|
|
|
```js
|
|
|
|
// app/javascript/packs/application.js
|
2018-06-27 07:38:24 -04:00
|
|
|
import "actiontext"
|
2018-02-14 15:49:19 -05:00
|
|
|
```
|
2018-02-14 15:44:38 -05:00
|
|
|
|
2018-06-27 07:38:24 -04:00
|
|
|
1. Migrate the database
|
|
|
|
|
|
|
|
```
|
|
|
|
./bin/rails action_text:install
|
|
|
|
./bin/rails db:migrate
|
|
|
|
```
|
|
|
|
|
2018-04-13 19:23:04 -04:00
|
|
|
1. Declare text columns as Action Text attributes:
|
2018-02-14 15:44:38 -05:00
|
|
|
|
2018-02-14 15:49:19 -05:00
|
|
|
```ruby
|
|
|
|
# app/models/message.rb
|
|
|
|
class Message < ActiveRecord::Base
|
2018-04-13 17:10:18 -04:00
|
|
|
has_rich_text :content
|
2018-02-14 15:49:19 -05:00
|
|
|
end
|
|
|
|
```
|
2018-02-14 15:44:38 -05:00
|
|
|
|
2018-06-05 10:20:55 -04:00
|
|
|
1. Replace form `text_area`s with `rich_text_area`s:
|
2018-02-14 15:44:38 -05:00
|
|
|
|
2018-02-14 15:49:19 -05:00
|
|
|
```erb
|
|
|
|
<%# app/views/messages/_form.html.erb %>
|
|
|
|
<%= form_with(model: message) do |form| %>
|
|
|
|
…
|
|
|
|
<div class="field">
|
|
|
|
<%= form.label :content %>
|
2018-06-05 10:20:55 -04:00
|
|
|
<%= form.rich_text_area :content %>
|
2018-02-14 15:49:19 -05:00
|
|
|
</div>
|
|
|
|
…
|
|
|
|
<% end %>
|
|
|
|
```
|