18 June 2009

Add quick edit pencil icon to the posts.


Now when you are login to the blogger and you open your blog you can edit any post as you can do it in Wordpress. You have to click on Blogger pencil quick edit icon button to edit the post.

But sometimes this button is not visible. So here is a simple way to add this button.

1. Login to Blogger >> Settings >> Basic. Now scroll down and look for It should be .

2. Next go to Layout >> Page Elements. Look for Blog Posts and click on Edit below it.

The field before Show Quick Editing should be checked as follows.

Now save this. It should work now.

If above basic procedure not working for you then you have edit your template to add Quick Edit Button/Pencil to your blog posts.

1. Sign in to Blogger >> Layout >> Edit HTML >> Download Full Template >> Expand widget templates.

2. Now look following section of code is present or not.

<b:includable id='postQuickEdit' var='post'>
<b:if cond='data:post.editUrl'>
<span expr:class='"item-control " + data:post.adminClass'>
<a expr:href='data:post.editUrl' expr:title='data:top.editPostMsg'>
<img alt='' class='icon-action' src='http://www.blogger.com/img/icon18_edit_allbkg.gif'/>

If above code is present then half work done.

3. If above code is not present then Copy above code and then PASTE it before following code

b:includable id='postQuickEdit' var='post'

4. Now look for

<div class='post-footer-line post-footer-line-1'>


<div class='post-footer-line post-footer-line-1'/>


<data:post.body />

and add following code below it

<b:include data='post' name='postQuickEdit'/>

Save your template. It's done.


If still you can not get that pencil icon you will need further modification.

Get it here - Show/Add Quick Edit Pencil on your blog.

Related Posts


August 22, 2009 at 1:42 AM

Hi there
1.tried 'show quick editing' in setting, nothing happens.
2.check html code, can't find code lines you mentioned
can you please help?

August 23, 2009 at 2:14 AM

Well it could be the error in the template you are using. Please check main post again.

October 3, 2009 at 12:01 AM

Check the main post for new update.

November 5, 2009 at 9:43 PM

Thank you! This worked like a charm. It was very simple and quick.

November 14, 2009 at 4:14 PM

Hi, Draman!
Thank you for making this post, it must be really useful for a lot of bloggers. However, I have a problem: I cannot get any of your solutions work...the first procedure just simply does not work, and I don't have such codes either in order to follow procedure 2. I also read your other article about getting the pencil icon but interestingly, I don't have the data:post.editUrl' code either...I'm using the following theme: http://www.infocreek.com/webdesign/notepad.html
I really hope that somehow you can help me...I really need that damn icon :)

November 14, 2009 at 7:17 PM

Hi Évajúlia, I've modified the template for you, now it shows the quick edit icon,,,, download it here - http://sites.google.com/site/yuiuiuyi/notepad-mod-by-free-blogger-help.xml?attredirects=0&d=1

November 15, 2009 at 4:00 AM

Wow, thank you a lot, drraman! It is working perfectly :) I'm so happy right now :)

November 15, 2009 at 6:38 AM

you are always welcome dear :)

April 7, 2010 at 8:53 AM

Thank you for posting this guide. My pencil editing buttons recently disappeared and unticking then reticking the 'quick editing' checkbox in the settings didn't work. I didn't know that there was also a quick editing check box within the page elements. Unticking and reticking that has brought my little pencil icons back and now I know how to quickly reset them if they ever vanish again thanks to your help.

April 8, 2010 at 12:02 AM

@ Buckles and Buffs
I thank you for your view.

June 30, 2011 at 7:42 AM

It worked. Thanks.

Post a Comment


Twitter Delicious Facebook Digg Stumbleupon Favorites More