RELATED POST WIDGET FOR BLOGGER USING OUTBRAIN

In Blogger there are no official widget for this purpose so you will have to rely on third party services or a simple JavaScript hack. In this post we will be discussing 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 them look better.

Tutorial using OutBrain is as follows.

Lets get started:

1. Go to Outbrain.com and click the Register button on the upper right.

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

3. Now you will be asked to confirm your email.

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

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

Note: Make sure to set the Install widget option to Yes

6. After clicking the Continue button you will be presented with a option to Add the widget to your blog. Select your blog and click the Add Widget button

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

Pro Tip: 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.

 

7. 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 )

Enhancements
The widget you added gives such a formal and dull look which will in no way interest readers to click on these links. Lets Stylifyit a bit using some CSS !

Rounded Edges
The square shapes are a bit too standard , lets round things up

#ob_strip_container_rel_0_stripBox .strip-rec-link-img , #ob_strip_container_rel_0_stripBox .strip-img {border-radius: 100px !important;}

Removing attribution 
Under each widget a link is added to the Outbrain service. To remove it add

.what_is_container{display:none !important;}

Changing Title Font

The “You might Like” font is a standard font , you can easily change it to another font by

.strip-like {

font-family: FONT-OF-YOUR-CHOICE ;font-weight: normal !important;

} 

Adding background
As you might observe that I have added a background to this blogs related post widget , you can do the same with the following

#outbrain_widget_0 {background: url(‘https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiiY7qCqDseWyqT8Kbw92w7Jm1tSVRrVHas7rxqlURjOMoJ3QoGq_dn8aSA3wUbv2U19MBeAsXF90pemOYg9euP2XPrQHn0akhe0HJFO2kPlnwNqoGgUIo1b-ApcwhCP4pHOnBmikHB7xx/s1600/pattern.png’);

} 

Note: You might have to adjust the background a bit using padding and margin CSS property to make sure that it aligns well .

80+ ADVERTISING NETWORKS TO MAKE EASY MONEY FROM YOUR BLOG

We know Google Adsense is best one. But what if in case you get banded from their network? Definitely, you feel sad. So, you must have some Google Adsense alternatives and you can easily replace adsense with other advertising network in case they ban you.

Here is some recommended advertising networks which rivaled with Adsense:
Popular Advertising Networks

1. Chitika (CPC)
2. Burst Media : Large network. (CPM)
3. Commission Junction : Large network. (CPA)
4. Kanoodle : Large network. (CPC); 50% payout.
5. LinkShare : Large network. (CPA)
6. ValueClick : Large network. (CPM)
7. Yahoo Publisher Network : Closed Beta (CPC)
8. MSN adCenter : Closed Beta (CPC)
9. AdBrite

Secondary Advertising Networks

1. Accelerator Media :
2. AdAgency 1 : (CPM)
3. AdDynamix : (CPM)
4. AdEngage :
5. Adgenta :
6. Adhearus :
7. AdKnowledge : (CPC)
8. AdPepper : (CPM)
9. ADServing Network : (CPM)
10. Adsmart : (CPM)
11. Adtegrity : (CPM)
12. AdZuba : (CPM)
13. AffiliateFuture : (CPA)
14. AffiliateSensor :
15. AllFeeds : (CPC)
16. AVNads :
17. AzoogleAds : (CPA)
18. Banner Boxes : (CPC)
19. BannerConnect : (CPM)
20. BardzoMedia : (CPM)
21. BidClix : (CPC)
22. BidVertiser : (CPC)
23. BlinkAds : (CPA)
24. BlueFN : (CPA)
25. BlueLithium : (CPM)
26. Casale Media : (CPM)
27. ClickAdsDirect :
28. ClickBooth : (CPA)
29. ClickShare :
30. Clicksor : (CPC)
31. ClickXchange : (CPA)
32. ContexWeb : (CPC)
33. CoverClicks :
34. CPX Interactive/Budsinc : (CPM)
35. DirectNetworks : (CPA)
36. Enhance Interactive :
37. Esource Media : (CPM)
38. Etype-Europe : (CPM)
39. EtypeUSA :
40. ExpoActive :
41. FastClick=ValueClick : (CPM)
42. FluxAds : (CPA)
43. HurricaneDigitalMedia : (CPM)
44. Hyperbidder : (CPC)
45. IncentaClick : (CPA)
46. Industry Brains :
47. Interclick :
48. JoeTec : (CPM)
49. Kontera : (CPC)
50. Mamma Media Solutions : (CPC)
51. MaxBounty : (CPA)
52. Mirago :
53. MIVA AdRevenue Xpress :
54. Nixxie :
55. Oridian : (CPA)
56. Oxado : (CPC)
57. Paypopup : (CPM)
58. PeakClick :
59. PogAds : (CPC)
60. Popup Traffic : (CPM)
61. Quigo : (CPC)
62. RealCastMedia : (CPM)
63. RealTech Network : (CPM)
64. Revenue Pilot : (CPC)
65. RightMedia : (CPM)
66. Searchfeed : (CPC)
67. ShareAShare : (CPA)
68. TargetPoint : (CPC) payout.
69. TextLinkAds : (CPC)
70. TMP Express : (CPA)
71. Tremor Network :
72. Tribal Fusion : (CPM)
73. Veoda : (CPC)
74. Vibrant Media IntelliTXT : (CPM)

