Adding App Links to Your Existing Web Content

You can add support for App Links to existing web content by defining metadata that details how apps link to your content. You need to add the following information to your URLs:

A custom URL that will be used to launch your app.
The app store ID / package that will handle the content.
The app name that will handle the content.

The metadata is added to your web page's <head> tag. The full list of options is documented at applinks.org.

App Links for Web are not supported for Catalog ads. Instead, see Product Deep Links.

iOS

As an example, let's say you've got a page located at:

http://example.com/applinks

In that page you need to add some metadata to describe what app will handle it:

<html>
<head>
    <meta property="al:ios:url" content="example://applinks" />
    <meta property="al:ios:app_store_id" content="12345" />
    <meta property="al:ios:app_name" content="Example App" />
    <meta property="og:title" content="example page title" />
    <meta property="og:type" content="website" />
    <!-- Other headers -->
</head>
<!-- Other HTML content -->
</html>
</head>

If the person has your app installed, the content at this URL appears in your app, as documented in our iOS documentation:

example://applinks?al_applink_data=%7B%22user_agent%22%3A%22Bolts%20iOS%201.0.0%22%2C%22target_url%22%3A%22http%3A%5C%2F%5C%2Fexample.com%5C%2Fapplinks%22%2C%22extras%22%3A%7B%22myapp_token%22%3A%22t0kEn%22%7D%7D

The url property must match a custom scheme that you've defined in your app's .plist file.

If the person doesn't have your app installed, App Links opens the App Store page for your app instead:

http://example.com/applinks?al_applink_data=%7B%22user_agent%22%3A%22Bolts%20iOS%201.0.0%22%2C%22target_url%22%3A%22http%3A%5C%2F%5C%2Fexample.com%5C%2Fapplinks%22%2C%22extras%22%3A%7B%22myapp_token%22%3A%22t0kEn%22%7D%7D

The url property is a URL that your app will receive when it's launched along with the other data JSON-encoded. Please see more about how to handle the incoming links in our iOS documentation or on the applinks.org site.

Android

As an example for Android, let's add support to

https://example.com/android

so it will be handled by your app. Just like with iOS we need to add Android-specific data that describes what app will handle the page:

<head>
    ...
    <meta property="al:android:url" content="sharesample://story/1234">
    <meta property="al:android:package" content="com.facebook.samples.sharesample">
    <meta property="al:android:app_name" content="ShareSample">
    <meta property="og:title" content="example page title" />
    <meta property="og:type" content="website" />
    ...
</head>

When someone clicks on the story, your Android app will be loaded with the target URI, as documented on the android documentation. In this example, the URI will be sharesample://story/1234.

The sharesample URI scheme represents your unique custom scheme. To set up your app to respond to this URI, you need to add an intent filter in your app's manifest file. The filter should respond to your custom scheme, handle implicit intents, and accept the ACTION_VIEW action. The example below adds a filter to the activity that handles the sharesample custom URL scheme:

<activity android:name=".MainActivity"
    android:label="@string/app_name" >
    ...
    <intent-filter>
        <action android:name="android.intent.action.VIEW" />
        <category android:name="android.intent.category.DEFAULT" />
        <data android:scheme="sharesample" />
    </intent-filter>
</activity>

Please see more about how to handle the incoming links in our Android documentation or on the applinks.org site.