Style Manager features/improvements

I would very much like to see some of these things be implemented:

  • Search (Ability to filter through styles)
  • Ability to view all elements connected to that style
  • Multiple style namespace (i.e. allowing me to change between sets of styles; multi-colorscheme websites)

I know you guys are probably busy as it is doing some awesome stuff, this is just my personal wishlist :stuck_out_tongue:

Thanks :slight_smile:

12 Likes

I agree.

Adding to that:

  1. ability to sort the styles list alphabetically
  2. ability to select a style from the styles list for editing

ad 2. Say I have a style that has nested childs. How to select the parent for editing at this moment?

Cheers,
Martin

7 Likes

Thanks for the feedback guys.

@MartinB does this answer your question for ā€œSay I have a style that has nested childs. How to select the parent for editing at this moment?ā€

Or are you wanting that functionality in the style manager?

2 Likes

@thegergie I didnā€™t know that. Thanks for pointing that out.

Martin

Have the classes ordered alphabetically in the style manager list is really important if you have a lot of styles. Right now if you want to rename a class you have to read the whole list first to find it.

6 Likes

Dear Webflow Team,

I agree 100%

I just started working with Webflow, threw myself straight into a big project without much testing around.

What an awesome tool you have created!

I am spending a lot of time tracking down styles in the style list viewer. As I want to keep my styles tight and neat, I constantly find better ways to rethink, reuse and thus rename my styles.

To start it would be of enormous help to sort the list alphabetically!!

Secondly it would be helpful if I could rename a style right in the selector window, rather than having to go to the style manager.

Thirdly, yes, as mentioned in other posts: Duplicating styles so I donā€™t have to start from scratch with every style.

Thank you for listeningā€¦

Tobias

7 Likes

Hey guys! Couldnā€™t agree more with you all. We are definitely planning to make improvements to our Style Manager soon. No public roadmap for this at the moment, but hopefully sooner than later! Keep the ideas coming on this :slight_smile:

2 Likes

Now that I have been happily working more and more with Webflow I will try and re-summarize:

All the issues around the classes in the style manager are really costing me by far the most time. By far far far. I think you guys have created an amazing product but this is really cumbersome and counter-creative in terms of my ability to approach the design more playfully.

Seeing how far this whole style manager discussion goes back, I personally would prefer seeing this improved before adding completely new features. Yes, itā€™s tempting to have more and more effects and featuresā€¦ but in this case IMHO some important foundation work needs to be done with the style manager.

So hereā€™s my wish list:

  1. Alphabetical listing - really a TOP priority in my experience

  2. Duplicating styles

  3. Renaming styles on the fly in the style/layout window

  4. Un-nesting styles that have been accidentally nested

  5. Tracking down instances of styles from the style manager. For example I have an old style, I think I am not using it anymore, want to delete it but I canā€™t because it is still being used somewhere. It would be mega helpful if the manager could just show me where, so I can remove the style.

  6. Force Remove styles from the style manager

  7. Please add a style, similar to Body or ALL Paragraphs, that letā€™s me define the base look of text links.

Keep up the great work and thank you for listeningā€¦

Tobias

10 Likes

I want to change the classes organization. In this case, for example, to move Pull Left to the root and to keet small link inside links.

How can i manage that?

1 Like

Hi @Marcelo_Melo, thanks for your post. I have moved this topic to the Wishlist category, because at the moment, it is not possible to rearrange styles by dragging.

The style nesting is defined automatically as you work with classes in the style panel. To move the class in your example, click on element having the Pull Left class and remove the nested Small Link class. Then click on the element having the Link class and add the Small Link class as a nested class of the Link class.

I hope this helps, if not, let me know, I am here to help :smile: Cheers, Dave

@Tobias as the designer of Webflow, my vision for the designer is not even close to being complete. Most of your suggestions are part of my grand vision, but will just take time and resources to implement. I actually have designs for most of these improvements but we havenā€™t been able to implement them. Just telling you these things so you have some hope and excitement for Webflow. Weā€™re doing big things here. :smile:

10 Likes

@Tobias, Sometimes using the web inspector and ā€œfindā€ on published code can help you quickly track down scenarios like #5 in your list for classes, interactions and even hidden elements from media queries. Also, when in the designer, using the browser ā€œfindā€ (command-f on a mac) may help you to quickly locate the item in the style manager (class) list.

Great list Tobias.

@thesergie the big picture is quite visible and your tool is nothing short of phenomenal for someone like me, who has never programmed a webpage.

@vlogic thank you for that info!

Any updates on this? Would also really love to be able to organize styles. Also would be great if we can organize the styles in folders like ā€˜General Stylesā€™, ā€˜Headerā€™, etc. Then the folder names should translate as comments on the actual stylesheet on export.

3 Likes

I didnā€™t understand the style manager. its too complecated to re-arrange classes. a bit horribleā€¦

I am having problems in Safari with zoom. I do not really try to zoom anything - I just seem to get a message that tells me that my browser has a non-standard zoom setting. If I zoom in and out - there is a fraction of a moment where it disappears. This is strange to be restricted to some abstract setting.

The other things is that my right panel is tiny. If you look at Wills videos tutorials - his panel looks normal. I contacted help and am told that one cannot adjust the panel size.

I feel I need a magnifying glass to read the panel.

hey @Tobias
what i do to find a style in the style list is using the classic CTRL+F on your browserā€¦ it is not the best but it avoids me to read the whooooole list of classes looking for a specific oneā€¦

1 Like

How can this not be a thing yet? Itā€™s been too long.

1 Like