Sunday 8 July 2012

5 Best Advertising Networks For Bloggers


Every blogger wants to earn some revenue from their blogs. You can earn some money from your blogs by becoming an ad publisher, first we need to find a perfect publisher website for you. Below are top 5 advertising/publisher networks:

Google Adsense: Google Adsense is best publishing network, which is recommended by every blogger. Many bloggers are earning millions of dollars with Adsense. Adsense pays you more than any other publisher website. You receive 68% of revenue with Adsense. Getting accepted for Adsense is like a nightmare for a new blogger but it's the best advertising website. If your Adsense account is banned then this article may help you.

Infolinks: Infolinks provides intext ads and they also provide related tags, tag clouds which can gives you maximum advantage from Infolinks, Infolinks share 70% of revenue with their publishers,you will get approved easily but first read their Requirements then apply.

BuySellAds: BuySellAds is different from others, in buy sell ads you can sell advertising space on your website and you can set pricing as per your choice, its different from Adsense and you can use this with Adsense, but you can use buy sell ads if you have really good traffic and your account will approve if you have good traffic, if you are new then think about other options.

Contextweb: Contextweb is a CPM ad network with a good reputation that serves as a great source of revenue for low to high traffic websites and does not require clicks to earn revenue.

Bidvertiser: Bidvertiser is also a good alternative to Adsense. BidVertiser online advertising network offers Bid Per Click ad sales model, that gives publishers the ability to sell their ads space to highest bidding.

Label Widget Style For Blogger







Here we go :
  • First add a Label widget on your blog.
  • Change setting to cloud style.
  • Add this widget on your blog :


Saturday 7 July 2012

Advance CSS Tabs



It's cool and also you can do lots of crappy this with it :

CSS :


<style >
#site { background: #FFF; }
#tabs {
border: 1px solid #DEDEDE;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
min-height: 200px;
position: relative;
overflow: hidden;
margin: 25px;
}
.tabs-content {
padding: 25px;
height: 120px;
overflow: hidden;
position: absolute;
bottom: 0;
left: 0;
display: none;
}
.tabs {
overflow: hidden;
background: #e1e1e1;
background: -moz-linear-gradient(center top , #f2f2f2, #e1e1e1);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f2f2), color-stop(100%,#e1e1e1));
-moz-border-radius: 4px 4px 0 0;
-webkit-border-radius: 4px 4px 0 0;
border-radius: 4px 4px 0 0;
-webkit-box-shadow: 0 1px 0 #FFF inset;
-moz-box-shadow: 0 1px 0 #FFF inset;
box-shadow: 0 1px 0 #FFF inset;
}
.tabs a {
display: block;
float: left;
font: 15px/35px Arial, Helvetica, Sans-serif;
padding: 0 20px 0 40px;
color: #999;
text-shadow: 0 1px 0 #FFF;
border-left: solid 1px rgba(0,0,0,0.05);
border-right: solid 1px rgba(255,255,255,0.7);
position: relative;
overflow: hidden;
}
.tabs a:first-child {
border-left-width: 0;
}
.tabs a:last-child {
border-right-width: 0;
}
.tabs a:after {
content: '✔';
position: absolute;
top: 0;
left: 10px;
line-height: 21px;
font-size: 10px;
width: 21px;
text-align: center;
margin: 7px 10px 5px 0;
background: #000;
font-size: 12px;
-moz-border-radius: 21px;
-webkit-border-radius: 21px;
border-radius: 21px;
background: #bdbdbd;
background: -moz-linear-gradient(center top , #d4d4d4, #bdbdbd);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d4d4d4), color-stop(100%,#bdbdbd));
-webkit-box-shadow: 0 1px 0 0 #FFF, 0 1px 0 0 rgba(0,0,0,0.25) inset;
-moz-box-shadow: 0 1px 0 0 #FFF, 0 1px 0 0 rgba(0,0,0,0.25) inset;
box-shadow: 0 1px 0 0 #FFF, 0 1px 0 0 rgba(0,0,0,0.25) inset;
text-shadow: 0 1px 0 #999;
color: #ffffff;
}
#tab1:after { content: '1'; }
#tab2:after { content: '2'; }
#tab3:after { content: '3'; }
#tab3 { border-right-width: 0; }
.tabs a:target {
background: #FFF;
border-left-color: #CCC;
}
.tabs a:target:after {
background: #038bd5;
background: -moz-linear-gradient(center top , #2dc3fc, #038bd5);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2dc3fc), color-stop(100%,#038bd5));
text-shadow: 0 1px 0 #096c9e;
-webkit-box-shadow: 0 1px 0 0 rgba(255,255,255,0.45), 0 1px 0 0 rgba(0, 0, 0, 0.25) inset, 0 0 5px 0 rgba(0,148,255,0.85);
-moz-box-shadow: 0 1px 0 0 rgba(255,255,255,0.45), 0 1px 0 0 rgba(0, 0, 0, 0.25) inset, 0 0 5px 0 rgba(0,148,255,0.85);
box-shadow: 0 1px 0 0 rgba(255,255,255,0.45), 0 1px 0 0 rgba(0, 0, 0, 0.25) inset, 0 0 5px 0 rgba(0,148,255,0.85)
}
.tabs a:target + section.tabs-content {
display: block;
}
</style>


HTML :


<div id="tabs">
<nav class="tabs">
<a id="tab1" href="#tab1">Widget Craft</a>
<section class="tabs-content">
You can learn creating this CSS tabs at Widcraft.blogspot.com.
</section>
<a id="tab2" href="#tab2">Author</a>
<section class="tabs-content">
This blog is created by Hardeep Asrani from India he is a commerce student but doing this is his passion.....i mean my passion :p .
</section>
<a id="tab3" href="#tab3">WWE</a>
<section class="tabs-content">
I'am a huge WWE Fan and owner of India's number one WWE News Website.
</section>
</div>

That's It

Friday 6 July 2012

Animated Label Cloud Widget For Blogger

This is the most amazing way to show your blog's labels. This widget is originally for wordpress but now you can add this on your blogger. Generate this widget with the help of our Widget Generator :

Thursday 5 July 2012

Creating jQuery Show/Hide Panel


So today i'am going to teach you how to create jQuery Show/Hide Panel.....so let me start :

Java Script :


<script type="text/javascript" src="http://widcraft.googlecode.com/svn/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".flip").click(function(){
    $(".panel").slideToggle("slow");
  });
});
</script>


