--- title: How to add Olark Live Chat to a video description: You can use HapYak to insert an Olark live chat tab in a video. Here's how. image: https://www.olark.com/img/uploads/hapyak1.jpg --- - [Interested in live chat? Check out Olark.](https://www.olark.com/) [![Speak: A Blog by Olark](https://blog.olark.com/hubfs/speak-logo-300-01.png "Speak: A Blog by Olark")](https://blog.olark.com) # How to add Olark Live Chat to a video By [Diego Torres-Palma](https://blog.olark.com/author/diego-torres-palma) ![hapyak1.jpg](https://www.olark.com/img/uploads/hapyak1.jpg) *Today's post comes from Diego Torres-Palma at [HapYak](http://www.hapyak.com/). HapYak has developed a technique for adding the Olark chat box to videos, so you can chat with customers inside of any video:*  (^press play)  ## Here's how you do it... First, [go here](https://www.olark.com/install) and grab you embed code. If you're already using Olark, you'll recognize this as the code you previously posted above the `` tag on your site. (If this is your first time installing Olark, follow the helpful instructions [in this video](https://www.olark.com/help/html). ![olarkcode2.png](https://www.olark.com/img/uploads/olarkcode2.png) Next, you'll need to head over to HapYak, login to the portal, and open your project. (If you're not a current HapYak user you can [sign up for free](https://hapyak.chargify.com/h/3441233/subscriptions/new?utm_source=olark&utm_medium=tutorial&utm_campaign=olarkblog) (no credit card required). Once you have your project open, you'll create an iframe annotation. You can paste in the code as you see in this image: ![hapyakinsert.png](https://www.olark.com/img/uploads/hapyakinsert.png) Finally, you'll want to position the iframe at the bottom of the video, then set the start time and duration. Typically the start time is 0 ("zero") and the duration is "entire video."  ![starttime.png](https://www.olark.com/img/uploads/starttime.png) ## A few things to keep in mind: An Olark chat box in a video is helpful, but it functions slightly different than a normal chat box. Here's how: - Customers will appear to be viewing a page URL that starts with `https://hapyak_uploads...` rather than a page on your site. - If the customer navigates to a new page, the chat will not follow them to the new page. They will have to come back to the video to continue the conversation, or open a new chat tab on your site. - Your operator will not have the ability to see that the customer has navigated to a new page, and they will not be able to see what page they've gone to. With live chat in video, as with any changes to your site or your chat box functionality, be sure to brief your support, service and/or sales team first. You may get visitors who want to chat specifically about what's in the video, but might not specifically say they are currently looking at the video. Hope that helps, and leave any questions you might have in the comments section! ### Read more posts by [Diego Torres-Palma](https://blog.olark.com/author/diego-torres-palma) [![Olark logo](https://blog.olark.com/hubfs/assets/logos/Olark-logo-navy.svg)](https://blog.olark.com/) - [Facebook](https://www.facebook.com/olarklivechat/) - [Twitter](https://twitter.com/olark) - [Instagram](https://www.instagram.com/olarklivechat/) - [LinkedIn](https://www.linkedin.com/company/469764/) ## Product - [Pricing](https://olark.com/pricing) - [Chatbots](https://olark.com/chatbot-copilot) - [Features](https://olark.com/features) - [Integrations](https://olark.com/integrations) - [Product Tour](https://olark.com/product-tour) - [Case Studies](https://olark.com/case-studies) ## Support - [FAQ](https://olark.com/faq) - [Help Center](https://olark.com/help) - [Getting Started](https://olark.com/help/getting-started) - [Troubleshooting](https://olark.com/categories/tool-tip) - [JavaScript API](https://olark.com/api) ## About - [Our Team](https://olark.com/about) - [Our Values](https://olark.com/values) - [Become an Olarker](https://olark.com/jobs) ## Connect with us - [Speak: The Olark Blog](https://blog.olark.com) - [Our Guide to Remote Work](https://olark.com/tips-for-remote-managers-and-going-remote-guide) - [Become a Partner](https://olark.com/partners) - [Contact Us](https://olark.com/contact) - [Terms of Service](https://olark.com/tos) - [Privacy Policy](https://olark.com/privacy-policy) - [GDPR](https://olark.com/help/gdpr) - [Accessibility](https://olark.com/ada-accessible-live-chat) - [Statement of Action](https://blog.olark.com/statement-of-solidarity-and-action-for-black-lives-matter) [![Olark logo](https://blog.olark.com/hubfs/assets/logos/Olark-logo-navy.svg)](https://blog.olark.com/) - [Facebook](https://www.facebook.com/olarklivechat/) - [Twitter](https://twitter.com/olark) - [Instagram](https://www.instagram.com/olarklivechat/) - [LinkedIn](https://www.linkedin.com/company/469764/) Product - [Pricing](https://olark.com/pricing) - [Chatbots](https://olark.com/chatbot-copilot) - [Features](https://olark.com/features) - [Integrations](https://olark.com/integrations) - [Product Tour](https://olark.com/product-tour) - [Case Studies](https://olark.com/case-studies) Support - [FAQ](https://olark.com/faq) - [Help Center](https://olark.com/help) - [Getting Started](https://olark.com/help/getting-started) - [Troubleshooting](https://olark.com/categories/tool-tip) - [JavaScript API](https://olark.com/api) - [Hire an Expert](https://olark.com/partners-directory) About - [Our Team](https://olark.com/about) - [Our Values](https://olark.com/values) - [Become an Olarker](https://olark.com/jobs) Connect with us - [Speak: The Olark Blog](https://blog.olark.com) - [Our Guide to Remote Work](https://olark.com/tips-for-remote-managers-and-going-remote-guide) - [Become a Partner](https://olark.com/partners) - [Contact Us](https://olark.com/contact) - [Terms of Service](https://olark.com/tos) - [Privacy Policy](https://olark.com/privacy-policy) - [GDPR](https://olark.com/help/gdpr) - [Accessibility](https://olark.com/ada-accessible-live-chat) - [Statement of Action](https://blog.olark.com/statement-of-solidarity-and-action-for-black-lives-matter) {{ footer\_js() }} {{ js\_integration\_body\_end() }} {% if "hs-landing-page" in builtin\_body\_classes %} {% endif %} {% endif %} [Questions? Feedback?](https://www.olark.com/site/9353-431-10-4341/contact) powered by [Olark live chat software](http://www.olark.com?welcome)