Shortcode, Theme Functions, Wordpress

Insert Adsense Ads anywhere within content in WordPress

0 86

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.

1

Know the Code


 
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:

1

Centered AD


 

 

#ads {
	background: #EEE;
	padding: 14px 25%;
	border: 1px solid #CCC;
}

 

2

AD Floating left


The below CSS is used to float the ad on left side and content on right side. You can see this feature in most of the blogs. Some blogs have BuysellAds just below the title floating left and content floating right. This surely will increase your CTR.

#ads {
	float:left;
	background: #eee;
	border: 1px solid #ccc;
	padding:10px;
	margin: 10px 10px 10px 0px;
}

 

3

Ad Floating right



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

Related Posts

Popular

Editor’s Pick

  • Exploring the Wonders of Gigapixel Photography: How to Achieve Stunning Detail and Clarity in Your Images

    Gigapixel photography is a technique that captures images with incredibly high resolution and detail, allowing for stunningly clear and vibrant pictures that are perfect for printing or displaying on large screens. In this article, we’ll explore some tips and techniques you can use to achieve amazing results with gigapixel photography. Definition of gigapixel photography Gigapixel…

  • Master the Art of Object Destructuring: Boost Your JavaScript Skills Today!

    JavaScript destructuring is a powerful feature that allows developers to extract values from arrays and objects, and assign them to variables in a more concise and readable way. By using destructuring, you can easily access specific values from complex data structures, such as nested objects or arrays, without having to write lengthy code to traverse…

  • Show only post titles in Home page

    As you might have noticed in many magazine themes , showing only post titles in home page is getting popular these days. By showing only post titles in Home page you can decrease the page loading time and also it will easy for the reader to navigate. Showing post titles in home page will certainly…

  • 45+ Unbelievable Landscape Photography Inspirations

    Beach Grass, Scotland Marram beach grass blowing on the coast of the Isle of Lewis. Pampa – Santa Fe, Argentina Hengill Mountain, Iceland Hengill mountain is close to Reykjavik and is famous for its geothermal areas and vivid colours. Storm Clouds, South Dakota Large powerful storms can be nearly a daily occurrence during the summer…

  • How to install Applications using Terminal in Ubuntu?

    Whenever we install a new operating system we would at first be puzzled at the strangeness of the new desktop environment. We don’t know what to do and what not to do. But when it comes to linux things get easy than a user can imagine and the problem that pops up can be rectified…