Most of the bloggers use Ad networks for monetizing their blogs. Mostly they look for best ad locations to increase CTR in order to improve their earnings. Mostly you will find ads in sidebars or in header sections. But based on my experience of using ad networks, often i get good CTR by inserting ads within content. So here is a simple wordpress shortcode trick to insert adsense or any ad network ads within content.
Place the following code to your functions.php file.
function adscode() {
return '
<div id="ads"><script type="text/javascript">// <![CDATA[
google_ad_client = "ca-pub-XXXXXXXXXXXXXXXX"; google_ad_slot = "YYYYYYYYYYY"; google_ad_width = 336; google_ad_height = 280;
// ]]></script>
<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js">// <![CDATA[
// ]]></script></div>';
}
add_shortcode('ad', 'adscode');
To display the ad, you must use the following shortcode :
[ad]
Let’s break the code :
In the above code, you can see that i have included a DIV element with id=”ads”. It can be useful to add beautiful effects to the ad.
check the sample css code, you can add more css properties to make the ad fit your content perfectly.
#ads {
background: #EEE;
padding: 14px 25%;
border: 1px solid #CCC;
}
Please replace this ad code with yours. You can place code of any Ad network such as Adsense or Buysellads or Adbrite or Amazon affiliate etc.
<script type="text/javascript">// <![CDATA[ google_ad_client = "ca-pub-XXXXXXXXXXXXXXXX"; google_ad_slot = "YYYYYYYYYYY"; google_ad_width = 336; google_ad_height = 280; // ]]></script> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js">// <![CDATA[ // ]]></script>
Style Code
Check out some ad code examples:
#ads {
background: #EEE;
padding: 14px 25%;
border: 1px solid #CCC;
}
#ads {
float:left;
background: #eee;
border: 1px solid #ccc;
padding:10px;
margin: 10px 10px 10px 0px;
}
This following CSS will make the Ad to float on right side and content on left. Mostly i use to see blogs having ads floating on left side just below title. So when search engines crawl, The first element they crawl is ad code. mostly i prefer to have ads on right side. This makes content to appear first on content page.
#ads {
float:right;
background: #eee;
border: 1px solid #ccc;
padding:10px;
margin: 10px;
}
Advanced options
If you have too many ad networks like adsense and buysellads or anything else and want to show multiple ads, even then you can make use of the above trick with some simple modifications.
function bsacode() {
return '
<div id="bsa"><script type="text/javascript">// <![CDATA[
google_ad_client = "ca-pub-XXXXXXXXXXXXXXXX"; google_ad_slot = "YYYYYYYYYYY"; google_ad_width = 336; google_ad_height = 280;
// ]]></script>
<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js">// <![CDATA[
// ]]></script></div>';
}
add_shortcode('bsa', 'bsacode');
In the above code, you can see that i have changed the function name from adscode to bsacode and similarly ads to bsa in add_shortcode part. Similarly use custom CSS code as well.
Now when you want to show the second ad, you must call it using the following shortcode.
[bsa]
#bsa {
background: #EEE;
padding: 14px 25%;
border: 1px solid #CCC;
}
Feedbacks
Hope the above tutorial will be helpful for you. You can replace the Ad code with any custom banner codes or images which you want to show using shortcodes. If you want any custom feature or want modifications in the above trick let me know.
About the author /
admin
