เพราะว่างานที่ทำในส่วนของ mobile จะมี bar แสดงเพิ่มขึ้นมาด้านล่างต่างจาก desktop แต่เจ้า zopim มันจะอยู่ล่างสุดเหมือนกัน ทำให้ซ้อนกันดูไม่สวยและใช้งานได้ยากลำบาก จึงตั้งใจที่จะย้าย zopim ขึ้นไปอีก ที่สำคัญคือ จะเป็นตัวอย่างให้เรา config options ให้กับ zopim ที่มันใช้วิธีต่างจากเจ้าอื่น ๆ มาก
ถ้าต้องการให้ zopim ขึ้นมาจากล่างสุดในแนวตั้งสามารถใช้คำสั่ง
$zopim.livechat.button.setOffsetVerticalMobile;
ตัวอย่าง code
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>zopim: Mobile Vertical Offet</title>
<link href="vendor/twbs/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" type="text/css">
<style>
#footerMobile { background: #c00000; bottom: 0; height: 200px; position: fixed; width: 100%;
}
</style>
</head>
<body>
<div class="visible-sm visible-xs" id="footerMobile"> <h1>You're probably not using a phone.</h1>
</div>
<script> <!--Start of Zendesk Chat Script-->
window.$zopim|| (function (d,s) {var z=$zopim=function (c) {z._.push (c) },$=z.s=
d.createElement (s) ,e=d.getElementsByTagName (s) [0];z.set=function (o) {z.set.
_.push (o) };z._=[];z.set._=[];$.async=!0;$.setAttribute ("charset","utf-8") ;
$.src="https://v2.zopim.com/?4fGXBEtxEXbPQBeWWwFwSqG8wmMQ6pAT";z.t=+new Date;$.
type="text/javascript";e.parentNode.insertBefore ($,e) }) (document,"script") ;
<!--End of Zendesk Chat Script--> <!--Start of Zendesk Chat Script Custom Options -->
$zopim (function () { $zopim.livechat.button.setOffsetVerticalMobile (60) ;
}) ;
<!--End of Zendesk Chat Script Custom Options--> </script>
</body>
</html>
อ่านเพิ่มเติม$zopim.livechat.button