Add “Link to this post” codes below blogger posts

link to this post box One of the easiest ways to encourage readers to link back to your blog post is by providing “Link to this post” codes at the end of each post. If the post is useful or informative enough, readers would want to share it on their blogs, discussion forums etc. And since most people still use copy-paste method when sharing, providing the codes for the post’s permalink would certainly help.

Let’s learn how to do it. Once you’re done, the codes will automatically appear below each post on post pages. Checkout the demo at the end of this post.

  1. Go to Template > Edit HTML Dashboard > Design > Edit HTML.
  2. Back up your template.
  3. Tick the  Expand Widget Templates check box on top right of the HTML window.
  4. Paste the following code right under <data:post.body/> :  
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <p>Do you like this post? Please link back to this article by copying one of the codes below.</p>
    URL:
    <textarea id="url" onclick="this.focus();this.select()" readonly="readonly" rows="2" style="background:#eee; height: 2.6em; width: 100%;" title="Click to highlight"><data:post.url/></textarea>
    HTML link code:
    <textarea id="HTML-code" onclick="this.focus();this.select()" readonly="readonly" rows="2" style="background:#eee; height: 2.6em; width: 100%;" title="Click to highlight">&lt;a href=&quot;<data:post.url/>&quot;&gt;<data:post.title/>&lt;/a&gt;</textarea>
    BB (forum) link code:
    <textarea id="BB-code" onclick="this.focus();this.select()" readonly="readonly" rows="2" style="background:#eee; height: 2.6em; width: 100%;" title="Click to highlight">[url=<data:post.url/>]<data:post.title/>[/url]</textarea>
    </b:if>
  5. Preview and save.

Do you like this post? Please link back to this article by copying one of the codes below.

URL:
HTML link code:
BB (forum) link code:

Enjoy!

27 comments to "Add “Link to this post” codes below blogger posts"

Jitendra December 30, 2011 at 1:57 AM    

wow, it is really nice tricks to get more share links

MUXLIMO December 30, 2011 at 8:39 AM    

I love this post. Thanks so much, Brother.. :)

conference merchandise December 30, 2011 at 8:04 PM    

I think that are the easiest way to link back to your blog.You are also providing a demo with code.Great!

Mary December 30, 2011 at 8:49 PM    

Nice tip. I've made a couple of changes implementing this on my site:

- made the width 98% instead of 100. (Otherwise the right hand border was cut off, not quite sure why)
- put some space between the code blocks
- put the header into a bolder style

Anonymous,  December 31, 2011 at 4:22 AM    

hi, I'm using your tinted template design, but the code [data:post.body/> : ] isn't there, is there another place where the code can be added and also I want to change the footer color but I'm not sure how to, TIA. Your blog is fantastic thanks for sharing it.

Anonymous,  December 31, 2011 at 5:36 AM    

okay, your right as usual, I found my error, the codes work perfectly. thanks

accountancystudents January 3, 2012 at 12:30 AM    

Awesome trick...

corporate gifts January 3, 2012 at 1:15 PM    

thanks for this code snippets. At first I got an error because I messed up with some missing quotes and spaces. But after some tweaks it just works fine.

Digitalkameras February 7, 2012 at 12:06 AM    

Just applied in my blogspot.
It works.. Thanks..

Telugu GalaGala February 18, 2012 at 12:49 PM    

i would like to make the images share along with url... i have many greeting cards of mine and need to make online to share the TEXTAREA but how to make the imagelink automatically from the post to the code.

Greenlava February 19, 2012 at 1:09 PM    

@Telugu GalaGala
Image link has to be added manually, there's no getting around that :(

mypress-release.biz February 20, 2012 at 9:38 PM    

Thank you!
Very cool!
I used it on my site!

Ying Zhang February 22, 2012 at 11:54 AM    

Do you know how to add the plugins or code Like "Auto SEO Linker" (in Wordpress)? thank you?

Greenlava February 25, 2012 at 2:59 PM    

@Ying Zhang
There is no such plugin on Blogger. But if you use Windows Live Writer as your blog editor, it has some kind of auto-linking feature built-in.

download free software March 20, 2012 at 2:02 AM    

Thats really nice idea thanks for sharing

Shazy April 28, 2012 at 9:51 PM    

Its Really Work Nice Tips Thank You

George Joe May 1, 2012 at 6:53 PM    

thnx admin its very useful info you wrote here...

Indra June 6, 2012 at 11:09 AM    

nice info

istanbul nakliyat July 13, 2012 at 11:27 PM    

thanks you

Motor News July 21, 2012 at 4:43 AM    

nice info

dicasblogger.org July 29, 2012 at 4:46 AM    

Thats really nice idea thanks for sharing yours Knowledge

Blogging Sentral September 8, 2012 at 4:11 PM    

Nice widget. I loved it coz it increases backlinks.

nama ku ina November 7, 2012 at 4:53 PM    

thank you for the information. just know the purpose of link to this post :)

MUXLIMO December 25, 2012 at 5:30 PM    

Bro.. is there any way to create mobile url to the textarea? i want to create the mobile one. Thanks in advance.

tablet bilgisayar February 12, 2013 at 6:17 AM    

Thank you for informations

Keyguru.blogspot.in April 13, 2013 at 10:08 AM    

thank u so much.............

MonkeyRaptor June 19, 2013 at 9:56 PM    

Thank you so very much. The widget is awesome!

Post a Comment

We love to hear from you! Leave us a comment.

To ensure proper display, HTML/XML/Javascript need to be escaped first using this escape tool.

Click to go to top Click to comment