This section provides a step by step illustration on How to Add a pop up trigger to HTML Website.
Launching a Calculator or a Quiz in a Popup on an HTML Website
1. Determine where do you want to place the popup trigger visually
For this illustration we have created a sample HTML website and we wish to put our calculator pop up trigger in the highlighted portion below.
Button/ Link to be added in area shown in image here.
2. Determine where the popup trigger goes in the code
In the code editor, figure out where your button needs to go according to the code convention. For instance, in the following illustration, our button is supposed to be right below the end of div enclosing our dummy text.
Outgrow Embed Test Home About Us TEST OUTGROW PAGE // Popup trigger goes here //
3. Paste the code copied from Outgrow for Calculator
Remember the code we copied from the CONFIG section on Outgrow for Launching Calculator in a Popup ?
Paste that right where you want your calculator to go.
Outgrow Embed Test Home About Us TEST OUTGROW PAGE
4. Calculator popup on HTML website is ready
You have successfully added a Calculator pop up on your HTML Website. Your final output should look like this.
Go on, give it a try and click on “LAUNCH CALCULATOR”
This will open your calculator in a pop up.