How to Insert & Show Ads (Google AdSense) in Jetpack Mobile Theme of WordPress

»»»How to Insert & Show Ads (Google AdSense) in Jetpack Mobile Theme of WordPress
Mobile Theme of Jetpack plugin for WordPress provides an instant and easy way to enable an optimized mobile site for self-hosted WordPress blog or website. When Jetpack Mobile Theme detects a visitor is using a smartphone or tablet with small screen to visit the website, it will automatically present the mobile-optimized site to the visit using the build-in mobile theme.

If you want to monetize the mobile site, Jetpack Mobile Theme does not offer a direct way to allow you to insert or place ads code into the mobile site. And you cannot modify the active theme files or using active theme’s options or active theme’s functions.php file to attempt to display the ads in Jetpack Mobile Theme, as the mobile site will use its own theme built into JetPack Mobile Theme feature.

You will have to rely on third-party WordPress plugin, of which there is plenty to choose from in WordPress Plugin Directory, to do the job of showing ads in the mobile theme. So if you’re using plugin to inject the ads code now, chance is it will work on Jetpack Mobile Theme too.

If for some reasons the current plugin is not working properly on mobile theme, or you want to have more control by adding the ads code into mobile theme yourself, or you want to display two different sets of ads codes for desktop and mobile theme, it’s possible to use actions and filters to add ads code to Jetpack Mobile Theme powered mobile website.

Try out the following code which inserts ads code to the top and/or bottom of the content on all single posts.

  1. Install and activate Functionality plugin, which allows you to add custom functions without relying on theme’s functions.php file, and thus will work in Jetpack’s mobile theme.
  2. Go to Plugins -> Edit Functions, and insert the following code:
    // Check if we are on mobile
    function tj_is_mobile() {
        // Are Jetpack Mobile functions available?
        if ( ! function_exists( 'jetpack_is_mobile' ) )
            return false;
     
        // Is Mobile theme showing?
        if ( isset( $_COOKIE['akm_mobile'] ) && $_COOKIE['akm_mobile'] == 'false' )
            return false;
      
        return jetpack_is_mobile();
    }
    
    // Show ads on posts if we're on mobile
    function tj_ads_maybe_add_filter() {
        // Are we on mobile
        if ( tj_is_mobile() ) :
            if ( is_single() ) {
                add_filter( 'the_content', 'tj_show_mobile_ads' );
            }
        endif; // End check if we're on mobile
    }
    add_action( 'wp_head', 'tj_ads_maybe_add_filter' );
    	
    // Display ads
    function tj_show_mobile_ads( $content ) { 
        $ads_top = '<!-- Insert the Ad Code Here -->';
        $ads_bottom = '<!-- Insert the Ad Code Here -->';
    
        // Choose one of the following locations to show the ads
        return $ads_top . $content . $ads_bottom; // place ads on top and bottom of content
        return $ads_top . $content; // place ads on top of content
        return $content . $ads_bottom; // place ads on bottom of content
    }

Replace the placeholder <!– Insert the Ad Code Here –> with the actual ads code from web advertising agency such as Google AdSense, Amazon Associates, Tribal Fusion and etc. Note the use of single quotation mark. If the ads code is using single quotation mark itself, then change the single quotation mark to standard double quotation mark to avoid any runtime error.

By | 2016-12-09T08:38:59+00:00 December 9th, 2016|Categories: Advertising|Tags: , , |5 Comments

About the Author:

LK is a technology writer for Tech Journey with background of system and network administrator. He has be documenting his experiences in digital and technology world for over 15 years.Connect with LK through Tech Journey on Facebook, Twitter or Google+.

STAY IN TOUCH

close-link