Remove Default Widget Bundle CSS from Blogger Template

Are you trying to remove blogger’s default widget from template? Don’t worry, now you are on right platform because in this post we are going to share How To Remove Default CSS Bundle Widget from Blogger Template? Actually, The important thing is that you cannot permanently remove Widget CSS bundle file only you can commented out so that it just ignored by the browser and make webpage load faster. Before learn this trick we should have to know about these CSS bundle widget. So let me explain first.

What Does the default Blogger CSS Bundle do?

The function of this file is to reset CSS styles according to the Blogger standards. The file carries the default, predefined Navbar styles, Blogger share buttons CSS, and many more besides utility classes like .clear, .widget etc.

Developers sometimes want to get rid of this default CSS file to make their templates more flexible in terms of custom assets, design responsiveness, etc. This tutorial post is all about removing or disabling the Blogger CSS bundle with least possible edits.

This is the exact code carrying that default Blogger CSS I found in my blog’s source code:

<link type=’text/css’ rel=’stylesheet’ href=’//www.blogger.com/static/v1/widgets/1738504331-widget_css_bundle.css’ />

What is Bundle CSS Widget in Blogger?

Widget CSS Bundles is a default stylesheet for all the widgets we apply from the layout section, so one cannot remove it like this only, as its secured internally. But we have a hack around that can help you in removing these CSS bundles hence making your blogger blog a lot faster. So to check these CSS stylesheet you can right click and see these two CSS styles like in the below image.

After we apply the hack, we are going to convert these two CSS link into normal comments line hence they won’t get loaded and you will get a speed boost. Check the below screenshot.

Now move on and learn How To Disable, Hide or Remove Default CSS Bundle Widget from Blogger Template?

How To Remove Default CSS Bundle Widget from Blogger

• Open Blogger >> Template >> Restore >> Download a Backup copy of your Blogger Template.
• Now Go to Template >> Edit HTML.
• Press CTRL+F and search for below code :

<b:skin><![CDATA[

• Now simply replace the above searched code with the below one.

&lt;style type=&quot;text/css&quot;&gt;

&lt;!– /*<b:skin><![CDATA[*/]]></b:skin>

<style type=’text/css’>

• Once again search for below code:

]]></b:skin>

• Now again replace the above searched code with the below one.

</style>

•  Now its pretty much done, press the Save Template button and see your result by right refreshing your blog, right clicking and looking inside the page source.

You should be able to see the links changed into those comments line, so it means it worked, now try to check your page speed and you will find huge decrease in the load time, hence increase in ranking.

What If Template Messed Up?

Conclusion: