Find Us OIn Facebook

Monday, June 8, 2015

Add related posts widget with thumbnails to blogger

This post is about adding a stylish related posts widget with thumbnails to your blogger blogs. When a visitor visits your blog this widget will display list of related posts below the current post. It motivates your blog visitors to click on the these related posts and read them . Thus it helps in increasing page views of your blog and it also creates reader`s interest in your blog. The presence of thumbnails of the related posts in this widget is another advantage . These thumbnails decorate the overall look and feel of this widget and attracts more visitor clicks.
Related postsGetting ID for related posts widget

  • Log in to your blogger dashboard.
  • Navigate to Linkwithin Website.
  • At the homepage of the website there is  small box with various input fields.
  • Enter your email id in the given field of the box.
  • In the Blog link option enter your blog address.
  • Select Platform option as blogger.
  • Width option specifies the number of related posts to be displayed in the widget.
  • Select 4 or 5 stories according to your choice.
  • After filling all the fields click on the Get Widget option.
Create linkwithin related posts widget for blogger
  • At next screen click on Install widget option.
Install related posts widget
  • At next page your blogger page element screen will be opened.
  • Click on  Edit content option.
  • Code for your widget will be displayed.
  • Copy only Widget ID from the code. It will be like  linkwithin_site_id=”some number”
  • Copy the number only.
Get id for your widget.
  • In the following code replace the given ID number with your own copied ID
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:blog.pageType != "static_page"'>

<script>
var linkwithin_site_id = 1767409;
</script>
<script src="http://www.linkwithin.com/widget.js"></script>

</b:if></b:if>

  • After replacing the ID copy the complete above  code.

    Add related posts widget to blogger

    • Now go to your blogger dashboard.
    • Select your blog.
    • Select Template option and click Edit HTML.
    • In the template code find <data:post.body/>
    • Just below it paste the code copied in the previous step and save the template
    • Congratulations you have successfully added related posts widget with thumbnails to your blog. 
     
 Credit To : Dapinder

0 comments:

Post a Comment