With HapYak, You can load a dynamic URL from the video based on information submitted by a viewer.

For example, a viewer can enter a zip code and the web site they click through to will be personalized for the information entered.


To accomplish this, use the iframe annotation: 

Below is some sample code you can use to get started. Paste this into the Editor section of the iframe annotation.

<!doctype html>
  <style type="text/css">
    html, body {
      margin: 0; padding: 0;
      background-color: white;
      font-size: 1.3em;
    form {
      margin-left: 20px;
      margin-right: 20px;
    input {
      font-size: 1.3em;
  <!-- HTML code goes here -->
  <form id="form">
    <input type="text" id="zip" placeholder="enter zip code"/>
    <input type="submit"/>
  <script src="//code.jquery.com/jquery-2.1.1.min.js"></script>
  <script type="text/javascript" src="//d2qrdklrsxowl2.cloudfront.net/js/hapyak-iframe.js"></script>
<script type="text/javascript">
  (function () {
    $('#form').submit(function (e) {
      var zip = $('#zip').val();
      window.open('https://www.google.com/maps/place/' + zip);

Did this answer your question?