â–Ľ
Streaming live at 10am (PST)

Copy Pasting Structures - Structures Library


#1

I can't count how many times people asked for a way to copy paste pages/elements from a site to another, and every single time I've said that it must be a difficult thing to do because of CSS merging conflicts. But I'm like everyone, not being able to copy anything from a site to another leaves a strange feeling, like being a caveman in a spaceship : you can do wonders but the simplest thing: nope.

So let put CSS aside and simply keep the blocks structure. Elements, widgets, call them how you like. Being able to copy and paste only that will be a huge time saver sometimes. I design a lot of "cards" lately, little pieces of content with a lot of attention to design, and they contain a ton of divs, blocks, spans, test etc.

And instead of just "copy" and "paste" them, why not "save as a design snippet" and "drag from the "Snippets Library", a library common to all sites in a plan. And we could share them too on our designers pages.

ADMIN EDIT: Vote for this feature here: https://wishlist.webflow.com/ideas/DESIGNER-I-6


#2

Hell yes, do I understand you correct that you're proposing a "General Snippets Library" for one account? Just as a template, but than smaller? That would be so fricking ideal. And also, exactly the way other software incorporates small snippets, for example Sublime Text with all those neatly functional snippet tools or Adobe CC.

Can I add a request to share color libraries across designs? It would be ideal that we can create (and maybe in the future share on the forums) custom color palets like colorlovers.com, or Adobe Kuhler. That would save tons of time as well.


#3

or support of .aco import/export ? In relation with the library...


#4

Yes, .aco is a fine start! That would do just fine for now.


#5

I feel the CSS conflict thing is a non problem. For instance you make a card/widget and export it to a shared lib. webflow could prepend all css classes/id's with "wgt(number)-" No conflict could occur from that.

(or the generated css could use inheritance and be something like .wf-widget-1 .yourclasses so its always encapsulated in a controlled class from webflow.)

So now I hear "What if someone used wgt1- as a class name though"... Easy answer! Why do something like that if its a known reserved string. The IDE could stop it and what more its no different to somebody overriding 'body' for instance.

So no I don't think its a difficult thing to achieve and would be more valuable than not having it smile


#6

This is an issue that has bugged for ages…
Please Dev team: get your head around it, the wonders you have already created with Webflow demonstrates your skills - surely this is not beyond you…?
Just as Robert has said, the CSS conflict can be minimised. Before the snippet/widget option was voiced I was thinking that if content was copied from one site to another any associated CSS could be prefixed so separation occurs.
Yes the CSS may become a little untidy, but surely it would be easier to clean up the CSS afterwards than recreate all the lovingly crafted components again.
I disagree with Vincent, the CSS is integral and needs to be copied as well… all those hovers and interactions will need to maintain their style.
I for one would like this to be prioritised, there is no easy way around it at the moment, it's painful and slow to recreate and copy all your work again for another site. CMSs are available in all shapes and sizes - and yes there are options other than Wordpress, Joomla, Drupal etc, but give us basic copy and paste functionality… pleeeaaaaaase !!!


#7

Unique ID, widlcard.. of course. But it's really using CSS the wrong way. I know it doesn't make any difference now that bandwidth and power has increased, but I wouldn't go that far. People will start putting snippets, tons of them, everywhere, ending up with frankensites. I wouldn't go this way.

The only approach, IMHO, would be no unique ID but a conflit solving module.


#8

As much as I would like, like you, the ease of copying rich snippets with CSS, I'm sure voicing against such a unique ID system. WF has done a tremendous job respecting HTML and CSS. DOin what you said will make Webflow code and css a nightmare, not a pretty thing, back to the dark age of Dreamweaver (DW uses wildcards to prefix a lot of things to avoid issues.) That's something I'd be very sad to see coming to WF. Any other solution but this one.


#9

Totally disagree. Webflow already uses its own CSS within any project you create.. Hence all the discussion around using the pages out with Webflow domains. Having the ability to do this would explode its use across the web not hamper it.

As I said before in a previous post. These bits of CSS could be achieved via inheritance. That could be removed after the fact. Which IS how CSS is supposed to work.


#10

Of course, and it's clean, nice CSS with hierarchy, nothing wrong with that. Now start to prefix everything and CSS size will explode. You'll have people with "p" declared hundred times in no time.


#11

Not at all.

imagine

wf-widget-1 .myfragment {
bla
bla
bla

}

on export:

remove wf-wdget-1 and everything will still work in a standalone basis on your own domain space. There is nothing wrong with that approach so long as everyone understands it.

As I think about this more it could be added to the global Webflow CSS and you would be none the wiser wink

Or leave it in there... The point is folks want this smile


#12

Oh that I know (: I also want a keg in my car when I'm driving, i wonder why constructors don't come up with a bar in every car...

Ok I'm kidding now (: we all made our point (:


#13

Not trying to be offensive btw. Just feel we all need heard on this smile

Oh and also contact Pimp My Ride you will get your keg wink


#14

haha not abad idea, but I'd rather have Mythbusters customizing my car ◕‿◕


#15