Deep Link to Another Native App from Within Staffbase
Linking to external websites or even web-applications from the content within Staffbase is easy. Normal links lead users to a website or web app. To create normal linking, editors need to only provide the URL to the website content. Deep links on the other hand lead users to a native app. However, to generate the deep links to an app, you need to define certain parameters.
Parameter | Description |
---|---|
target-app | The URL scheme of the app, including the path to a specific page. For example, target-app:// or target-app://module/example |
ios-store-link | The link to download the target app from the Apple App Store. optional |
android-store-link | The link to download the target app from the Google Play Store. optional |
custom-install-link | The link to download the target app from the download page if the target app is not available in the public app stores. optional |
web-link | The link to open the web app. optional |
Based on the parameters you define in deep links, there are two types of deep links:
- Basic Deep Links: Lead users to a specific page of a mobile app, only if the app is installed.
- Deferred Deep Links:
Lead users to a specific page of a mobile app and if the app is not yet installed, they provide an alternative option.
There are two cases of such deferred deep links, where:
- Users are also provided options to the app store and the web app.
- Users are also provided with the option to a custom download, in case the app is not available in the public app store.
You can create a deep link by defining the deep link query parameters.
Prerequisites:
- The target app to which you want to deep link must have:
- A custom URL scheme for iOS devices
- A web URI intent for Android devices
If the target app to which you want to deep link does not already have a custom URL scheme and a web URI intent defined, you can define them for the app.
- Copy the code snippet and paste it to a browser console or some JavaScript runtime.
1var webURL = 'https://{{YourWebAppDomain}}'2var values = {3 'target-app': '',4 'ios-store-link': '',5 'android-store-link': '',6 'custom-install-link': '',7 'web-link': '',8}9var isFirst = true10webURL += '/external/openapp.html'11for (var prop in values) {12 if (values.hasOwnProperty(prop) && values[prop]) {13 webURL += isFirst ? '?' : '&'14 webURL += prop + '=' + encodeURIComponent(values[prop])15 isFirst = false16 }17}1819console.log(webURL);
-
Add the parameter values within the quotes based on the type of deep link you want to generate.
-
Execute the code in the console and retrieve the deep link.
You have generated the deep link. Now you can provide the deep link to editors of a news channel or a page in the Staffbase Studio.
Make sure to use the following link attribute class="default-link-handling" in order to have it handled by the device itself that will actually open the other app. When you are using our Links Plugin or Launchpad, make sure the link opens externally.
Google Apps (target app)
googlesheets://
googledocs://
googleslides://
googledrive://
googlegmail://
googlecalendar://
Microsoft Teams (target app, store links and web link)
https://app.staffbase.com/external/openapp.html?target-app=msteams%3A%2F%2F&ios-store-link=https%3A%2F%2Fapps.apple.com%2Fus%2Fapp%2Fmicrosoft-teams%2Fid1113153706&android-store-link=https%3A%2F%2Fplay.google.com%2Fstore%2Fapps%2Fdetails%3Fid%3Dcom.microsoft.teams%26hl%3Den%26gl%3DUS&web-link=https%3A%2F%2Fwww.microsoft.com%2Fen%2Fmicrosoft-teams%2Flog-in
Salesforce (target app, store links and web link)
https://app.staffbase.com/external/openapp.html?target-app=com.salesforce.chatter%3A%2F%2F&ios-store-link=https%3A%2F%2Fapps.apple.com%2Fus%2Fapp%2Fsalesforce%2Fid404249815&android-store-link=https%3A%2F%2Fplay.google.com%2Fstore%2Fapps%2Fdetails%3Fid%3Dcom.salesforce.chatter&web-link=https%3A%2F%2Flogin.salesforce.com
Workday (target app, store links and web link)
https://app.staffbase.com/external/openapp.html?target-app=workday%3A%2F%2F&ios-store-link=https%3A%2F%2Fapps.apple.com%2Fus%2Fapp%2Fworkday%2Fid316800034&android-store-link=https%3A%2F%2Fplay.google.com%2Fstore%2Fapps%2Fdetails%3Fid%3Dcom.workday.workdroidapp%26hl%3Den&web-link=https%3A%2F%2Fwww.workday.com