Integrate your website with your Windows 8 app

By | April 16, 2013

Yeah yeah, I know. This is already out there. But here’s the thing: in all the sites and documents I read while trying to figure this out, nobody TOLD ME where to FIND the information that goes in to the META tags! [facepalm]

So let me save you a ton of time.

When you want to do this, you are basically adding META tags to your web site/pages that IE10 reads, recognizes, and links to the Store/OS accordingly (Store if you don’t have the app installed OS launch if you do).

Easy peasy, let’s have a look at what exactly we add to the pages:

<meta name="msApplication-ID" content="microsoft.build.App"/>
<meta name="msApplication-PackageFamilyName" content="microsoft.build_8wekyb3d8bbwe"/>

Easy enough, let’s find these pieces in our app. Fire up the manifest viewer in Visual Studio 2012 and you’re met with something like this:

image

Head on over to the ‘Packaging’ area:

image

Well that was easy enough. Package Family Name is staring you right in the face (last field on that page).

But… which one is the Application ID???

Note that if you get the package family name right and the application ID wrong, the behavior you’ll see on your site is that it will ALWAYS show “Get app in store” instead of “Switch to app” after you’ve installed it. So it’s quite easy to think you’ve got it done right when you’ve only got it done half right.

I used the Package name, Display Name, and a host of other things and never found the right one. Then I thought, “let’s see what inside the manifest looks like”. That’s when it revealed itself. To do this, right click the manifest file in the Solution Explorer and click “view code”:

image

And blamo:

image

It’s kind of frustrating that this isn’t easily editable anywhere as ‘App’ is kinda stupid, but hey it only shows up here and in a META tag on my site so who cares. Slap ‘App’ in the Application-ID meta tag shown above and voila!

Hope that saved you some time!