You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Integrates the [Trix Editor](https://trix-editor.org/) with Laravel. Inspired by the Action Text gem from Rails.
@@ -68,6 +62,7 @@ There are two ways of using the package:
68
62
Below, we cover each usage way. It's recommended that you at least read the [Trix documentation](https://github.com/basecamp/trix) at some point to get an overview of the client-side of it.
69
63
70
64
### The RichText Model
65
+
71
66
<aname="rich-text-model"></a>
72
67
73
68
The recommended way is to keep the rich text content outside of the model itself. This will keep the models lean when you're manipulating them, and you can (eagerly or lazily) load the rich text fields only where you need the rich text content.
@@ -122,7 +117,7 @@ Similarly to the Content class, the RichText model will implement the `__toStrin
122
117
{!! $post->body !!}
123
118
```
124
119
125
-
*Note*: since the HTML output is NOT escaped, make sure you sanitize it before rendering. See the [sanitization](#sanitization) section for more about this.
120
+
_Note_: since the HTML output is NOT escaped, make sure you sanitize it before rendering. See the [sanitization](#sanitization) section for more about this.
126
121
127
122
The `HasRichText` trait will also add an scope which you can use to eager load the rich text fields (remember, each field will have its own relationship), which you can use like so:
128
123
@@ -221,6 +216,7 @@ Laravel's Encryption component relies on the `APP_KEY` master key. If you need t
221
216
Additionally, the stored content attachments rely on the [Globalid Laravel](https://github.com/tonysm/globalid-laravel) package. That package generates a derived key based on your `APP_KEY`. When rotating the `APP_KEY`, you'll also need to update all stored content attachments's `sgid` attributes.
222
217
223
218
### The AsRichTextContent Trait
219
+
224
220
<aname="asrichtextcontent-trait"></a>
225
221
226
222
In case you don't want to use the recommended structure (either because you have strong opinions here or you want to rule your own database structure), you may skip the entire recommended database structure and use the `AsRichTextContent` custom cast on your rich text content field. For instance, if you're storing the `body` field on the `posts` table, you may do it like so:
@@ -267,13 +263,13 @@ To this minified version:
267
263
<rich-text-attachmentcontent-type="image/jpeg"filename="blue.png"filesize="1168"height="300"href="http://example.com/blue.jpg"url="http://example.com/blue.jpg"width="300"caption="testing this caption"presentation="gallery"></rich-text-attachment>
268
264
```
269
265
270
-
And when it renders it again, it will re-render the remote image again inside the `rich-text-attachment` tag. You can render the content for *viewing* by simply echoing out the output, something like this:
266
+
And when it renders it again, it will re-render the remote image again inside the `rich-text-attachment` tag. You can render the content for _viewing_ by simply echoing out the output, something like this:
271
267
272
268
```blade
273
269
{!! $post->content !!}
274
270
```
275
271
276
-
*Note*: since the HTML output is NOT escaped, make sure you sanitize it before rendering. See the [sanitization](#sanitization) section for more about this.
272
+
_Note_: since the HTML output is NOT escaped, make sure you sanitize it before rendering. See the [sanitization](#sanitization) section for more about this.
277
273
278
274
When feeding the Trix editor again, you need to do it differently:
279
275
@@ -284,6 +280,7 @@ When feeding the Trix editor again, you need to do it differently:
284
280
Rendering for the editor is a bit different, so it has to be like that.
285
281
286
282
### Image Upload
283
+
287
284
<aname="image-upload"></a>
288
285
289
286
Trix shows the attachment button, but it doesn't work out-of-the-box, we must implement that behavior in our applications.
@@ -303,6 +300,7 @@ The package contains a demo application with basic image uploading functionality
303
300
However, you're not limited to this basic attachment handling in Trix. A more advanced attachment behavior could create its own backend model, then set the `sgid` attribute on the attachment, which would let you have full control over the rendered HTML when the document renders outside the Trix editor.
304
301
305
302
### Content Attachments
303
+
306
304
<aname="attachments"></a>
307
305
308
306
With Trix we can have [content Attachments](https://github.com/basecamp/trix#inserting-a-content-attachment). In order to cover this, let's build a users mentions feature on top of Trix. There's a good [Rails Conf talk](https://youtu.be/2iGBuLQ3S0c?t=1556) building out this entire feature but with Rails. The workflow is pretty much the same in Laravel.
@@ -322,6 +320,7 @@ You may use Blade to render an HTML partial for the attachable. For a reference,
322
320
You can later retrieve all attachments from that rich text content. See [The Content Object](#content-object) section for more.
323
321
324
322
### The Content Object
323
+
325
324
<aname="content-object"></a>
326
325
327
326
You may want to retrieve all the attachables in that rich text content at a later point and do something fancy with it, say _actually_ storing the User's mentions associated with the Post model, for example. Or you can fetch all the links inside that rich text content and do something with it.
@@ -427,6 +426,7 @@ class OpengraphEmbed implements AttachableContract
427
426
You can see a full working implementation of this OpenGraph example in the Chat Workbench demo (or in [this PR](https://github.com/tonysm/rich-text-laravel/pull/56)).
428
427
429
428
### Plain Text Rendering
429
+
430
430
<aname="plain-text"></a>
431
431
432
432
Trix content can be converted to anything. This essentially means `HTML > something`. The package ships with a `HTML > Plain Text` implementation, so you can convert any Trix content to plain text by calling the `toPlainText()` method on it:
@@ -479,6 +479,7 @@ If you're attaching models, you can implement the `richTextAsPlainText(?string $
479
479
|------------------------|
480
480
481
481
### Sanitization
482
+
482
483
<aname="sanitization"></a>
483
484
484
485
Since we're rendering user-generated HTML, you must sanitize it to avoid any security issues. Even though we control the input element, malicious users may tamper with HTML in the browser and swap it for something else that allows them to inject their own HTML.
0 commit comments