Hi there!
I’m enjoying the new design panel for theme editing a lot! Great work guys. My question: How do I use a theme I edited in production? Because right now I get a theme css file (around 300kb) additionally to the bootstrap css files. This is cool for prototyping but way too much for a deployment. I’d like to understand: How is the workflow with the new theme editor, what is happening to the files, and how can I make a small, compact css file not more like the standard bootstrap? Or do I need to override the standard bootstrap with additional css files? Sorry if I explained not too well, I’m a designer, sometimes it is hard to speak “developer-language” 
Thank you!
Hi @Robb,
The theme file ‘bootstrap.css’ found in the ‘bootstrap_theme’ folder should be the only one you need. That also contains all of the core Bootstrap CSS.
One “trick” you can use for a first pass at shrinking your style sheet is to convert your project to a SASS project using the Page → Customize & update Bootstrap theme. This will trigger the compiler to remove any unused rules. You don’t need to know SASS, you can just style like normal. However, if you aren’t comfortable, you can convert your development project after you are finished, but before deployment into production. This took my small project from about 300kb down to 197kb.
The only other thing that you can do, without setting up more advanced developers tools, is to use an online minimizing service, CSSMinifier is an example.
Cheers,
Bob
1 Like
Thank you for explaining, this helped a lot!
1 Like