Collaborate on your site in Webflow

Work collaboratively with your team in Webflow — create styles, edit content, and build out layouts with a simple handover process for full control of the site.

If you’re part of a team, you and your teammates can work on your site together in Webflow. 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. 

How to work in design, build, and edit mode

All members of a Workspace can collaborate on all sites to which they have access permissions within that Workspace.

To open your site:

1. Visit the Dashboard
2. Hover over the Workspaces dropdown menu in the top left of the Dashboard and click your Workspace name
3. Choose the site you want to open

You’ll open the site in design, build, or edit mode depending on which mode(s) you have access to and whether other teammates are also working in the site.

Design mode

If you have access to design mode and nobody else from your team is already working on the site in design mode, you’ll automatically enter design mode. Design mode lets you add classes, style elements, build layouts, create interactions, and everything else you need to fully design and launch your site.

If you open your site and a teammate is already working in design mode, you’ll be placed in build mode. When teammates open the same site, their avatars or initials appear in the top bar in Site actions.

Only teammates with the site manager, designer, and limited designer roles can access design mode. Teammates with the designer (needs approval) role can access design mode only on page branches.

Build mode

Build mode lets teammates like marketers or clients quickly build and edit pages (e.g., landing pages, competitor pages, feature/solution pages, event pages, etc.) using designer-approved building blocks and share pages for review before publishing.

In build mode, teammates can:

• Create new pages from static page templates
• Create new page branches
• Add, move, or delete existing components in page slots
• Customize component property values
• Edit text, links, and images
• Manage site assets
• Manage Collection items and Ecommerce products, categories, and discounts in the CMS panel
• Request review and approval of page branches

In build mode, teammates cannot:

• Make design changes (i.e., structural, style, or element settings changes, with the exception of component property values) or modify existing classes, components, and variables
• Merge page branches
• Create new classes
• Create new components

Teammates with the site manager, designer, limited designer, designer (needs approval), and marketer roles can access build mode. Marketers can only access build mode.

Edit mode

Edit mode lets teammates like content creators (e.g., copywriters, content strategists, etc.) edit site content like copy and assets without touching any part of the site design.

In edit mode, teammates can:

• Edit text, links and images (excluding background images)
• Manage site assets
• Manage Collection items and Ecommerce products, categories, and discounts in the CMS panel
• Manage page settings
• Publish the site

In edit mode, teammates 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

Only teammates with the content editor role can access edit mode. Webflow places teammates with the content editor role in edit mode by default when they open a site.

How to incorporate design changes in build and edit mode

As you work in build or edit mode, your teammates’ content updates in other build or 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 in the top bar of your site 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.

How to request design control

Oftentimes, you or your teammates will need to move from build mode to design mode to work on the structure of your site’s design. To switch from build mode to design mode, you can request control from your teammate in design mode.

To request design control and enter design mode:

1. Click the Design tab in the top bar
2. Click Request design control 
3. 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 design access. 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 design access. Meanwhile, your site automatically saves and syncs between all people in the site — whether they are in build mode, edit mode, or design mode. 

If you are in build mode and have requested design control, your teammate in design mode can decline your request. If the person in design mode declines your request, you’ll be notified. 

How to see other teammates in the site

In Site actions, you can see which teammates are working alongside you in the site, as well as which mode they’re using (i.e., design, build, or edit) and 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.

You can click on a teammate to navigate to the element they currently have selected.

How to work in comment mode

Comment mode allows you to share, review, and resolve feedback directly on the 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. Teammates with the reviewer role can only access comment mode.

You can click the “comment” icon in Site actions 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.

And there you have it: team collaboration in Webflow. Build all the things together!