Back to updates
Enhancement
Designer

Edit components in slots

You can now edit the main component right from a component instance inside of a slot.

Edit components in slots

<p id=""><a href="<https://webflow.com/updates/component-slots>" id="">Component slots</a> allow you to create more modular components with placeholder content areas that can be customized on any instance — like a section that contains CTA cards on one instance and testimonials on another.</p><p id="">To build on that flexibility, we’re making it easier to work with components inside of a slot. Now, when a component instance is nested in a slot, you can edit the main component of that instance right there.</p><figure class="w-richtext-figure-type-image w-richtext-align-fullwidth" style="max-width:1280px" data-rt-type="image" data-rt-align="fullwidth" data-rt-max-width="1280px"><div><img src="<https://cdn.prod.website-files.com/64f9399ca7d13575ff21a675/66f2bc012f4902e1a55b461366f2bbc51d3b9dd9988d199dSlashUpdates_1280x720.jpeg>" loading="lazy" alt="__wf_reserved_inherit"></div></figure><p id="">Editing now works the same whether or not a component is inside of a slot. To start editing, double-click the instance or click the edit button on the canvas or right panel.</p><p id="">We’ve also improved the way slots are labeled, with consistent naming in the Properties panel, Navigator, and on canvas. To customize the name, select the slot and go to the Settings panel while editing the main component.</p><p>For more information on component slots, head over to <a href="<https://university.webflow.com/lesson/slots?topics=layout-design>" id="">Webflow University</a>.</p>


Launched on
September 24, 2024
Category
Designer

Related updates

Custom tooltips for component props

Custom tooltips for component props

Learn more
Shared Libraries available on all paid Workspace plans

Shared Libraries available on all paid Workspace plans

Learn more
Introducing Webflow Interactions, powered by GSAP

Introducing Webflow Interactions, powered by GSAP

Learn more
Rename elements and component instances

Rename elements and component instances

Learn more
Advanced variables with functions

Advanced variables with functions

Learn more
See recently modified classes in the style selector

See recently modified classes in the style selector

Learn more