Mobile Smart App Banner
Introduction
Are you a developer of mobile apps for smartphones or tablets?
Great then why not promoting them on your Joomla! website and earn some extra attention and money? ;-)
„Smart App Banners“ are a wonderful way to take your apps right into the spotlight on supported mobile phones. This extension (plugin or module) makes it really easy to configure the banner to your needs.
Supported operating systems are: Apple iOS, Google Android and Microsoft Windows.
The banners are displayed by using core features of the mobile operating systems. Since Android does not support smart banners, this extension creates a really nice Android themed banner using jQuery.
You should use the plugin to show one (1) app banner on your website or the module for multiple banners on different pages. You can assign the module to any menu item you want and also use multiple „Smart App Banner“ models at a time. Please refer to the Module vs. Plugin section for more informations.
Attention!
Joomla 2.5 does not ship with jQuery, so you need a system extension like jQuery Easy to support Android banners. You can download it here.
Some other components often include their own jQuery libraries. This could break functionality of the smartappbanner plugin/module. Then you should use jQuery Easy to strip all unneded library loads automatically.
Nevertheless, iOS and Windows banners are supported without jQuery.
About Apple Smart App Banners
The following description is taken from the Apple Developer Library "Safari Web Content Guide":
(Mobile) Safari has a new Smart App Banner feature in iOS 6 and later that provides a standardized method of promoting apps on the App Store from a website, as shown in the following figure:
Smart App Banners vastly improve users’ browsing experience compared to other promotional methods. As banners are implemented in iOS 6, they will provide a consistent look and feel across the web that users will come to recognize. Users will trust that tapping the banner will take them to the App Store and not a third-party advertisement. They will appreciate that banners are presented unobtrusively at the top of a webpage, instead of as a full-screen ad interrupting the web content. And with a large and prominent close button, a banner is easy for users to dismiss.
If the app is already installed on a user's device, the banner intelligently changes its action, and tapping the banner will simply open the app. If the user doesn’t have your app on his device, tapping on the banner will take him to the app’s entry in the App Store. When he returns to your website, a progress bar appears in the banner, indicating how much longer the download will take to complete. When the app finishes downloading, the View button changes to an Open button, and tapping the banner will open the app while preserving the user’s context from your website.
Smart App Banners automatically determine whether the app is supported on the user’s device. If the device loading the banner does not support your app, or if your app is not available in the user's location, the banner will not display.
Module vs. Plugin
Basically, the SmartAppBanner module an plugin do the same thing:
They display an app banner on top of the browser window on capable mobile devices.
But when do you have to choose the module and when the plugin?
You should use the module, if you
- have more than one app to promote
- want to show the banner on selected pages only
- have advanced Joomla experience and want more control
In opposite, the plugin should be used if you
- are looking for the easiest way to display a promotion banner
- don't have much Joomla knowledge
- only want to promote one single app
Download
Download the module: mod_smartappbanner2.0.1.zip (~ 50 KB)
Download the plugin: plg_smartappbanner2.0.zip (~ 49 KB)
Optional: jQuery Easy
Setup & Configuration
Because I think the installation of this extension is self explaining, I'll keep things short ;-)
1. Use the Joomla installer to install the plugin or module
2. Configure the parameters. For more help, hover the labels with your mouse.
Android example:
3. If you use the module, then choose any available position to load the module into. (I recommend "debug").
4. Publish the module or plugin
Where to get the Apple App-ID?
The simplest way to get the 9-digit iTunes App-ID is to use the iTunes Link Maker Website. When you search for any app you want to display on your website, you'll get a unique App-ID by analyzing the link generated by the link maker.
For example the above displayed banner is produced by using the App ID 608808043 from this link:
https://itunes.apple.com/de/app/fruit-shop-designer-!/id608808043?mt=8&uo=4
Where to get the Google package name?
The simplest way to get your Android app's package name is to search your app in the Google Play Store.
After opening the detail view of the app, the name appears as 'id' in the address bar of your browser.
Support
For questions on the specific banners, read the guidelines:
- Apple iOS: Promoting Apps with Smart App Banners
- Microsoft Windows: Connect your website to your Windows Store app
If the Android banner is not displayed even by using jQuery Easy,
make sure to set the jQuery version
to 1.8, 1.9 or 1.10.x and set the ordering to "Order Last".
If you are running Joomla 2.5 jQuery Easy options should look like this:
On Joomla 3.x use these jQuery Easy settings:
If you experience further problems with this extension, feel free to contact me by mail: info@provis1.de
Changelog
2.0.1 (12.2.2015)
+ Small bugfix in jQuery detection (Module)
2.0 (19.1.2014)
+ Added support for Android and Windows
1.0 (21.9.2013)
+ Initial release