npm install --save react-smartbanner
Remember to add following meta tags in your HTML page: (Use Facebook app as example)
<head>
<meta name="apple-itunes-app" content="app-id=284882215">
<meta name="google-play-app" content="app-id=com.facebook.katana">
<meta name="msApplication-ID" content="82a23635-5bd9-df11-a844-00237de2db9e">
<meta name="msApplication-PackageFamilyName" content="facebook_9wzdncrfhv5g">
<meta name="kindle-fire-app" content="app-id=B0094BB4TW">
<link rel="apple-touch-icon" href="icon.png">
<link rel="android-touch-icon" href="icon.png">
<link rel="windows-touch-icon" href="icon.png">
</head>
And React-SmartBanner component usage:
import React from 'react';
import ReactDOM from 'react-dom';
import SmartBanner from 'react-smartbanner';
ReactDOM.render(<SmartBanner title={'Facebook'} />, document.getElementById('content'));
key | default | description |
---|---|---|
daysHidden | 15 |
Days to hide banner after close button is clicked. |
daysReminder | 90 |
Days to hide banner after "VIEW" button is clicked. |
appStoreLanguage | (user's browser language) |
Language code for the App Store. |
title | '' |
App title. |
author | '' |
App author. |
button | 'View' |
Text on install button. |
storeText | {
ios: 'On the App Store',
android: 'In Google Play',
windows: 'In Windows store',
kindle: 'In Amazon Appstore'
} |
Store text (object). |
price | {
ios: 'FREE',
android: 'FREE',
windows: 'FREE',
kindle: 'FREE
} |
Price text (object). |
force | '' |
Force to display in specific device. ( android , ios , windows , kindle )
|
url | '' |
Custom URL. |
ignoreIosVersion | false |
Boolean to ignore the iOS version, so that the banner is also displayed on devices that support the native banner. |
MIT License