Connecting a Figma file to Ditto isn’t a one-time import — you can sync changes between Ditto and Figma at any time. This keeps your mockups updated with the latest copy while maintaining Ditto as your source of truth.
Below, we’ll cover how Ditto keeps your copy in sync and how to resolve conflicts when they happen.
When the Ditto Figma plugin is open in your Figma file, copy syncs automatically between Ditto and your mockups. Any changes made in either Figma or Ditto update in real time. This is the primary way to keep your text in sync, and it happens automatically in the background!
<aside> 💡
Tip: Keep the Figma plugin open to sync text in real time
</aside>
If the plugin is closed, reopening it will automatically trigger a sync. You can also sync changes manually by clicking the sync icon (↻) in the top right of the plugin to fetch the latest text for your mockups.
If you want to keep syncing text changes in the background, you can minimize the plugin when you’re not using it, so its UI doesn’t clutter your screen.
As mentioned above, your product text in Ditto’s web app will be synced in real time with your mockups when the Figma plugin is open. However, design previews in Ditto may take a little longer to update.
To manually sync and load the latest copy and design previews from Figma into your Ditto web app, click the sync icon (↻) in the top right of the project page.
Conflicts happen when someone edits text in Figma while the Ditto plugin is closed. When you reopen the plugin and select that text item, Ditto will flag any sync conflicts.