Links

Vložení Apple tlačítka na web

Na této stránce se dozvíte, jakým způsobem si můžete tlačítko Apple vložit přímo na vaše stránky.

Prerekvizity

  • Při použití tlačítka pro Apple Messages for Business na stránkách je nutné se řídit Apple guidelines v sekci Using Messages for Business buttons
  • Mám stažené PNG/SVG soubory s vizuálem Apple z adresy Message with Your Customer - Apple Messages for Business a soubor je uložen na webserveru
  • Mám Apple Business ID (naleznete v Apple Register Portal v sekci Links → Copy ID)

Ukázková část kódu

url/to/apple/button - Cesta k PNG/SVG souboru tlačítka
appleBussinessID - Business ID, který byl přidělen od Applu (naleznete v Apple Register Portal v sekci Links → Copy ID)
Script v hlavičce - Script v hlavičce je použitý ke zjištění, zda zařízení podporuje Apple Messages for Business (!window.appleBusinessChat.isSupported())
appleSafezone div - Tento div je okolo tlačítka z toho důvodu, aby se splnila podmínka z Apple guidelines ohledně clear space tak, aby Apple widget nepřekrýval obsah vaší stránky neb aplikace - Maintain minimum clear space. The minimum amount of clear space required around the buttons is 10% of the button’s height. Don’t let other elements infringe on this space or occlude the button in any way.
<head>
...
<script src="https://static.cdn-apple.com/businesschat/start-chat-button/2/index.js"></script>
...
</head>
<body>
...
<style type="text/css">
#appleButton {
background: url("url/to/apple/button");
}
</style>
<div id="appleSafezone">
<div id="appleButton"></div>
</div>
<script type="text/javascript">
//Apple bussiness id a intent - intent se pouziva na routovani
const appleBussinessID = "your-business-id";
let appleIntent = "mluvii";
function openAppleMessagesForBusiness() {
console.log("Opening apple page");
const url = 'https://bcrw.apple.com/urn:biz:'+appleBussinessID+'?biz-intent-id='+appleIntent;
window.location.href = url;
};
(function () {
console.log("Setting onclick");
if (!window.appleBusinessChat.isSupported()) {
hideAppleButtons();
}else {
document.getElementById('appleButton').addEventListener('click', () => {openAppleMessagesForBusiness();});
}
})();
</script>
...
</body>
V případě zájmu o vyzkoušení nového kanálu Apple Messages for Business neváhejte kontaktovat svého obchodníka nebo nám napište přes chat na našem webu.