{ "messages": [ { "side": "incoming", "text": "wait, that is actually wild", "sender":
"Northbeam support" }, { "side": "outgoing", "text": "can you fix it?" }, { "side":
"incoming", "text": "way ahead of you" }, { "side": "outgoing", "text": "you are unreal"
}, { "side": "incoming", "text": "he owes you dinner for this one" }, { "side":
"outgoing", "text": "already booked" } ], "stagger": 0.86, "hold": 1 }
```
That writes one file: `compositions/thread-message-stack.html`.
## Add it to your video
It runs for 8 seconds at 1920×1080. Paste this into your composition:
```html index.html
```
Move it in time with `data-start`. Put it on a different timeline row with
`data-track-index`. See [data attributes](/concepts/data-attributes) for the rest.
{/* hf:generated-footer */}
Tagged `social` `conversation` `messages`.
## Related topics
- [Browse the complete Catalog](/catalog)
- [Add assets and Catalog items in the browser editor](/studio/assets-and-blocks)
- [Put blocks together into one video](/concepts/compositions)