Improvements to the Favorites feature in Components

Adding favorites was a huge step in the right direction, and shortly afterward, in the announcements forum category, jo-r and I briefly discussed the next step should be to make the favorites organizable according to the users desire. Right now they appear to be organized alphabetically, which isn’t bad, but Ideally it would be best if we could order them however we like (preferably via drag-n-drop.) For example I would have section, container, row, and column one right after the other.

Even more cool would be if we could either choose a color for the little grey icon that currently sports a yellow dot. Like it would be great if you could choose from a palette and color all your text-related favorites one color, your layout favorites a different color, etc.

And lastly, I’d still like it if we could hide certain UI sections completely. For example, I will never use Bootstrap Studio Forms, so I don’t even need that section of components visible. Same goes with many other things I never use (Stucture, Articles, Features, Highlights, Headers, Projects, etc.) I simply never use any of these pre-built components, so being able to just hide them would greatly unclutter the Studio tab, and give me more room for what I do need to see.

How about it devs?
@martin @gabby

I would like to see some coclor or icon indication of BS3 and BS4 and soon to be BS5 components in the Fav list. I like @printninja’s suggestion to color code folders and/or component favs on our own. Right click, choose color. I can see right now that there is a color difference with custom components and default ones, that does help a lot, but it could use more love.

I wouldn’t mind having the ability to hide specific sections/components/etc. in the default Components area either, although I don’t really find it a cumbersome thing since I just close all the sections of components that I don’t use. Would still be nice to be able to have them not show.

My idea for this would be to add a category to the main menu named “View” which would be something people are already used to. Then add a sub section called Components that has the list there with check boxes for showing/not showing. Checked would be show, unchecked not. Something on that order anyways so that it’s not something hard to decipher for those used to having a “View” section in most apps already.

NOTE: I do have some universal ones (<br>, <br><br>, &nbsp, &amp;, and a few others) that BSS is picking up strangely. The single BR it’s tagging as BS3 and the double BR it’s tagging as BS4 and the NBSP it’s tagging as BS3. These are all correct for both versions. They were all created in the BS3 version so I’ve ruled out that it’s going by which version it was created in. Need some way to differentiate these types of custom components.

Thank you for the suggestions! It’s still early days for the Favorites group and we’d like to gather some more feedback before committing to specific changes.

So if other users wish to add their ideas on how we can make Favorites better, this is the place to do it.

This is strange. The app just checks what Bootstrap version the current design has, and marks the new component with the same version. It’s not impossible that there have been bugs in the past, so if you can try adding a new component now and checking if it’s detected correctly would help.

I hope others chime in, but I think making the order of the favorites selectable by the user is something fairly universal, and I can’t see anyone objecting to such a capability. Worse case scenario is they never use it, and leave their favorites in alphabetical order.

I know for me, having column and container at the top of the list, and then row and section towards the bottom is just inefficient, because in my workflow, I’m constantly adding, section > container > row > column.

Actually, you know what… in the process of typing this, I think I just solved this problem. I will simply add these components to my user library, give them names that will cause them to appear in the order I want, and then add them to my favorites. It also just occurred to me that I can save myself a ton of time by making a custom component comprised of a section with a single container, a single row, and single column in it, since I make dozens this same thing dozens of times each day. How did it never occur to me until now to make this a custom component I do not know. Duh on me!

I would still LOVE to see the ability to be able to do some sort of color-coding to the favorites. Again, if it’s optional, those who don’t care to change the colors can just leave the default gray, but I think most people would like the ability to do some sort of more discreet organization of the favorites, whether it’s by color, or some sort of heading or folder system.

I know the devs have been super busy with BS5 and the new documentation. I just wanted to give this topic a bump and add an additional idea.

In addition to being able to organize the Favorites as we like, it would be really great if we had complete control over organizing everything in the Studio panel.

I think a very simple solution would be to just allow us to make our own folders in the Studio Panel. Then one could simply make a folder named “unused,” and drag every single Category or individual component into it, making it vastly less cluttered.

The other solution (that I know would be a lot more difficult, but ultimately much more preferable) would be the ability to detach any of the panels and move them on to other monitors, the same way we can detach the HTML/Styles panel. I know this has been discussed before. Ideally, it would be great to be able to have nothing but the website workspace on the main monitor, especially now that Bootstrap 5 has the XXL size. But this would definitely necessitate the addition of some kind of saved “workspace” feature, so every time you open the program, you don’t have to setup all the panels where you want them.

Being able to do this would elevate BSS significantly in comparison to other website builders.