Technical Notes

My online notepad

  • Social


  • Support

    Donate towards my web hosting bill!

How to enable Google Adsense on Jetpack Mobile Theme

Posted by Anton Khitrenovich on December 7, 2012

Congratulations, you’ve successfully activated Mobile Theme on Jetpack! Now your lovely site looks great on small mobile screens also, and it was only one click away. But wait, something is still missing… Right, there are no sidebars – and no ads inside! Maybe it makes no difference for the readers, but not for you as the blog owner.

Well, the Jetpack documentation explains that they do use look for a sidebar with some predefined ID to show it at the bottom of the page. It means that maybe you do have one of your sidebars shown there. If this is the case, you have no choice but to rearrange the content of this sidebar to match it to mobile page. Otherwise keep reading, and I will explain how to add a new dedicated sidebar for mobile theme.

First, you have to register a new sidebar. This can be done directly in your current theme, but creating a child theme is more elegant. Also, you will not lose the changes if your theme will be updated. The process is pretty straightforward – create a folder for your new theme (I named mine “Mobile Plus”) and placed it under “wp-content/themes/mobile-plus” folder. Then create the basic “style.css” file (required for a child theme) and the “functions.php” file – this one will register your new toolbar.

Here is the “style.css” from my theme. Note that my main theme is “andreas09″, you have to use the name of your main theme in the highlighted lines.

/*
Theme Name: Mobile Plus
Description: Child theme for the mobile ads support
Author: Anton Khitrenovich
Template: andreas09
*/

@import url("../andreas09/style.css");

Here is the “functions.php” from my child theme. You can use it as-is. Note the only function call in the highlighted line – this is the line that registers the new sidebar with the required ID.

<?php

// Register sidebar to be used by Mobile Theme from JetPack
register_sidebar(array('name' => 'Mobile Sidebar', 'id' => 'sidebar-1'));

?>

That’s all. Now you can switch to your new theme and add the Mobile Banner from Google Adsense (or another mobile ads code) to your fresh Mobile Sidebar!

Note: Don’t forget to re-select the menu your theme is using, as by default it is not set for the newly chosen theme!

This is how this blog looks like on my iPhone – before and after the change:

 

5 Responses to “How to enable Google Adsense on Jetpack Mobile Theme”

  1. Awesome issues here. I’m very glad to look your article. Thanks so much and I am looking ahead to touch you. Will you please drop me a mail?

  2. Hello, i think that i noticed you visited my website thus i got here to return the choose?.I’m trying to in finding things to improve my site!I assume its adequate to make use of a few of your ideas!!

  3. Sekas said

    Thank you, great everything is explained and of course works great. I struggled for days looking for a solution … and I finally found … Another big thank you

  4. O'neil said

    This works for me. Many thanks Anton. I was almost giving up before I ran into your blog.

Leave a Comment

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

 

%d bloggers like this: