Real-time collaboration and multi-user authoring for Statamic Pro.
- Presence indicators when multiple people have the same entry opened.
- Fields get locked when someone else focuses them.
- Updates to field values are reflected to everyone.
You can install and configure the Collaboration addon using a single command:
php please install:collaboration
The command will install the statamic/collaboration addon, setup Laravel's broadcast scaffolding and prompt you to select which broadcast driver you wish to use.
For more information on the specifics for each broadcast driver, please review the following:
The install:collaboration command will install Laravel Reverb into your application. After installation, run php artisan reverb:start to run Reverb's WebSockets server, then the Collaboration addon should start working in the Control Panel.
When you deploy your application to a server, you will need to run the Reverb WebSockets server as a daemon (php artisan reverb:start). If you're using Laravel Forge, there's a Reverb toggle in your site's "Application" panel.
For further information on Reverb, please review the Laravel documentation.
The install:collaboration command will install Pusher's PHP SDK into your application. After installation, you should add your Pusher credentials to your .env file:
PUSHER_APP_ID="your-pusher-app-id"
PUSHER_APP_KEY="your-pusher-key"
PUSHER_APP_SECRET="your-pusher-secret"
PUSHER_HOST=
PUSHER_PORT=443
PUSHER_SCHEME="https"
PUSHER_APP_CLUSTER="mt1"
You should also ensure you have enabled the "Client Events" setting (found under the "App Settings" page in the Pusher Dashboard).
If you're planning on using a different broadcasting driver, there are a few additional steps you'll need to take to get it working:
- Install & configure your broadcasting driver (obviously)
- Update the
BROADCAST_DRIVERin your.env - Create a
resources/js/cp.jsfile and add it to the Control Panel. - In your
resources/js/cp.jsfile, register a callback to override Statamic's Echo config:
Statamic.booting(() => {
Statamic.$echo.config(() => ({
broadcaster: "pusher",
key: Statamic.$config.get('broadcasting.pusher.key'),
cluster: Statamic.$config.get('broadcasting.pusher.cluster'),
wsHost: Statamic.$config.get('broadcasting.pusher.host'),
wsPort: Statamic.$config.get('broadcasting.pusher.port'),
wssPort: Statamic.$config.get('broadcasting.pusher.port'),
forceTLS: false,
encrypted: true,
disableStats: true,
enabledTransports: ["ws", "wss"],
}));
});By default, the Collaboration addon plays sound effects when other users join & leave entries.
If you wish to disable these, you may publish the configuration file (via php artisan vendor:publish --tag=collaboration) and set sound_effects to false.
// config/collaboration.php
return [
'sound_effects' => false,
];By default, the Collaboration addon plays sound effects when other users join & leave entries.
If you wish to disable these, you may publish the configuration file (via php artisan vendor:publish --tag=collaboration) and set sound_effects to false.
// config/collaboration.php
return [
'sound_effects' => false,
];When the "meta data" of a fieldtype is updated, it will be broadcast to the other users in the channel. If you have a fieldtype that contains a large amount of meta data, and it gets updated (some may just provide initial state and never change), you may consider specifying the fields that should be broadcast. This could help keep message sizes smaller and improve performance.
In your fieldtype's preload method, you can use the special __collaboration key to list the fields.
public function preload()
{
return [
'hello' => 'world',
'foo' => 'bar',
'__collaboration' => ['foo'],
];
}When the meta data gets updated, only the foo value will be broadcast. The remaining values will get merged in automatically.
![dependabot[bot] avatar](https://avatars.githubusercontent.com/in/29110?v=4 "dependabot[bot]")
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent