14 September 2012

Outbrain Related Post Widget For Blogger


While going through several blogs in the web we do came through one popular widget named as 'related post widget'.This Related Posts widget always used in several blog to decrase their blog bounce rate.It do engage your blog visitors more and incredibly increase your traffic as well.This widget generally shown at the end of a article to present interested readers with a choice of reading other similar articles to the one they just read. In Blogger there are no such official widget available.So, for this purpose you will have to rely on third party services or a simple JavaScript hack. In this post we will going to discuss about  a step-by-step guide on how to integrate the OutBrain Related posts widget into your blog. Also with a bit of CSS we will make their looks far better.

 Must Read : Liyefyre Comment System For Blogger

Get Started

  • Go to Outbrain.com and click the Register button on the top right.

                             outbrain homepage

  •  On the Registration page ,add all the relevant details and click the Register button 

  •  Now you will be asked to confirm your email 

                               outbrain confirmation page

  •  After confirming you will be redirected to the Dashboard , here on the left side, select the Manage Blog option and after that click the Add a Blog button 

                             outbrain add a blog

  • Now you will be asked information about your blog ,its platform (In this case set it to Blogger ) , its URL ,language ,etc.



Make sure to set the Install widget option to Yes and click on Get Widget. Then you will see these widgets.Its up to you that what you choose, Thumbnail or Text widget. 


Preview of Text Related Posts Widget. 

Fill out the form and click on Install. 


After clicking on Install button it will show a another web page asking to 

Add Widget to your blog. Make sure you choose only that blog which link you 
typed in the form. 

After adding the widget in your blog and place it below "Blog Posts" (This is not compulsory but if u do that so it will be good and if u have any problem by placing the widget anywhere so do it for sure then check ) and click on save. Wait for some time and after some time it will start showing 


By default the widget is added to all the pages in your blog including your HomePage. In case you want the widget to only appear in the Post pages then add the following code in the Edit Template option as shown in the image below

<b:includable id='main'> <b:if cond='data:blog.pageType == "item"'> <data:content /> </b:if> </b:includable>

The widget is installed but you will have to wait around 3-4 hours for OutBrain to index your posts and then only will they start displaying in below your a blog posts. Until then you can customize your widget by going to the Outbrain Dashboard > Manage Blog > Settings ( of the blog )

 Must Read : Linkwithin Related Post Thumbnail Widget For Blogger

Facing any problems while installing  this widget or have some another trick to share with? Feel free to ask/share them using the comment box below

Articles You May Like

7 comments: Leave Your Comments

  1. Thanks i believe that related post widget plays an important role in engaging the user and also to increase traffic.even those posts that did not get good amount of traffic gets clicked because of the same labels and hence hardwork of admins and writer gets rewarded.so i will say it is like a traffic booster.Related post widget for blogger

  2. Thnx for this nyc post....I was looking for This!

  3. thanks alot for this great share, i truly love this

  4. Oh Sorry for the earlier comment, It just fixed it.... Thanks for the superb share... I was looking for it for a long time and was little stressed but you really did a great job for me. Keep it up boys