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
Popular
Editor’s Pick
-
August 21, 2008 Having Custom CSS in Pagination hack
Page Navigation hack for Blogger replaces the default older posts and Newer Posts with Numbered page link just like WordPress. If you want to implement this hack in your blogger Blog then please visit this posts. You can add this hack in two methods , 1. By Editing Blogger template 2. Adding As a Widget…
-
April 26, 2023 The Complete Checklist of React Best Practices for Front-end Developers
React is a popular JavaScript library used for building user interfaces. It was developed by Facebook and is now maintained by both Facebook and a community of developers. React allows developers to build reusable UI components that can be easily composed to create complex user interfaces. Using best practices in React development is essential for…
-
February 19, 2010 200+ Ultimate Collection of Photoshop Plugins
Photoshop is a powerful image editing software which is very useful for web designers and photographers to create desired effects in the images. But sometimes it’s difficult to perform certain tasks manually in photoshop. Once there was a belief that only designers who have mastered photoshop can create special effects on photographs or images. But…
-
April 22, 2023 Mastering Webpack Module Federation: A Comprehensive Guide for Modern Application Development
Introduction Welcome to this comprehensive guide on mastering Webpack Module Federation for modern application development. In this guide, we’ll dive into the world of Webpack and explore its Module Federation feature in-depth. Definition of Webpack Module Federation Webpack Module Federation is a feature of the Webpack module bundler that allows developers to share code and…
-
December 6, 2012 12 Best Mid Range DSLR cameras
I am almost got fed-up to hear “What’s the best DSLR”I receive several emails from our readers asking which one they should opt. Now the true fact is, almost all DSLR cameras is good enough to take clean pictures .They all provide you with good specs, sharp images but it’s you who will decide whether…
