Ipod, iPhone, iPad Add to Home Screen for Joomla! CMS
This small plugin for #Joomla! add a message inviting iPhone/iPad users to add the web application to the home screen.
The code is compatible with iPhone/iPod touch, iPhone4 and iPad. On older devices the “add” icon is a “+” while on iOS 4.2 it has been replaced with . The script detects the OS version and displays the appropriate icon.
The message appears after 2 seconds (customizable) from page load, and is destroyed after 20 seconds (also customizable). The balloon enters and exits the screen with a quick configurable animation: drop from top, bubble from bottom or fade in/out. Additionally it also let you choose a custom icon for your blog when a visitor adds your website to start screen.
This plugin is based on the project add2Home (MIT license) and all credits goes to the author Matteo Spinelli
- plg_add2home_j15.zip for #Joomla! 1.5
- plg_add2home_j16.zip for #Joomla! 1.6/1.7
- animationIn: the animation the balloon appears with. Can be:
drop,bubbleandfade. Default: drop. - animationOut: the animation the balloon exits with. Can be:
drop,bubbleandfade. Default: fade. - startDelay: milliseconds to wait before showing the message. Default: 2000
- lifespan: milliseconds to wait before hiding the message. Default: 20000
- bottomOffset: distance in pixels from the bottom (iPhone) or the top (iPad). Default: 14
- expire: minutes before displaying the message again. If you don’t want to show the message at each and every page load, you can set a timeframe in minutes. The message will be shown only one time inside that timeframe. Default: 0 (=always show).
- message: Define a custom message to display OR set a fixed locale. If you don’t like the default message we have chosen for you, you can add your own. You can also force a language by passing the respective locale (eg: ‘en_us’ will always display the English message). Default: ” (=script decides).
- touchIcon: if set to
true, the script checks forlink rel="apple-touch-icon"in the pageHEADand displays the application icon next to the message. Default: false. - arrow: shows the little arrow pointing the bottom bar “add” icon. For custom designs you may want to disable it (ie: set it to
false). Default: true.
You can see a demo of it at http://vimeo.com/19090508 and it is currently active on this blog.
You can create your own Apple icon using free online service like
http://wizardtoolkit.com/shooter/iPhone-Icon-Generator
