Sunday, June 14, 2015

3 Major Disadvantages Of Removing Blogger Default Widget CSS
Featured Image-min Shocked? Yes. Because some days ago we had told you how to remove blogger default widget CSS without messing up your template. But now why this?
This is because We took a test about what changes will come after removing those two link hrefs from Blogger and for this, we had removed the two hrefs from Blogger Guiders for some weeks and found some major disadvantages from that test which we are going to discuss here today. We will also discuss here why we should not remove those two link hrefs from Blogger blogs. Plus, we will today tell you how can you reverse that two link hrefs in minutes to your blog!

Disadvantage #1- Messed Up Layout Tab

The most major disadvantage of removing those two hrefs is- the layout tab of your blogger blog will get messed up. Yes! I am talking about that layout tab in which you add awesome widgets of your blogger blog. My means of messed up is- the columns will get disturbed and look ugly. See these two images:
Before removing those two link hrefs
search-engine-love-min_thumb[5]-min
After removing those two link hrefs
After removing-min

Why this happens?

If you are thinking this question in your mind, then you are not the person who developed the template you are using in present. Right? Because when a template developer create a template, he/she always put body#layout CSS tags to make the layout tab’s interface user-friendly and easy to understand. When you remove those two links hrefs from your nice template, that body#layout CSS tags will surely stop working and this is the main reason of layout tab messing up.

Disadvantage #2- Blogger Default Widget will look Ugly!

When you every time go to Blogger Dashboard > Layout and click on Add a Gadget link, you surely see a list of widgets provided by bloggers. Right? All those widgets are created by Bloggers and the CSS of all those widgets are stored in those two link hrefs and when you remove those two link hrefs from your blogger blog, the widgets you have added using the Add a Gadget link will start looking ugly (like Popular Post widget, About Me widget), which is really a disadvantage of removing those two hrefs.

Disadvantage #3- Variable Definitions will stop working

Have you ever saw this type of code in your template (not same but similar) ?- [code] /* Variable definitions ==================== <Variable name="startSide" description="Side where text starts in blog language" type="automatic" default="left" /> <Variable name="endSide" description="Side where text ends in blog language" type="automatic" default="right" /> <Group description="Blog Post Title" selector="#header"> <Variable name="blogtitle.font" description="Blog Title Font" type="font" default="normal normal 30px Oswald,'Bebas Neue',Bebas,'Arial Narrow',Sans-Serif"/> <Variable name="blogdesc.font" description="Blog Description Font" type="font" default="normal normal 14px 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif"/> <Variable name="blogdesc.text.color" description="Blog Description Color" type="color" default="#F7F7F7"/> </Group> <Group description="Article Area" selector="body"> <Variable name="artitle.background.color" description="Background Color" type="color" default="#FFFFFF"/> <Variable name="article.border.color" description="Border Color" type="color" default="#DADADA"/> <Variable name="articlehead.font.color" description="Heading Color" type="color" default="#353535"/> <Variable name="widgethead.font.color" description="Widget Title Color" type="color" default="#353535"/> </Group> <Group description="Menu Area" selector="body"> <Variable name="menu.background.color" description="Background Color" type="color" default="#353535"/> <Variable name="menu.text.color" description="Text Color" type="color" default="#FFFFFF"/> <Variable name="submenu.background.color" description="Sub Menu Color" type="color" default="#FFFFFF"/> <Variable name="subsubmenu.background.color" description="Sub Sub Menu Color" type="color" default="#FAFAFA"/> </Group> <Group description="Top Menu Area" selector="body"> <Variable name="topmenu.background.color" description="Background Color" type="color" default="#003C30"/> <Variable name="topmenures.background.color" description="Responsive Menu Background" type="color" default="#00251E"/> <Variable name="topmenu.text.color" description="Text Color" type="color" default="#009678"/> </Group> <Group description="Other" selector="body"> <Variable name="footer.text.color" description="Footer Text Color" type="color" default="#CCCCCC"/> <Variable name="news.background.color" description="News Ticker Color" type="color" default="#F5F5F5"/> <Variable name="bottomborder.background.color" description="Content Border Color" type="color" default="#D8D8D8"/> </Group> [/code] If no, then this disadvantage will never effect your blog but if yes, then it will effect. Actually, this code help developers to code and create template fastly that’s why they use it but this code will stop working if you will remove those two link hrefs. But this disadvantage can be fixed using notepad or any other text editor. Just replace this value with is in ‘name’ like <Variable name=''footer.text.color'' with the value in 'default' like in default=''#D8D8D8''.

Why you don’t need to remove that Blogger Widget CSS?

Yes! You heard right. You don’t need to remove that Blogger Widget CSS because after some research, we found that those two link hrefs only take 2-3 seconds to load and fit on your blogger blog webpage. Fact: Blogger Default Widget CSS files size is just 7.8 KB! So why we remove that link hrefs if they are not decreasing much loading speed of our blog?

How to revert changes and re-add those two link hrefs?

If you have already followed our previous article that was about how to remove that two link hrefs, and now after reading these disadvantages, you want to re-add those link hrefs from your blog, then just follow these simple steps!
  • Go to Blogger Dashboard > Template > Edit HTML
  • Now search this code in your template:
&lt;style type=&quot;text/css&quot;&gt;
&lt;!-- /*<b:skin><![CDATA[*/]]></b:skin>
<style type='text/css'>
  • Now replace it with the code:
<b:skin><![CDATA[
  • Now find the ending ‘</style>’ tag and replace it with ‘]]></b:skin>’ and
  • Save your template!
If any other help is needed, please let us know through comments. :)