CPA stands for Cost Per Acquisition, CPC stands for Cost Per Click and CPM stands for Cost Per thousand Impression, In Latin Mille known as Thousand. Definitely, all of these networks are alive right now. I hope this huge list helps you to monetize your blog.

TOP COMMENTOR WIDGET

Who is the most frequent comments on your blog.? If the question is, this widget is the answer. Widgets top commentor is among the most ‘complete’ at present for anyone using Blogger platform.

This is because, with this widget you can determine most Who would often comment with some additional features that you can specify whether a comment to your blog since the entire set, or at specific intervals such as monthly or other long-time addition, with this widget, pengomen list that you do not want to enter in the list shall be excluded.

Tutorial to install the widget top commentor is as follows.

1. From dashboard> design> add a gadget> HTML / javascript

2. Paste the following code into the HTML section / javascript

<script type=”text/javascript”>
function getYpipe(feed) {
document.write(‘<ol>’);
var i;
for (i = 0; i < feed.count ; i++)
{
var href = “‘” + feed.value.items[i].link + “‘”;
if(feed.value.items[i].link == “”)
var item =”<li>” + feed.value.items[i].title + “</li>”;
else
var item = “<li>” + “<a href=”+ href + ‘” target=”_blank”>’ + feed.value.items[i].title + “</a> </li>”;
document.write(item);
}
document.write(‘</ol>’);
}
</script>
<script src=”http://pipes.yahoo.com/pipes/pipe.run?
YourBlogUrl=http://YOUR URL.blogspot.com
&ExcludedNick1=NAME1
&ExcludedNick2=NAME2
&ExcludedNick3=NAME3
&ShowHowMany=10
&ExcludeCommentsBefore=08-01-2010 (i.e. 01-01-2010)
&IncludeCommentsBefore=08-31-2010 (i.e. 01-31-2010)
&_callback=getYpipe
&_id=932ec72eca30a5b8a83365f4eb4349cd
&_render=json”
type=”text/javascript”></script>
<small><a href=”http://tutorialuntukblog.blogspot.com/2010/08/top-commentor-widget.html”>Get this widget here</a></small>

i.Change YOUR URL with your blog url

ii.NAME 1, NAME 2 NAME 3 – put the name you do not want. Anonymous automatic exception, to know the names that you might not want, save the past, when displayed Blogged new, you know. If you do not want to skip this section.

HOW MANY iii.SHOW – replaced with the number you want displayed

iv.Comment Before: The example given is a coment for only 8 months. If you want the whole list of pengomen, leave this section blank

3. When finished, save and see the results.

5 BEST TWITTER TOOLS FOR BLOGGERS

Twitter is one of the best ways to promote your blog. The Twitter has great use in the blogging. The success of blog only depends on the visitors and you get it with the Twitter easily. Not only the visitors, but the Twitter also helps in representing your blog as a brand.

Twitter can work as a great source of traffic for your blog, is you use it in a proper way and use the necessary useful tools with it. Due to the large rush of the Twitter related tools, the selection of best tools to get best results has become a very tough task. That’s why I decided to create this post, in which I am going to post about the best Twitter tools for the best results in the blogging. So let’s have a look on it.

1. Tweet DeckTweet deck leads the queue of the best Twitter tools with its best and unique features. It is the best desktop client of Twitter, which allows you to use the Twitter with the full features from your desktop directly. The tweet deck allows you to organize the tweets, post tweets on your Twitter account, Check Tweets and messages from your followers and Retweet others tweets in a very simple and easy way. The simple user interface of this software makes it very useful for all the users. If you are running the multiple computers, then you can also use their Browser based online service as well.

2. Bit.LyWhile using the Twitter for the blogging purposes, one thing is sure that you are going to posts links of your blog posts daily. All this stuff makes your Twitter account to look dull and spam. You may also get a loss in your followers list. But the Bit.Ly is the tool which can help you regarding this. Bit.Ly is a URL shortening service, which creates short links for any URL and change it into the Bit.Ly extension. By using this service for your Twitter account, you will be using Twitter for the blog promotion purposes by posting links and on the same time your Twitter does not look like a spam.

3. Buffer AppBuffer is the best way to organize tweets. You can set the schedule for the tweets and the tweets will automatically get published to your Twitter account, according to your planned schedule. This helps your Twitter account to remain active and all this go in such a way that you are updating it yourself.

4. Dlvr.it

Dlvr.it is she no.1 Twitter tool to synchronize the RSS Feed with your Twitter account. By using this tool, you need not to post the new blog post’s links on your Twitter account yourself. The Dlvr.it will get it automatically from your RSS feed account and then will post it on your Twitter account, without even a single step need to be performed by you. You can sync multiple feeds and also you get detailed stats about the number of click on each links posted on Twitter.

Its provides statistics for all the links but its main product is the Engagement Bar. Other than links you can add Follow and Like buttons as a Recent post ticker featuring post from your blog. It has a paid version but all the above mentioned features are free to use !!

LET’S CHANGE HIGHLIGHT COLOUR

When someone highlights text in a blog, a color that will come out is blue, the default.
But there is also a tutorial that allows you to change the color of text selection, such as the example below.

Default.

After the change text color selection

Tutorial to change the text color selection is as follows.
1. From dashboard> design> edit HTML

2. By using the Find function, search for the code body {

3. After the meet code body {, pastekan above code under body {

::-moz-selection {
background: #CC3399;
color: #ffffff;
}

Example :

 

Note: You can change the text highlight color to replace the color code highlighted above.

4. Save and see the result .

Finding the color code.?
See below.