How to add admob to your jQueryMobile app, the right way

July 26, 2011 in jQuery, jQuery Mobile, Mobile Development, Video Tutorials, Web Development with 27 Comments

This screencast will teach you how to add admob to jQuery mobile with multi page support. Before jQuery mobile ajax feature caused an issue preventing this from working. Now have all of your pages support ads!


Download Source

Thanks to @pclaar for the jQuery fix code.


Related posts:

  1. Introduction to jQueryMobile
  2. jQueryMobile Dynamic Pages, Links, & the back button
  3. How To Add Admob To Your jQuery Mobile App
  4. jQueryMobile Touch Events: The Swipe
  5. jQueryMobile Forms Part 1 The Basics

About Anthony James: Anthony is a Web Software Developer & Linux Systems Administrator. With 10 years of experience in these fields. He is also the founder and main contributor at Pinehead.tv. He is passionate about passing on his technical knowledge through training and educating others.

All Posts by  |  Share By Email

27 Responses to “How to add admob to your jQueryMobile app, the right way”

  1. James September 20, 2011 at 9:47 pm #

    I get the error “_admob is not defined” in firebug when I use this code. Using phonegap with jquerymob on android, testing on a PC with firefox. I think it occurs if admob does return an advert when I link to a page using an ajax request. Anyone else had this issue?

    Reply
    • Anthony James September 21, 2011 at 3:13 pm #

      I suspect your not including the javascript file. Can you check that?

      Reply
  2. Said Tahsin Dane October 4, 2011 at 12:12 pm #

    This demo is not working the you wrote at the end is not closed. It is written an extra instead of

    Although I have changed this, I am getting the same “_admob is not defined” error. I have included the js file. what could be the problem?

    The site is located in http://home.ku.edu.tr/~sdane/deneme/oss

    Reply
  3. Wytze October 9, 2011 at 12:41 pm #

    Your code is not working: I copied and tried your files, and just like in my own site, the Javascript runs, but does not produce a visible ad.

    I assume jQueryMobile or AdMob changed something in their inner workings. But I’d really like to know a solution.

    Reply
    • Anthony James October 11, 2011 at 3:54 pm #

      Google made some changes on allowing admob into web apps. You might want to check out those new policies. I’ll take a look this week and create another tut for you.

      Reply
      • pablo November 2, 2011 at 4:56 pm #

        I am really interested too, are you still going to doing it ?

        Reply
        • jesus November 4, 2011 at 5:29 pm #

          mee too!

          Reply
  4. Anthony James November 5, 2011 at 2:58 am #

    I’ll see what I can do.

    Reply
    • pablo November 6, 2011 at 8:30 am #

      Thanks a lot can’t wait!

      Reply
      • Anthony James November 12, 2011 at 5:41 pm #

        Source code has been updated you can click on the download link.

        Reply
        • pablo November 13, 2011 at 7:23 am #

          you are my hero :)

          Reply
          • Anthony James November 19, 2011 at 10:29 pm #

            Ha, thanks :)

        • ahmad December 14, 2011 at 3:23 am #

          I’m sorry, but how to download the source code?

          Reply
          • Anthony James December 14, 2011 at 3:25 am #

            Click on the “Download Source” at the top of the post.

  5. jesus November 25, 2011 at 12:41 pm #

    many, many thanks! (did I say Many thanks?)

    Reply
    • Anthony James December 14, 2011 at 3:25 am #

      Anytime :)

      Reply
  6. ahmad December 14, 2011 at 3:30 am #

    I see. Thanks james.. I didn’t see it because it is invisible, only after I highlighted that area, the download link will appear.

    Reply
  7. Anthony James December 14, 2011 at 3:31 am #

    Interesting, Maybe a bug on my end. What browser are you running?

    Reply
  8. ahmad December 14, 2011 at 3:36 am #

    IE9, Just now I test with firefox 7, it can display the download link.

    Reply
  9. greg December 25, 2011 at 6:23 pm #

    does anyone have a jquery mobile website with it working so i can see how it looks. Still cant get it to work.
    thanks

    Reply
    • Anthony James December 25, 2011 at 7:15 pm #

      Checkout the new source i has a fix since google changed admob. Example is working in source

      Reply
      • greg December 29, 2011 at 6:19 pm #

        This will work in mobile web pages not just apps?

        Reply
        • Anthony James December 29, 2011 at 11:20 pm #

          Sure will! Its web based so the term web app is used.

          Reply
  10. agus @ jQuery Mobile Apps January 16, 2012 at 9:29 am #

    Thanks for the link..

    Reply
  11. jojo January 17, 2012 at 8:40 pm #

    Is it just me or is this not working?
    Maybe Google considers this as a TOS violation?
    I have tried your code and nothing gives.
    Is there maybe another bug fix?

    Reply
    • Anthony James January 18, 2012 at 3:50 pm #

      Well google keeps changing the way it works. Have you downloaded the git source? Last I checked that was correct, perhaps I’ll have to find another work around for the 3rd time.

      Reply
  12. Anthony James January 19, 2012 at 1:54 pm #

    The source is updated.

    Reply

Leave a Reply:

Gravatar Image