# 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**&#x20;
* Mám stažené PNG/SVG soubory s vizuálem Apple z adresy [Message with Your Customer - Apple Messages for Business](https://register.apple.com/resources/messages/messaging-documentation/message-with-customers) 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](https://mluvii.com).
