Show survey on demand

To trigger Website Overlay after certain user actions you should do three things:

  1. Set time delay to 0 in the Settings area.
  2. Start overlay hidden by setting Zenloop.isVisible = false;
  3. Call show overlay method Zenloop.showOverlay();

Full example:

<script id="zl-website-overlay-loader" async src="https://zenloop-website-overlay-production.s3.amazonaws.com/loader/zenloop.load.min.js?survey=<survey_hash_id>"></script>
<script>
  var Zenloop = window.Zenloop || {};
  Zenloop.isVisible = false;
</script>

<button onclick="Zenloop.showOverlay()">Show overlay</button>

Floating button example:

<script id="zl-website-overlay-loader" async src="https://zenloop-website-overlay-production.s3.amazonaws.com/loader/zenloop.load.min.js?survey=<survey_hash_id>"></script>
<script>
  var Zenloop = window.Zenloop || {};
  Zenloop.isVisible = false;
</script>
<style>
  .zl-wo-btn {
    right: -25px;
    cursor:pointer;
    padding:10px 10px 15px 10px;
    position: fixed;
    border-style: hidden;
    top: calc(50% - 15px);
    color: #fff;
    background-color:#53cdb5;
    transition: box-shadow .3s;
    transform: rotate(-90deg);
  }
</style>

<button class="zl-wo-btn" type="button" onclick="Zenloop.showOverlay()">Show overlay</button>

Result:

1746