Remove Widget CSS Bundle File from Blogger

Do you want to speed up your Blogger website? Are you looking for a Blogger optimization technique that can help you reduce your site load time? Lately, one of our customers asked us about how to remove widget bundle CSS file from Blogger. This specific widget bundle CSS file is automatically added to each blog that runs on Blogger platform. And to make it even worse, there is no way you can remove this widget bundle CSS file until now. However, today in this article, we will show you how to remove Widget CSS bundle file from blogger.

What is Widget CSS Bundle File?

By default, every blog that runs on blogger platform (no matter it is running on either free domain or custom) domain consists of a Widget CSS bundle file. The main function of this file is to reset the CSS style according to the standards defined by Blogger. This file consists CSS of various elements such as Navbar, widgets, header and etc.

However, if you are using a custom developed Blogger template, then having this widget CSS bundle is useless. It is not only always sitting there in the source code of your blog, but also eats a lot of space, which significantly reduces the site load time.

Why to Remove Blogger Widget CSS Bundle File?

Following are the few key reasons why you should think about removing it from your blogger site:

If you are not using Blogger's default templates then there are no reasons why you should not remove this CSS bundle.
If you are using a custom developed Blogger template, then customizing your template would become a lot more complex. Why? Because it consists of CSS codes that resets different element on your blog to the default styling of blogger.
It reduces the site load time a lot. Don't believe us? Check it out on Google Speed testing tool or you can check the screenshot below

How to Locate the Widget CSS Bundle File in your Blog?

If you're running a blogger site, you can easily find the Widget CSS bundle file in the source code of your blog. Follow the below steps to easily locate if your blog has the CSS widget bundle file:

Open your site in a browser (we're using Google Chrome).
Once your site is fully loaded press CTRL+U to view the source code of your site
Now press CTRL+F to enable the search bar and search for widget_css_bundle.css

How to Remove Widget CSS Bundle File from Blogger?

If you want to remove the CSS widget bundle file then follow the below instructions:

Step#1: Firstly, go to Blogger.com and login to your account. After successfully logging in, go to Template >> Edit HTML.

Step#2: Now in the blogger template html editor, search for <head> and replace it with:

<head>

Step#3: Again, search for </head> and replace it with:

</head>

Lastly, save your template and you have successfully removed widget CSS bundle file from your Blogger site.

We hope this article has helped you in learning how to remove widget CSS bundle file from blogger with ease. If you any query or suggestion feel free to comment them down below.

Comments/disqusion

2 comments

Prasun Das says:December 24, 2016

Thank you for sharing this useful tips. There is an another method to comment widget_css_bundle.css and authorization.css. First open source code of blog. Then copy CSS codes. Now go to Template - Edit HTML. Just below </b:skin> Type <style type='text/css'> Paste your copied CSS code here. </style>. Now replace entire code start from <b:skin> with CSS code and end to </b:skin> by &lt;style type=&quot;text/css"&gt; &lt;!-- /*<b:skin><![CDATA[*/]]></b:skin>

Prabir Ghosh says:December 24, 2016

Hi Blogger Archive and Prasun Das, Thank you for your beautiful post and comment. I have tested both tips to remove widget_css_bundle.css and both are works well. But the above method which is discuss in the post is easier than Prasun Das's comment method. There are so many newbie who have not enough knowledge on coding. So it is easier to change only <head> tag.

Comments/disqusion
2 comments

Prasun Das says:December 24, 2016
Thank you for sharing this useful tips. There is an another method to comment widget_css_bundle.css and authorization.css. First open source code of blog. Then copy CSS codes. Now go to Template - Edit HTML. Just below </b:skin> Type <style type='text/css'> Paste your copied CSS code here. </style>. Now replace entire code start from <b:skin> with CSS code and end to </b:skin> by &lt;style type=&quot;text/css"&gt; &lt;!-- /*<b:skin><![CDATA[*/]]></b:skin>
Prabir Ghosh says:December 24, 2016
Hi Blogger Archive and Prasun Das, Thank you for your beautiful post and comment. I have tested both tips to remove widget_css_bundle.css and both are works well. But the above method which is discuss in the post is easier than Prasun Das's comment method. There are so many newbie who have not enough knowledge on coding. So it is easier to change only <head> tag.