Recently one of our users asked us how to add the little notification that asks their iPhone users to add a bloc ifon to their home screen. This feature was being heavily used by popular sites like TechCrunch and others. If you have a great looking responsive design for your WordPress blog, and you have a good number of mobile users, then it makes sense for you to implement this technique. In this article, we will show you how to ask your readers to add your WordPress blog icon on their iPhone or iPad home screen. This encourages readers to visit your site more often because they have a one-click access to your website similar to an app.
Editor’s Note: please only do this if your mobile site is functional and actually looks good. Otherwise these things can be pretty annoying.
First thing you need to do is install and activate the Add to home screen WP Plugin. Upon activation, a new settings page will be added under Settings » ATHS Options. The settings page allows you to control the behavior and functionality of this plugin. In the settings page, you need to add your website’s icon. You want the icon to be recognizable because this is what your users will see on their home screen. To add an icon go to Media » Add New in your admin panel. Upload an image file with these exact dimensions (144×144 pixels). Copy the URL of this image file and paste it in the plugin settings page.
Once you do that, then you are good to go. This plugin will work on iPhone, iPad, and iPod touch devices. However, it will only work on the safari browser. When a user visits your website, they will see a notification asking them to add your blog’s link as a web app on their device. They can tap on the notification to install your website as a web app. If you provided an icon on the plugin settings page, then it will be used as the home screen icon. Otherwise, a snapshot of your web page will be used as icon.
Add to home screen WordPress plugin provides you with an option to open your website in the fullscreen web app mode instead of Safari web browser. It is recommended that you choose the fullscreen mode so that the users who have already added your blog will not see the balloon notification each time they visit your website. To do that go to Settings » ATHS Options page. Scroll down to Navigation Options , and select Fullscreen mode from Choose your browser drop down menu.
We hope that this article helped you add a notification that ask your readers to add your WordPress blog icon on their iPhone. What are your thoughts on these balloon notifications? Do you ever add them on your iPhone? Would you add this on your site? Let us know by leaving a comment below.