CSS :


<style>
div.panel,p.flip
{
margin:0px;
padding:5px;
width:600px;
text-align:center;
background:#e5eecc;
border:solid 1px #c3c3c3;
}
div.panel
{
width:600px;
height:100px;
display:none;
}
</style>


HTML :


<div class="panel">
<p>Show/Hide Panel Is Cool :p</p>
<p>Learn creating a jQuery show/hide panel at http://widcraft.blogspot.com .</p>
</div>
<p class="flip">Show/Hide Panel</p>

Ok so now let me explain you CSS with this pic :

Ok so finally here is the Full Script :

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://widcraft.googlecode.com/svn/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".flip").click(function(){
    $(".panel").slideToggle("slow");
  });
});
</script>
<style type="text/css">
div.panel,p.flip
{
margin:0px;
padding:5px;
width:600px;
text-align:center;
background:#e5eecc;
border:solid 1px #c3c3c3;
}
div.panel
{
width:600px;
height:100px;
display:none;
}
</style>
</head>
<body>
<div class="panel">
<p>Show/Hide Panel Is Cool :p</p>
<p>Learn creating a jQuery show/hide panel at http://widcraft.blogspot.com .</p>
</div>
<p class="flip">Show/Hide Panel</p>
</body>
</html>

Wednesday 4 July 2012

How To Get Free Google Adwords Coupon


The best way to try adwords advertising program is to use a voucher, but remember adwords coupons can be used only once. I will give you a list of website where you can request a free adwords coupon from google. Once you did, wait from 3 to 7 days, and check your email for voucher.

Do not request a coupon second time, because google will not send you another voucher, don’t try to fill in another domain, or your name, google tracks you other ways.

Please read Terms and Conditions apply for online advertising promotional credits

The list of website where you can request a free promotional coupon (choose only one link to request the coupon, do not repeat requests on other links, and do it once):

$75 Adwords coupon – https://services.google.com/fb/forms/adwordscoupon/

AU$75 Adwords coupon – https://www.google.com/appserve/fb/forms/auonline/

$100 Adwords coupon – http://www.google.com/ads/offers/hiregoogleadwords.html

