Easily Embed Google Adsense Ads or Other HTML Blocks with WordPress Custom Shortcodes

The following tutorial comes after a client recently requested to be able to add adsense ads to their site. The client uses multiple authors for their site, but feared allowing them to have unfiltered html access. This tutorial explains in very simple terms how to create a shortcode using the WordPress application to embed AdSense ads. You can use the same guidelines to set up a shortcode  to display any html code block.

First we are going to add a folder to our plugin folder. For this tutorial we will name the folder adsense-responsive-banner-shortcode, but you should name it for your particular shortcode needs.

Next we are going to add a file to the folder. The name of the file will be adsense-responsive-banner-shortcode.php

Now is when we will add the code found below to the php file.

To modify the shortcode for your site, simply replace all the code inside return ‘…’

After you save the file you will go to your plugins and activate your new custom shortcode plugin.

<?php
/**
* Plugin Name: Adsense Responsive Banner
* Plugin URI: http://exnube.com
* Description: A shortcode to embed Adsense Responsive Banner
* Version: 1.0
* Author: Ex Nube, Of the Cloud
* Author URI: http://www.exnube.com
* License: GPL2
*/

add_shortcode(‘adsense-responsive-banner’, ‘adsense_responsive_banner_function’);

function adsense_responsive_banner_function() {
return ‘<div class=”yourclass”><script async src=”//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js”></script>
<!– Responsive Banner Ad–>
<ins class=”adsbygoogle”
style=”display:block”
data-ad-client=”ca-pub-0489019553248611″
data-ad-slot=”5944666733″
data-ad-format=”auto”></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script></div>’;
}
?>

Comments are closed.