Collaborate in the Webflow Designer
Work collaboratively with your team in the Webflow Designer and take turns editing content and building out styles and layouts with an easy handover process for full control of the site.
If you’re part of a team, you and your teammates can work together in the Webflow Designer. Multiple teammates can edit content while one person designs and builds out the site structure. To keep the design process fluid, you can also hand off design control between your teammates and see in real-time where other people are working within your site.
Note: Workspace owners and admins can manage teammates’ roles, which sets each teammate’s access to admin, design, and publishing permissions. For more information regarding roles and permissions, please visit our Workspace roles and permissions article.
In this lesson, you’ll learn:
- How to work in design mode
- How to work in edit mode
- How to request design control
- How to see other teammates in the site
- How to work in comment mode
How to work in design mode
All members of a Workspace have access to collaboration in the Designer. To access your site:
- Visit the Dashboard
- Hover over the Workspaces dropdown menu in the top left of the Dashboard and click your Workspace name
- Choose the site you want to open in the Designer
When you enter the Designer and nobody else from your team is in the site, you’ll automatically enter design mode (as long as you don’t have a Can edit or Can comment role). Design mode gives you full control to add classes, style elements, build layouts, create interactions, and everything else you need to fully build and launch your site.
When you’re in design mode, as soon as other people open the same site, their avatars or initials appear in the upper right corner of the Designer, which indicates additional team members are editing content in your site.
Alternatively, if you open your site in the Designer and a teammate is already in design mode in the Designer, you’ll be placed in edit mode.
How to work in edit mode
Edit mode lets you edit content in the Designer while another teammate builds and designs the structure of your site in design mode. Multiple people can be in the Designer at the same time, but only one person can use design mode, and the remainder of your team can use edit mode to add or edit content.
Your editing status appears in the upper-right corner of the Designer alongside avatars of teammates who are working in the site.
Teammates in edit mode can:
- Edit text, links and images (excluding background images)
- Manage site assets
- Manage Collection items in the Collections panel
- Manage Ecommerce products, categories, and discounts
- Manage page settings
- Publish the site
Teammates in Edit mode cannot:
- Make design changes (i.e., structural, style, or element settings changes)
- Edit main components or component instances
- Edit dynamic content on the canvas
- Adjust page names, add or edit page folders, edit page slugs, or set a homepage
- Add or edit custom code
- Update CMS settings or create new CMS collections
How to incorporate design changes
As you work in edit mode, your teammates’ content updates in other edit mode sessions will sync live to the canvas in your session as well.
Structural and design changes that your teammate makes in design mode (e.g., adding and removing elements, changing layouts, tweaking styles) will not automatically sync live.
When the site design and/or structure has changed, a yellow indicator appears at the top of the Designer indicating that your design mode teammate has made changes. To incorporate these changes and continue working with the most up-to-date version of the site, save your work and refresh the site to continue working.
Good to know: Changes made in edit mode will sync live to all open Designer sessions.
How to request design control
Oftentimes, you or your teammates will need to move from edit mode to design mode to work on the structure of your site’s design. To switch from edit mode to design mode, you can request control from your teammate in design mode.
Note: Only teammates with Site admin, Can design, and Can design (limited) roles can request design control.
To request design control and enter design mode:
- Click the mode status dropdown to the right of your teammates’ avatars (the mode status indicates that you are editing in the Designer)
- Click Request design control
- Click Request to notify the person in design mode that you’d like to request design control from them
After you’ve pressed the request button, the person in design mode has 30 seconds to respond to your request for design control. The person in design mode can choose to either keep design control or hand over control to give you full Designer access in design mode. Once your design control request is accepted, your site will refresh to load you into design mode, and the teammate who granted you design access will be switched to edit mode.
If the person in design mode doesn’t respond within the 30 second time limit, the person who requested design control will automatically enter design mode and have full access to the Designer. Meanwhile, your site automatically saves and syncs between all people in the Designer — whether they are in edit mode or design mode.
If the person in design mode declines your request, you’ll be notified.
If you are in edit mode and have requested design control, your teammate in design mode can decline your request.
Good to know: After 2 minutes of inactivity in the Designer, the person in design mode will automatically be switched to edit mode. If another teammate requests design control, the person originally in design mode will be notified once that teammate takes control. If no one else takes design control during the period of inactivity, the person originally in design mode will continue on in design mode once their activity in the Designer resumes.
How to see other teammates in the site
At the top of the Designer, you can see avatars indicating which of your teammates are in the site alongside you. Hover over an avatar to display full names and what they’re doing in the site (designing or editing) as well as what page they’re working on. If a number appears, click on it to reveal which pages your teammates are working on. You can also click on the teammate directly to navigate to the element they have selected.
Good to know: You can update your avatar (your profile picture) in your account profile.
At the top of the Designer, you can see which teammates are working inside the Designer with you, as well as which pages they’re working on.
If you are the only person working on a page, your teammates’ avatars switch to a number (e.g., 2, 3, 4, and so on) to indicate how many other teammates are in your site, but on different pages.
If you click into a page where other teammates are working alongside you on the same page, the number indicator will change to individual avatars of each of your teammates to let you know you are all working on the same page together.
When you click into the numbers or avatars, you’ll see a dropdown indicating exactly which pages your teammates are working on. You can click on the teammate directly to navigate to where they’re working in the site.
How to work in comment mode
Comment mode allows you to share, review, and resolve feedback directly on the Designer canvas, streamlining your team’s communication and design workflow. Comment mode is included on all Workspace plans for all Workspace members, including those with guest roles.
You can click the “comment” icon in the top toolbar to enter comment mode. There, you can click on any element on the canvas to add a comment, or review and reply to existing comments in the Comment panel. Learn more about comments.
And there you have it: team collaboration inside the Designer. Build all the things together!