Många webbplatser och företag har idag en även en app tillgängliga för smartphones såsom t.ex. iPhone och Android. Genom en snabb ändring på sin webbplats kan man informera alla besökare till webbplatsen om att det finns en app samt ge dem alternativet att installera appen. Det fina är att informationen enbart visas för mobila besökare samt att den rekommenderar rätt app direkt om ni erbjuder både en version för Android och en för iOS (iPhone/iPad).
Tekniken som används kallas Smart App Banner och lanserades tillsammans med iOS 6. Tekniken finns även med i den nyare versionen iOS 7 så tekniken fungerar i dagsläget på mer än 97% av alla användare av iPhones. Funktionen finns officiellt bara tillgänglig för enheter som kör iOS, d.v.s. iPhone och iPads, så användare av Android kommer tyvärr inte se informationen. Som tur var finns det dock en hel del smarta och driftiga människor där ute som helt enkelt återskapade en liknande funktion men då istället riktad mot smartphones som använder Android.
Följ nedanstående instruktioner beroende på plattform som du vill rikta in dig mot. Använder du WordPress så finns ett färdigt tillägg för dig att installera. Läs mer om detta i slutet av inlägget.
iOS (iPhone/iPad)
Lägg in följande information i mellan din <head>-tagg.
<meta name="apple-itunes-app" content="app-id=myAppStoreID">
I exemplet ovan måste du ersätta följande information för att det ska bli rätt:
- app-id=myAppStoreId – Ersätt myAppStoreId med din apps ID från App Store. Det är ett niosiffrigt nummer och kan hittas på länken till din app i App Store. För WordPress-appen som hittas på App Store (https://itunes.apple.com/se/app/wordpress/id335703880?mt=8) så är IDet du söker markerat med fet stil (fyll i app-id=335703880).
Om du arbetar som affiliate kan du även skicka med ditt affiliate-ID samt om du är en avancerad användare så kan du även låta användaren öppna en specifik avdelning i din app om besökaren redan har installerat den. Detta räknas dock som mer avancerad installation och information kan hittas om detta via att besöka iOS Developer Library.
Android (t.ex. Samsung, LG, Sony)
Tyvärr finns inte samma teknik som en officiell funktion för Android, men som nämnt ovan så finns det duktiga människor därute som har löst det ändå. Den lösning som jag själv använt heter jQuery Smart Banner. Det är ett JavaScript som tillsammans med jQuery visar en banner likt den som visas för iOS men nu även för Android (vilket innebär telefoner såsom LG G2, Samsung Galaxy S5, Sony Xperia Z2 o.s.v.) men även surfplattor som baserar sig på Android.
Lägg in följande information mellan din <head>-tagg:
<meta name="google-play-app" content="app-id=com.google.android.youtube">
<link rel="stylesheet" href="jquery.smartbanner.css" type="text/css" media="screen">
- Ersätt com.google.android.youtube med ditt id från Google Play. För WordPress-appen som hittas på Google Play (https://play.google.com/store/apps/details?id=org.wordpress.android&hl=sv) så är det ID du söker markerat med fet still (använd org.wordpress.android)
Lägg in följande i slutet av din kod (innan </body>):
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script src="jquery.smartbanner.js"></script>
<script type="text/javascript">
$(function() { $.smartbanner() } )
</script>- Ta bort raden om jquery.min.js om du redan har läst in jQuery på din webbplats
- Ersätt sökvägen till jquery.smartbanner.js beroende på vart du laddade upp den på din webbplats. Exempel har du skapat en mapp som heter /javascript/ så ändrar du till /javascript/jquery.smartbanner.js
Använder du WordPress?
Då finns det mycket enklare lösning för dig. Logga in på din administrationspanel och välj att installera tillägget AppBanners. Tillägget lägger då med automatik till nödvändig information och du behöver bara ange vart dina appar finns i Google Play och i AppStore.
Lämna ett svar