 |
| How to remove "widget_css_bundle.css" or "css_bundle_v2.css" render blocking CSS File from Blogger Theme? |
You might be worried about your website loading speed. You are using very simple blogger theme with few widgets but it is taking unexpected time to load completely. You have taken many steps to improve your site loading speed but those are not working.
The main reason behind this, there is many JavaScript and CSS Files loads in the background with a default and custom Blogger theme and that cause delay to load your site. And those scripts are called render blocking CSS file.
Blogger Platform use those CSS Files for -
1. Default Blogger widgets like
- Popular Post Widget
- Featured Post Widget
- Label Widget
- Archive Widget
- Contact Form Widget
2. And for default features like
- Commenting system
- Post Locations
- Emotion
- Share buttons
For Default Blogger theme users those CSS files are ok but obviously this will affect the site loading speed, but if you are using customize Blogger themes then those CSS files are unnecessary. Generally in custom Blogger theme developer uses custom script to design the theme. So if default CSS script files load with custom CSS script then your theme may conflict with both script. As a result the CSS script may not give you actual output against JavaScript files.
So Blogger user should remove render blocking CSS and JavaScript from your Blogger theme. Just visit your Blogger site and view HTML source of your page by using Mouse or by pressing Ctrl+U. And you can see the Render blocking CSS files in your theme. But by editing HTML of your theme you won’t able to see.
However before proceed just check your Blogger theme loading speed by visiting the below URL
And after applying the below trick again check the page speed so you can understand the loading speed improvement. After applying the trick my site loading speed has increased 20%.
In this tutorial I will show you how to eliminate render blocking CSS files from Blogger theme by following super easy step.
Step #1: Log in to your Blogger Account and Go to your Blogger Dashboard
Step #2: Click on Now click on
Theme -> Edit HTMLStep #3: Now locate opening html or HTML from the top of the Blogger theme by pressing Ctrl+F (Windows) or CMD+F (Mac).
Step #4: Now add
b:css='false' after the html or HTML code. The script would be similar or nearly look like below code line.
<html b:css='false' b:version='2' class='v2' expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
Step #5: Finally hit the
Save theme button from the top. Now you will see the magic. View your blogger theme’s page source and see render blocking CSS file has gone after applying the above trick.
This small trick will help to boost website loading speed and this will remove Blogger default CSS files. Now your Blog visitors will able to surf your page smoothly.
No comments:
Post a Comment