Hi there WebFlow community. I’v been waiting three weeks for a reply from WebFlow so thought I might have better luck here.
I had a developer design my page, but want to change a few items. The classes are a headache. Changing one item can mess up others else where. Is there a way to copy an entire part of a page and then disconnect the classes and only make changes to that set of items?
Their tutorial shows you how with a very simple disconnect button. Unfortunately that button no longer exists… Here is a link to their tutorial. https://university.webflow.com/lesson/components?topics=layout-design#how-to-unlink-a-component-instance-from-its-main-component
Any help would be appreciated!
Cheers,
Hello @Chrisleighhh, welcome to the community. So what I do whenever I want to modify an specific instance of a class that is unique, and it is now just an override of the original class, I copy the class and use that copy instead. That way the original class is not changed and the new class (the copy) can be modify from the original base. To copy the class simply hover over the class you want to modify on on the dropdown menu select Duplicate class.
I hope this helps!
Thank you so much for the quick reply. is there a way to do this to multiple items? I have a page with around 45 items which all need to be disconnected so they do not mess with the main website.
Thank you,
you can do it to every class you have, you have to do it individually though. Alternatively you can also create combo classes, where you add another class to your existing class, but you can make changes just to that new combination of classes and not to the single original class. To add a combo class simply click next to the blue class tag and type your new combo class
I hope this helps!
Thank you very much! I will give this a try. Cheers,
One quicker way to do it for multiple elements:
- With your project open in one browser tab, open a new tab in your browser.
- In the new tab, go to Webflow.com and navigate to the project’s settings area.
- Go to your backups for the project and select to preview a recent save
- Navigate to the page with all of the elements you’re needing to copy
- Copy the parent element that holds all of the elements you need
- Switch back to the browser tab with your working Webflow project
- Paste the “previewed” div you copied into your project
Pasting it this way will automatically create copies of every class inside of that “previewed” parent div. It simply adds a “2” after the class name.
*hack-of-the-week
This is a cool hack @Port_of_Folio, I thought about it too, but chances are that some classes do not need duplication, I mean why have flex and flex2 if both classes do the same thing, I think it is better to go over each class and determine which class can stay the same and which class should be copied and modified.
Agreed, definitely not as clean and it depends on the scenario. If “flexbox” has 30 items inside that need quick duplication, I’d use this method and then change flexbox2 back to flexbox.
The OP states “copy an entire part of a page” so assumed it was similar.