Skip to main content
All CollectionsWebsite Management
A Step-by-Step Guide to Using Webflow Edit Mode in the Designer
A Step-by-Step Guide to Using Webflow Edit Mode in the Designer
Leslie Pumm avatar
Written by Leslie Pumm
Updated over 2 months ago

Empowering you to manage and update your website’s content is a priority for us at Sea Brand. With Webflow’s new Edit Mode, integrated directly within the Designer, you can make content changes without altering the site’s design or structure. This comprehensive guide will walk you through accessing Edit Mode, editing various content types, managing dynamic content, and best practices to ensure a smooth editing experience.

Accessing Edit Mode

To begin editing your website’s content:

  1. Log In: Navigate to your Webflow Dashboard and hover over your site’s thumbnail.

  2. Open Site: Click on “Open site” to enter Edit Mode directly within the Designer interface.

Note: Ensure you have the necessary permissions to access Edit Mode. If you encounter issues, please contact the Sea Brand support team.


Editing Static Content

Static content includes text, images, and links that are not connected to dynamic collections.

Editing Text

  1. Select Text Element: Hover over the text you wish to edit; a blue outline will appear.

  2. Click the Pencil Icon: Click on the pencil icon in the upper-left corner of the element to activate the text editor.

  3. Make Changes: Directly type your new content on the canvas.

  4. Save: Click outside the text box to save changes.

Formatting Tip: Highlight text to access formatting options like bold, italics, or hyperlinks.

Updating Images

  1. Select Image Element: Hover over the image you wish to replace; a blue outline and an image icon will appear.

  2. Click the Image Icon: This opens the image settings.

  3. Upload New Image: Click ‘Replace Image’ to upload from your device or select from existing assets.

  4. Save Changes: Ensure the new image appears correctly.

Modifying Links

  1. Select Link Element: Hover over the link; a blue outline and a link icon will appear.

  2. Click the Link Icon: This opens the link settings.

  3. Edit URL: Input the new URL or select a page within your site.

  4. Save Changes: Click ‘Save’ to apply the new link.


Managing Dynamic Content

Dynamic content is powered by Webflow’s CMS Collections, allowing for structured content management like blogs, portfolios, or product listings.

Editing Collection Items

  1. Access CMS Panel: In Edit Mode, click on the ‘Collections’ icon in the left-hand toolbar.

  2. Select Collection: Choose the collection (e.g., Blog Posts) you wish to edit.

  3. Edit Item: Click on the item to open its settings.

  4. Make Changes: Update fields as necessary (e.g., title, body content, images).

  5. Save and Publish: Click ‘Save’ to keep changes as a draft or ‘Publish’ to make them live immediately.

Note: If you edit a Collection item and want to preview it, you’ll be prompted to save the item before previewing. This saves your Collection item either as a draft or as staged changes. If you don’t save the item before previewing, your changes will be lost.

Adding New Collection Items

  1. Access CMS Panel: As above, click on the ‘Collections’ icon.

  2. Select Collection: Choose the appropriate collection.

  3. Add New Item: Click the ‘New’ button.

  4. Fill in Details: Complete the required fields.

  5. Save and Publish: Choose to ‘Save as Draft’ or ‘Publish’.

Note: Ensure all required fields are completed to avoid issues during publishing.


Best Practices

  • Coordinate Edits: If multiple team members are editing simultaneously, communicate to prevent overwriting changes.

  • Preview Changes: Use the ‘Preview’ function to see how edits appear before publishing.

  • Regular Backups: Periodically export site data to maintain backups of your content.

  • Seek Support: If uncertain about a change, contact the Sea Brand support team for guidance.


By following this guide, you can confidently manage and update your website’s content using Webflow’s Edit Mode within the Designer. This empowers you to keep your site current and reflective of your brand’s evolving needs.

For further assistance, refer to Webflow’s official Help Center or contact Sea Brand support.

Did this answer your question?