Custom API widgets, but with no code.

How it works

We've prepared the API to work based on HTML attributes.

Copy the form to your webflow or add the HTML attributes to a custom form.

Customize it as you wish.

3 simple steps.

Step_0: Campaign ID

Paste your Viral Loops Campaign ID to connect the form to your campaign.

Step_1: Viral Loops Snippet

Copy the Viral Loops <script> and paste it into the <head> of you page.
<script defer type="text/javascript" src="https://app.viral-loops.com/widgetsV2/core/loader.js"></script>

Step_2: Copy the Webflow sample form and customise it

Default

Example (try me)

Copy this default form element and customise it in your website editor.
Use the form to see the "sharing state". Inside Webflow, both states will be visible so you can customize them.

Join our waitlist

Custom Field

Example (try me)

Copy this form element and customise it in Webflow.
Use the form to see the "sharing state". Inside Webflow, both states will be visible so you can customize them.

Join our waitlist

Visible waitlist

Example (try me)

Copy this form element and customise it in Webflow.
Use the form to see the "sharing state". Inside Webflow, both states will be visible so you can customize them.

Join our waitlist

> Install the Viral Loops snippet.

Copy the Viral Loops <script> and paste it into the <head> of you page.
<script defer type="text/javascript" src="https://app.viral-loops.com/widgetsV2/core/loader.js"></script>

> Add the custom attributes to your joining state form.

<div
  data-vl-campaign-id="vU6nruxN4gLp1gptzaTwYqIXbJc"
  data-vl-container="join-stage"
  class="vl-loading-area"
>
 <h2>Join the campaign!</h2>
 <form data-vl-action="join-stage#join">
   <input
     data-vl-join-stage-target="input.email"
     type="email"
     placeholder="Enter your email"
   />
   <input
     data-vl-join-stage-target="input.firstname"
     type="text"
     placeholder="Enter your firstname"
   />
   <input type="submit" />
 </form>
</div>

Join our waitlist

> Add the custom attributes to your sharing state form.

<div
 data-vl-campaign-id="vU6nruxN4gLp1gptzaTwYqIXbJc"
 data-vl-container="sharing-stage"
>
  <div class="user-stats">
   <div>
     <span> Your position: </span>
     <h1
       data-vl-sharing-stage-target="user.ranking"
     />
  </div>
 <div>
   <span> Your referral count: </span>
   <h1
    data-vl-sharing-stage target= "user.referralCount"
   />
  </div>
 </div>
 <div class="referral-url">
   <span
     data-vl-sharing-stage-target="user.referralUrl"
   />    
   <button
     data-vl-sharing-stage-target="copyButton"
     data-vl-success-message="Copied!"
     data-vl-action="sharing-stage#copy"
    >
     Copy
   </button>
 </div>  
 
</div>

Use the force of word of mouth to turn your happy customers into brand ambassadors.

Referrals
Prelaunch
NEWSLETTER Growth
Giveaways