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

Home»Cloud & Internet»Advertising»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.

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+.
  • Thankyou so much 🙂 really need that.

  • thanks a lot for this article, and jetpack has been the most popular wordpress plugin. BUT i always prefer not to use the mobile friendly option, because i find that option weird. when i enable that feature, i see the mobile version is enabled for both desktop and mobile site. so i prefer rather then using this, use a responsive theme.
    also u can redirect mobile site to /m like this http://dailymobiles.net/m
    thanks

  • Current Nigeria Job Vacancies

    Thanks I came across this post. I installed Jetpack and use one wordpress plugin mobile ad for jetpack. I inputed my Pub ID and AD slot ID but the space was blank, before i read this post. I can’t believe how my AD is displaying. Perfect

  • Ewing33

    First, thank you so much for this information! I was able to get adsense ad running on the top and bottom of my content on a single post page.

    Would it be possible for you to provide the code to be able to place these ads on all my pages (front page, single post, archive, category)? Also, instead of having an ad on top of my content (cutting off my content from the article title), would it possible to put code in to place an ad at the very top of my website?

    Thanks again for the information in the post. Any additional help would be extremely appreciated, but no problem if you can’t.

Pin It on Pinterest

Share This

Share This

Share this post with your friends!