How To Remove Quickedit Pencil & Wrench Icons From Blogger Blogs

The Pencil/ Wrench icons are added to Blogger blogs by Google to make blogging easier. By using this, you acn easily edit widgets and posts in just one click from your blog without going to blogger account (only if you are logged in with the blog's admin privilages). But for most Bloggers they feel discomfort with these Quickedit icons. The template also looks very bad. So, many users have asked me how to get rid of these things from their template. Actually it is very easy to remove those wrench icons. Just a simple CSS trick can do this. So read below.

Remove Quick Edit Icon

If you analyze your template code. You can see a code

<b:include name='quickedit'/>

Actually this is your problem. This code adds Quickedit icons to every place where this cod exists. To remove quickedit icons manually for selected position of your blog, just remove these code from that position. Blogger automatically ads Quickedit icons to every new widgets you adds. So if you want to remove all icons, removing all occurrences of the above code is not a good solution. So, you can try the easy CSS trick method instead.

Easy Method

So if you want all icons to be removed and it never wants to add again, Do as below.

1) Log In to blogger

2) Go to Design > Edit HTML
Don't forget to tick "Expand Widgets"

3) Backup your Template

Either you can click download full template from top or copy your entire template code and save it as something.xml file. This is extremely important when editing template. If you had any problems on editing template, it cannot be reverted. So, always keep a backup. In this case, I'm sure that there will be no errors as it is a simple code. Nut it is good make it a habbit to avoid accidental loss.


4) Adding code
Just scroll down in your template code and you can see many CSS tags. (for example #header) 
Just add the below code there. Don't add it inside a CSS code. It is better to add at the bottom. Add the following code just above <b:skin>

.quickedit{display:none;}

5) Now save the template and see the changes!

How to Add Meta Tags in Blogger & Websites to Increase Traffic Page Ranking.

Adding Meta Tag in Blogger Increasing Page Ranking hacking For Page Ranking Meta Tag From More Traffic

For Blogger

• Log into Blogger
• Then click on "Edit HTML" link.
• Save the Templae
• Add to Following Meta Tag and fill it with your Details and Save

<meta content='DESCRIPTION HERE' name='description'/>
<meta content='KEYWORDS HERE' name='keywords'/>
<meta content='AUTHOR NAME HERE' name='author'/>

• Save the Template.

For WebSites 

• Open the your HTML page and Add the Following Tags

<meta content='DESCRIPTION HERE' name='description'/>
<meta content='KEYWORDS HERE' name='keywords'/>
<meta content='AUTHOR NAME HERE' name='author'/>

•  Save the Page

How to Show Post Title Before Blog Title in Blogger Increase Traffic Hacking

Hacking Traffic in Blogger Showing Post Title Before Blog Title Increase Traffic in Blogger SEO Increase Trick. Blogger Hacking Show Post PAge Title Before Page title

• Log into Blogger
• Then click on "Edit HTML" link.
• Save the Templae
• Search for the following text in the template

<title><data:blog.pageTitle/></title>

• Replace it with the below given code

<b:if cond='data:blog.pageType == &quot;item&quot;'>
    <title><data:blog.pageName/> | <data:blog.title/></title>
<b:else/>
    <title><data:blog.pageTitle/></title>
</b:if>

• Code Hacking Done.... 

How to Add Read More to Blogger with Image Hacking [Read More + Thumbnail]

Read More Hacking Using Read More Code Script. How to Add Read More trick in Blogger. Adding Read More Option in Blogger. Blogger Readmore Hacking

Read More Hack for Blogger

• Open Blogger
• Go To "Templates" in Menu Tab
• Select "Edit HTML" in Sub Menu
• Check Expand Widget
• Search for "</head>" Tag
• Paste the below given code just before the Head closing tag

<script type='text/javascript'>var thumbnail_mode = "no-float" ;
summary_noimg = 430;
summary_img = 340;
img_thumb_height = 100;
img_thumb_width = 120;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}


function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) { 
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}


var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}




//]]>
</script>

• Now Search for  <data:post.body/>  and replace it with te below given code

<b:if cond='data:blog.pageType == &quot;static_page&quot;'><br/>
<data:post.body/>
<b:else/>

<b:if cond='data:blog.pageType != "item"'>

<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");
</script> <span class='rmlink' style='float:right;padding-top:20px;'><a expr:href='data:post.url'> read more "<data:post.title/>"</a></span>

</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
</b:if>

• Save the Template. Hacking done..

How to Remove Navbar in Blogger [Blogspot Hacking]

How to Remove Navbar in Blogger. Hide Navbar in Blogger. Simple Newbie Tutorial. Easily Remove Navbar from Blogger.


In Blogger The official template posses navbar. Navbar is shown at the top of the blogger. It is simple to Remove navbar.

• Open Blogger
• Go To "Templates" in Menu Tab
• Select "Edit HTML" in Sub Menu
• Search for "<head>" Tag
• Add the below given tag after the head tag

#navbar {
height: 0px;
visibility: hidden;
display: none;
}

• Thats it. Navbar Hacking Done.....