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:

  1. A custom URL that will be used to launch your app.
  2. The app store ID / package that will handle the content.
  3. 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.

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 a webview with a menu item Open in {app name}, 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 they don't have it installed, the web page will be opened 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.

Mobile-Only and Don't Have Web Pages?

If your app doesn't have web pages, you can use Facebook's App Links Hosting API to host your App Links. This scenario is common if you have a mobile-only app.