WPBakery CSS generator question
-
In the Tools section there is a part called WPBakery CSS generator.
How do we use this please? How do I know which of the elements I’m using? Is it still worth doing?
Thanks
Hello,
The WPBakery CSS Generator helps optimize your website by only loading the CSS needed for the elements used on your site.
Navigate to WPBakery Page Builder > CSS Generator > Click Generate CSS > WPBakery will scan your pages and generate optimized CSS based on the elements used.
It reduces unused CSS and improves page speed, especially if you’re using many WPBakery elements.
Best Regards,
Ok thanks, so I don’t have to click any, just click generate and it will sort it all?
When I checked the page afterwards it had messed up some alignment so I have deleted the file now 🙁
Hello,
The WPBakery CSS Generator creates a custom CSS file by including only the styles needed for the WPBakery elements you’re actually using. Since WPBakery’s default CSS file is quite large (and includes styles for elements you may never use), generating a custom file can significantly improve performance — often reducing CSS file size by 200–400 KB.
However, it’s important to manually check the elements you’re using across your site before generating the file. If you leave out elements that are in use, it can cause layout or alignment issues like you experienced.
Best Regards,