I tried many app banner for my app, apple meta tags and android meta tags but nothing worked. iOS meta tags worked fine but the android meta tags are worse and time wasting as they are totally misleading docs. Then i came to know about smartbanner.js npm package.
I need to add meta tags of smartbanner as mentioned in the docs then i need to add 2 smartbanner.js files in the. And all these should be inside <head> tag of the app. So I did the same thing.
See code below for header.js file ->
<head>
... <sly data-sly-test.disableScripts="${pageProperties.disableScripts}" />
<title data-sly-test="${!pageModel}">
${pageModel.metaTitle}
</title>
<meta name="title" content="${pageModel.metaTitle}" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="apple-itunes-app" content="app-id=7887, app-argument=https://apps.apple.com/app/app_id">
<!-- Start SmartBanner configuration -->
<meta name="smartbanner:title" content="Smart Application">
<meta name="smartbanner:author" content="SmartBanner Contributors">
<meta name="smartbanner:price" content="FREE">
<meta name="smartbanner:price-suffix-apple" content=" - On the App Store">
<meta name="smartbanner:price-suffix-google" content=" - In Google Play">
<meta name="smartbanner:icon-apple" content="icon.png">
<meta name="smartbanner:icon-google" content="icon.png">
<meta name="smartbanner:button" content="VIEW">
<meta name="smartbanner:button-url-apple" content="https://apple_app_url">
<meta name="smartbanner:button-url-google" content="https://play.google.com/store/apps/details?id=com.google_app_id">
<meta name="smartbanner:enabled-platforms" content="android,ios">
<meta name="smartbanner:close-label" content="Close">
<!-- End SmartBanner configuration -->
<link rel="stylesheet" href="./smartbannerFiles/smartbanner.min.css">
<script src="./smartbannerFiles/smartbanner.min.js"></script>
<sly data-sly-test="${disableScripts}">
<meta name="google-site-verification" content="abckjasnaklsjn" />
</sly>
<link
rel="manifest"
href="/etc.clientlibs/manifest.json"
/> .....
</head>
I pasted the 2 files smartbanner.min.css and smartbanner.min.js from the npm smartbanner.js code itself.
Not really sure, if i just need to give the path of these 2 files in the app along with the meta tags then what is the need to install this banner package? And If this is not the way to implement (Like pasting these 2 min files) then how should I implement this package?
I just want to show the App Banner for android users, Either use any official meta tags or any npm package, any suggestion would be helpful, please help me sort this out.
NOTE : I Can't see any banner not even any error from the above code.