Announcement

Collapse
No announcement yet.

How to Alert and Redirect users to Mobile App

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • How to Alert and Redirect users to Mobile App

    Here are instructions on how to display an alert on your users phone when they attempt to browse your site from their phones browser.

    open up the "header" template and at the very bottom add this code:

    Code:
    <body onload="iPhoneAlert( );">
    then open up "headinclude" template and at the very bottom add this code:

    Code:
    <script type="text/javascript">
    function iPhoneAlert( )
    {
    if ( navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPod/i) )
    {
    var qes* *= confirm( "This forum has an iPhone app! Click OK to learn more about Digital Mayhem Mobile for iPhone." );
    if ( qes )
    window.location* *= "http://dmlinks.us/DMMobile-iOS";
    }
    else if ( navigator.userAgent.match(/Android/i) )
    {
    var qes* *= confirm( "This forum has an Android app! Click OK to learn more about Digital Mayhem Mobile for Android." );
    if ( qes )
    window.location* *= "market://details?id=com.vbulletin.build_113";
    }
    }
    </script>
    of course replacing Digital Mayhem Mobile with the name of your App and the links with the links of your App Store and Android Market links...


    **NOTE** I am trying to find a better file to put the code that loads first because atleast on all of my sites from both iPhone & Android practically the entire site loads before the message is displayed and user redirected.

    **Maybe vBulletin will make this a sticky**




    ***UPDATED July 7, 2012*** With the future release of iOS 6 this Fall you can add "SmartApp Banners" to your site example running on my sites below.

    Click image for larger version

Name:	2012-07-06 16.23.26.jpg
Views:	4
Size:	64.4 KB
ID:	3724003Click image for larger version

Name:	2012-07-06 16.20.17.jpg
Views:	4
Size:	65.4 KB
ID:	3724004Click image for larger version

Name:	2012-07-06 16.16.43.jpg
Views:	4
Size:	63.6 KB
ID:	3724005Click image for larger version

Name:	2012-07-06 16.14.06.jpg
Views:	4
Size:	67.0 KB
ID:	3724006Click image for larger version

Name:	2012-07-06 16.13.28.jpg
Views:	4
Size:	60.2 KB
ID:	3724007

    To acquire this on your site just add one simple line of code I added it to the very very top of the headerinclude template

    <meta name="apple-itunes-app" content="app-id=XXXXXXXX">

    Replace the XXXXXXXXX with your apps actual App ID.
    Last edited by SteveLV702; Sat 7th Jul '12, 9:57am.
    ------------------------------------------
    Steve
    DM Mobile Lite (iTunes)(Android)(Blackberry)
    CN Mobile Lite (iTunes)(Android)(Blackberry)
    TheFaFClan Mobile Lite (iTunes)(Android)(Blackberry)
    Audi Spirit Mobile Lite (iTunes)(Android)(Blackberry)

  • #2
    Awesome, thanks for this!
    <signature removed by staff>

    Comment


    • #3
      Well, I was finally able to add the code to my templates, but it's not working.
      <signature removed by staff>

      Comment


      • #4
        will try later, thanks Steve

        Comment


        • #5
          Not working for me either.

          Comment


          • #6
            weird works in mine... if you wanna PM me I can take a look I noticed someone else that copied and pasted it for some reason didn't copy and past right so some breakage somewhere I was able to fix it in a matter of seconds...
            ------------------------------------------
            Steve
            DM Mobile Lite (iTunes)(Android)(Blackberry)
            CN Mobile Lite (iTunes)(Android)(Blackberry)
            TheFaFClan Mobile Lite (iTunes)(Android)(Blackberry)
            Audi Spirit Mobile Lite (iTunes)(Android)(Blackberry)

            Comment


            • #7
              I copied and pasted it perfectly. Are we putting this in he right spots? Perhaps you left out some code?
              <signature removed by staff>

              Comment


              • #8
                okay I have this code in the "header" at the very very bottom of the code

                Code:
                <body onload="iPhoneAlert( );">
                and this code in the 'headinclude" again at the very very bottom of the existing code:

                Code:
                <script type="text/javascript">
                function iPhoneAlert( )
                {
                if ( navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPod/i) )
                {
                var qes   = confirm( "This forum has an iPhone app! Click OK to learn more about Digital Mayhem Mobile for iPhone." );
                if ( qes )
                window.location   = "http://dmlinks.us/DMMobile-iOS";
                }
                else if ( navigator.userAgent.match(/Android/i) )
                {
                var qes   = confirm( "This forum has an Android app! Click OK to learn more about Digital Mayhem Mobile for Android." );
                if ( qes )
                window.location   = "market://details?id=com.vbulletin.build_113";
                }
                }
                </script>
                ------------------------------------------
                Steve
                DM Mobile Lite (iTunes)(Android)(Blackberry)
                CN Mobile Lite (iTunes)(Android)(Blackberry)
                TheFaFClan Mobile Lite (iTunes)(Android)(Blackberry)
                Audi Spirit Mobile Lite (iTunes)(Android)(Blackberry)

                Comment


                • #9
                  It works now!

                  Thanks!!!
                  <signature removed by staff>

                  Comment


                  • #10
                    Originally posted by CEO254 View Post
                    It works now!

                    Thanks!!!
                    Great
                    ------------------------------------------
                    Steve
                    DM Mobile Lite (iTunes)(Android)(Blackberry)
                    CN Mobile Lite (iTunes)(Android)(Blackberry)
                    TheFaFClan Mobile Lite (iTunes)(Android)(Blackberry)
                    Audi Spirit Mobile Lite (iTunes)(Android)(Blackberry)

                    Comment


                    • #11
                      Yep now it works for me too! It seems that those stars in your code was the problem.

                      Comment


                      • #12
                        hmm weird dont know why even posted those stars
                        ------------------------------------------
                        Steve
                        DM Mobile Lite (iTunes)(Android)(Blackberry)
                        CN Mobile Lite (iTunes)(Android)(Blackberry)
                        TheFaFClan Mobile Lite (iTunes)(Android)(Blackberry)
                        Audi Spirit Mobile Lite (iTunes)(Android)(Blackberry)

                        Comment


                        • #13
                          I guess your mod got "rated" by itself as awesome!

                          Comment


                          • #14
                            But it asks every time you perform a refresh!!

                            Comment


                            • #15
                              Thank you Steve. I promoted this post to article!

                              Comment

                              widgetinstance 262 (Related Topics) skipped due to lack of content & hide_module_if_empty option.
                              Working...
                              X