The Webflow Conf' 2022 had its share of surprises. Among these surprises, we witnessed the arrival of components or rather the evolution of symbols into components.
In today's article, we will decode the new features of this block reuse system.
Did you feel limited with symbols? You won't feel that way with components anymore
This name change reflects the new power of this feature - and sets the stage for future investments in reuse, workflow optimization, and additional control.
Here is the promise that Webflow makes regarding the deployment of components.
With this new feature, we can have greater flexibility in our Webflow project. Components are more intuitive and allow us to easily create variations of a model depending on our pages.
For those who are familiar with Figma, the components are almost identical in both tools.
The new features of components
Create components quickly
You can now create components with just one click.
With symbols, we had to go to the "Symbol" tab to create one.
Now, from the style or settings tab of the element, you have an option that prompts you to create a component: "Create component".
Edit text, links, or images in the component directly
Here’s a tangible example of the promise to make components intuitive. It is now possible to change the text (links or images) within a component directly by clicking on it in the Designer.
The text (link or image) will be unique to that instance of the component.
Discover the previous version of variants for symbols in Webflow!
Add dynamic content to a component
Previously, with symbol variations, we could not customize a symbol with content from a Webflow CMS collection.
This limitation is no longer an issue. In a dynamic page (and very soon within a collection list), if you insert a component and select an element within it, you can customize the content based on the fields of your collection.
Hide or show an element in a component
A new and significant feature of components: element visibility management. Yes, you can now make an element in an instance of a component visible or invisible. This allows you to create endless variations of your components (even if that’s not necessarily the goal).
What excites us the most is that this is just the beginning of components. The new features coming with components are fantastic for collaboration (especially with clients), flexibility, and optimizing a Webflow project, but we are only at version 1. New features will be rolled out in the coming months and years, enabling us to create 100% customized websites. Apparently, Webflow is studying the possibility of sharing components across different projects👀🔥
That’s what you needed to know about components in Webflow. To optimize your development time, you can now discover Webflow's other new feature: component libraries.
.webp)
.jpg)
