Des bannières d'application intelligentes sont ces bannières qui apparaissent au sommet de l'écran de votre navigateur de smartphone et qui fournissent un lien de téléchargement en un clic de votre application.
Si vous avez une application mobile et un site internet, vous pouvez inciter les internautes à télécharger votre application en utilisant ces bannières. Elles seront uniquement visibles sur smartphone. Il s'agit là d'une façon intelligente et automatisée pour promouvoir votre application iOS ou Android sans que cela ne soit trop intruisif pour le mobinaute.
Nous verrons dans un premier temps comment installer simplement et rapidement la promotion de votre bannière pour votre application iOS ( Apple Store) avant de se lancer dans l'implémentation de celle de votre application Android ( Google Play). La seconde étant un peu plus compliquée.
Promouvoir votre application iOS (Apple Store) :
Concernant l'implémentation de la bannière de promotion iOS, cela reste simple. Une seule ligne de code est à placer entre vos balises ‹head› et ‹/head›. Il faut cependant que vous récupériez l'ID (id de votre application) iOS depuis votre compte iTunes Connect. Dans cet exemple, l'ID est celui de l'application iOS eMaginance :
‹head›
‹meta name="apple-itunes-app" content="app-id=1062965924"/›
‹/head›
Vous pouvez faire le test depuis votre iPhone et depuis l'URL du site eMaginance.com
Une bannière de l'application sera visible pour un téléchargement de l'appli en un clic !
Promouvoir votre application Android (Google Play) :
Il n'y a aucun support natif pour Android et l'implémentation de bannière de promotion. Par conséquent, l'implémentation est plus longue et il convient d'avoir un niveau intermédiaire.
Il faut s'orienter vers la technologie jQuery, la plupart du temps déjà présente sur votre site internet.
D'abord, téléchargez-le plug-in et installez-le sur votre serveur, par exemple dans un fichier nommé "promotion-application".
Téléchargez le package complet pour Android (incluant les fichiers jquery.smartbanner.css et jquery.smartbanner.js) depuis la plateforme Github.
Une fois cela fait, voici les explications. Vous devez inclure deux fragments de code. La première partie du code est à implémenter entre vos balises ‹head› et ‹/head› :
‹meta name="google-play-app" content="app-id=com.emaginance.android.emaginance"›
‹link rel="stylesheet" href="../promotion-application/jquery.smartbanner.css" type="text/css" media="screen"›
La seconde partie du code est à intégrer entre vos balises ‹body› et ‹/body›, dans le corps de votre code mais privilégiez de placer cette partie de code en toute fin de page, notamment pour ne pas ralentir le chargement de votre site internet.
‹script src="//ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"›‹/script›
‹script src="../promotion-application/jquery.smartbanner.js"›‹/script›
‹script type="text/javascript"›
$().smartbanner();
‹/script›
À des fins d'optimisation et aussi pour éviter d'utiliser des requêtes côté serveur supplémentaires, vous pouvez implémenter la partie CSS dans votre fichier de style CSS de base et la partie JS dans votre fichier dédié au Javascript.
Si vous avez des problèmes d'implémentation, n'hésitez pas à nous contacter. Nous vous aiderons ainsi à intégrer les bannières intelligentes pour promouvoir votre application iOS et Android de la plus belle des manières.
Jeu de briques
Snake
Pacman
Bubble