$100 Adwords coupon – http://www.google.com/ads/offers/adwordsoffer.html

£30 Adwords coupon – http://www.google.co.uk/intl/en/ads/offers/specialoffer.html

£75 Adwords coupon – http://www.google.co.uk/intl/en/ads/offers/get75.html

Tuesday 3 July 2012

Different Background In Each Post Of Blogger



So in this tutorial i'am gonna show you how to use different background in each post of your blogger......ok so here we go.....

  • Go To Your Blog > Settings > Posts And Comments 
  • Paste this code at the top of the box :
<div style="background:url(Image_URL) no-repeat;">
  • And paste this code at the bottom of the box :
</div>
  • Click on Save Settings and then Create a new post
  • The Post Editor will open with the code already in it.
  • Replace Image_URL with your background image url
  • Type in your post before the </div> tag at the bottom, give it a Title and Publish.

Monday 2 July 2012

Disable Right Mouse Click On Blogger


If you wanna disable right mouse click on your blogger blog then just add the below widget on your blog :


Comment/Request/Question

Display/Hide Widget On Specific Pages In Blogger


When you add a widget (or a gadget as Blogger would call it) to your blog, by default the widget would appear on all pages –homepage, index, archive, post and static pages. But what if you want a certain widget to appear only on a certain page or pages, can it be done? In other words can you select on which page/pages the widget would or would not appear?  The answer is yes you can -by using Blogger conditional tags.


Note: This trick doesn't work with Labels, Archive and Followers gadgets.
Let us proceed,
  • Locate the widget code in HTML
  1. Go to Dashboard > Design > Edit HTML.
  2. Check the  Expand Widget Templates check box on top right of the HTML window.
  3. Find your widget in the HTML by using Ctrl+F and entering the widget Id in the search box.
Your widget code might look like this. It may be a little different, but it’s okay. Just pay attention to  the highlighted lines. Widget content is contained in between those two lines -in "includable" section.

<b:widget id='WidgetID' locked='false' title='Widget title' type='HTML'>
<b:includable id='main'>
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
  • Choose the appropriate conditional tag
I listed some conditional tags in another post -Targeting specific pages with conditional tag. Copy your desired tag from there and apply it here.

  • Apply the tag

Paste the tag (from step 3) immediately after <b:includable id='main'> and the code line 11 to 15 immediately before </b:includable>, as shown below.


<b:widget id='WidgetID' locked='false' title='Widget title' type='HTML'>
<b:includable id='main'>
PUT CONDITIONAL TAG HERE
<b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>
<b:include name='quickedit'/>
<b:else/>
<style type='text/css'>
#WidgetID {display:none;}/*to hide empty widget box*/
</style>
</b:if>
</b:includable>
</b:widget>  

Replace WidgetID in line 13 with the widget ID from code line 1.
The code will check whether the condition is true or false:
  • If the result is true, it executes (and display) the widget’s content.
  • If the result is false, it skips the content and hide the widget. 
  • You need to hide the widget because in most templates the content-less widget will still appear -as an empty box.
  • Save And Done
Click Save Template button and view your blog.

That’s all to it. Enjoy!

List Of Conditional Tags


List of conditional tags :
Below is a list of conditional tags that target specific pages. I only list the opening tags here. Just make sure you include the closing </b:if> tag when applying a conditional in your template.

1.Index (list) pages 

Index pages include homepage, labels page and yearly archive page.
<b:if cond='data:blog.pageType == "index"'>
2.Post (item) pages 
<b:if cond='data:blog.pageType == "item"'>
3.Static pages 
<b:if cond='data:blog.pageType == "static_page"'>
4. Archive pages 
<b:if cond='data:blog.pageType == "archive"'>
5. Homepage 
<b:if cond='data:blog.url == data:blog.homepageUrl'>
6.Specific page/URL 
<b:if cond='data:blog.url == "PUT_URL_HERE"'>
7. Post and static pages
<b:if cond='data:blog.url == data:post.url'>
8. Label-search pages 
<b:if cond='data:blog.searchLabel'>
9. First post 

This is not a page, but a conditional for the first post. Used for targeting the first post on multi-post pages.
<b:if cond='data:post.isFirstPost'>

Popular Posts

 
Powered by Blogger.