Add to home screen WP Plugin

Beschreibung

NEW 2019 UPDATE !!! The Add to home screen WP Plugin now supports the latest versions of WordPress, and its use with the main Progressive Web App (PWA) extensions is highly recommended !

You can now use a PWA WordPress plugin, like SuperPWA for instance, to turn your WordPress blog into a kind of native mobile app, without the constraints of native mobile app (store submission, costs, etc…).

With PWA coupled with Add to home screen WP Plugin, you will be able to display the legendary floating balloon that invites your visitors to add your blog to their iOs device, and then your blog will load as a PWA.

This combination is the best way to increase visitor loyalty, without being obliged to upload a costly native mobile app into App Store and Play Store.

This plugin uses Add to home screen’s Cubiq script to place a floating balloon inviting the user to add a website to their home screen as a standard iOs application.

It’s a good way to retain visitors coming to your blog, especially if you don’t want to develop an expensive application just to let them read articles of your WordPress blog.

The floating balloon is compatible with iPhone/iPod touch, iPhone 5, iPhone 6, iPhone 7, iPhone 8, iPhone X, iPhone XR and iPad.

Demo

See nice demo with the video below :

Check a demo in my blog (load it on an iPhone for instance).

Read more and documentation on my blog

En savoir plus et lire la documentation sur mon blog

Internationalisation

This plugin provides support for language translations. Help me to translate it by notifying me in comments and I’ll add your mo/po files to the official plugin.

Available languages: English, French and German.
Thanks to Julian for the German translation!

Features

Thanks to the functions of the Cubiq script, there are many features and allowed customizations:

  • Message: type the message that you want inside the floating window. If you don’t custom the message, the script checks the user’s locale and shows a default message in an appropriate language. You can also force a language.
  • Animation: drop, bubble or fade.
  • Delays: before showing the message and its duration.
  • Expire: minutes before displaying the message again.
  • Touch icon: icon of your app but also image while your app is loading.
  • Show to returning visitors only: to only target returning visitors and not irritate first time visitors.

Additional features:

  • Custom the title of your application.
  • Show message on homepage only or on the entire blog.

Follow me

Keep in touch with me on:

LinkedIn

Twitter

Facebook

Credits

This plugin has been written by Ziyad Bachalany and uses the Add to Home Screen Floating Layer script by Matteo Spinelli that is released under the MIT License (see below).

License

This software is released under the MIT License.

Copyright (c) 2013 Matteo Spinelli, http://cubiq.org/

Permission is hereby granted, free of charge, to any person
obtaining a copy of this software and associated documentation
files (the „Software“), to deal in the Software without
restriction, including without limitation the rights to use,
copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the
Software is furnished to do so, subject to the following
conditions:

The above copyright notice and this permission notice shall be
included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED „AS IS“, WITHOUT WARRANTY OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
OTHER DEALINGS IN THE SOFTWARE.

Screenshots

  • Example of a nice custom floating balloon
  • Example of the English floating balloon
  • Example of the French floating balloon
  • Plugin Option page
  • Plugin Option page

Installation

  1. Upload add-to-home-screen-wp folder to the ‚/wp-content/plugins/‘ directory or install it via the WordPress dashboard.
  2. Activate the plugin through the ‚Plugins‘ menu in WordPress. The floating balloon is now enabled.
  3. Go to Settings > ATHS Options and play with settings.

FAQ

If a visitor adds my blog to its home screen, will the balloon continue to appear?

Your blog will open on Safari browser when you will tap on your icon, and the balloon will continue to appear (unfortunately, we cannot prevent it from being opened in this mode even if user has alreay added the blog to its homescreen). The solution is to set an important expire timeframe (e.g on year) in the options page.

I made changes on options page but nothing’s changed when I load my blog?

Try to:

  • Clear your cache if you’re using a cache plugin
  • Clear your Safari cache/cookies.
  • Reboot Safari: on iPhone for instance, you have to double-click on the home button, then press Safari button several seconds and click on the close button.
The blog title on my icon is cut?

Application names on the home screen are limited to a maximum of 12 characters, so anything beyond that will be truncated. Try to keep the title of your application under 13 characters on the iPhone if you want to prevent it from being cut off. Fortunately, there is an option in the plugin to customize your application title, it can be very useful especially if the title of your blog is too long.

Can I custom the text that will appear in the floating balloon?

Of course, and it’s highly suggested! You can add link, bold text and also add emojis to gamify your floating ballon and increase conversions. See screeenshots and videos to see examples.

Rezensionen

Juli 20, 2019
The plugin works perfectly on ioS devices and exactly for that it is described. One wish of mine would be that this would also work on Android devices when using the Samsung browser or the Firefox browser. With the Google Chrome Browser the message for the installation of the PWA is displayed but not in Firefox etc. Maybe there will be an update of the plugin in the future where this can be done 😉 Best regards Joachim
Juli 14, 2019
I used SuperPWA to turn my sites into progressive web apps, which is great. But while SuperPWA works great on android and iPhone, it's add to home screen popup only works for Android. This plugin fills the gap. It works, and it looks great! Until yesterday's fix it wasn't working for me, despite an announced fix earlier this year. Now it's ALL GOOD! So if you tried it unsuccessfully in past, try again. Well worth it. Thanks Ziyad!
Mai 12, 2019
Just enjoying it. Thank you so much for creating this plugin. Much appreciated.
Januar 25, 2018
This will be the future. You can read more about it one progressive-web-apps by google. Also google love this plugin. Hope the author continue to develop this plugin because at the moment don't work on ipad mini and the icon instead right go to the left. Btw, awesome idea. Don't give up and make it great!
September 3, 2016
I reported a bug a year ago, but it hasn't been fixed yet: https://wordpress.org/support/topic/plugin-is-throwing-an-error?replies=1 To fix this, the addmetawebcapablelinks() function simply needs to moved to another area. Moving it to the top of the file is sufficient to fix the problem. If this error is fixed, I'll bump my rating up higher, but in it's current state this plugin is not usable IMO.
Lies alle 21 Rezensionen

Mitwirkende & Entwickler

„Add to home screen WP Plugin“ ist Open-Source-Software. Folgende Menschen haben an diesem Plugin mitgewirkt:

Mitwirkende

Änderungsprotokoll

1.5

Little fix.

1.4

New version tested up to WordPress 5.2.

1.3

Bugs fixed.

1.2

New version tested up to 4.8.1.
Some old functionnalities have been removed.

1.1

Fix for the iOS 7 web app status bar.
German translation added.

1.0

Floating balloon updated for iOS 7.

0.9

New home screen icons and startup screens for all iOs devices (ipad, iPhone 5, etc…).

0.8

Fix bug with „homepage only or all pages“ option.
Some little performance improvements.

0.7

Improvement of the bottom navigation bar on Web App: added forward and reload buttons.
Allow using Safari mode in Web App.
Fix bug with the „returningVisitor“ function.

0.6

Improvement CSS of the Web App.
Allow opening the balloon on homepage only or all pages.

0.5

Touch startup image that is displayed while the web application launches.
Prevent links switching to Safari browser.
Add navigation bar (back button) in the Web App.

0.4

Allow customizing Web App Title.

0.3

Ability to use device and icon tags when customizing the message.
Allow using apostrophe in custom message.

0.2

Display title of the page.

0.1

First version of the plugin.