Visual Editor concepts overview
A deeper dive into how Visual Editor fits into your modern web stack and how its major elements work.
Visual Editor enables developers to compose a custom site-building experience for the unique needs of their sites, by providing a mechanism for connecting content sources and third-party marketing tools into a single website management experience.
This experience is controlled through configuration files that live alongside your code, with zero impact on your production application. Learn how the visual editor works.
Visual Editor can make content from any source editable both in context and through standard and custom form controls. Additional features and third-party tools can also be integrated to enable your team to have a single source of truth for website management while continuing to use your preferred tools.
# Visual Editor’s role in your stack
Visual Editor plays no role in your production application. Visual Editor only interacts with your site while it is running the development server.
Note
Visual Editor has no effect on your production code:
- Development Only: Your production application can run completely independent of Visual Editor.
- Development Dependencies: Any dependencies we require are development dependencies.
- Loading Content: The method by which you retrieve and deliver content to your pages and components is independent of how Visual Editor loads and stores content during the editing process.
# Choose a starting point
Although we have a number of templates and examples, many developers choose to bring Visual Editor into an existing site. Most sites and frameworks can be compatible with Visual Editor, though they may require custom configuration. (Talk to us to learn more.)
# When to add Visual Editor
Visual Editor sits in a unique position in your stack. While it doesn't run in production, it plays a crucial production role in bringing together all tools and services necessary to edit and manage your site in a single environment.
Having this tool at your disposal throughout the development process is vital to optimizing content modeling, catching design issues, and generally minimizing rework. While integration tends to be relatively seamless regardless of where you are in the process, we recommend bringing Visual Editor in as early as possible.
# Migrate to a modern stack
Because we're concerned with bringing together the myriad of tools and services required to build a modern site, we often play a role in helping our customers choose what will serve them best. However, this answer is unique to each team and each project. The best way to get started is to send us a message.
# Concepts documentation
To learn more about key concepts for Visual Editor, check out the concepts docs.
- How the visual editor works: walk through the core concepts of how Visual Editor works by following a developer's typical journey.
- Content-driven development: empowering non-technical editors to make structural changes to a website without the help of a developer.
- Reusable content: help content editors work faster by providing a starting point for content.
- Structured content: how Visual Editor works with structured content, along with content modeling basics.
- Two-way content sync: Visual Editor stores content back to the appropriate source, while also listening for changes from each source.
Did you find this doc useful?
Your feedback helps us improve our docs.