The White Paper with Quizzes is an interactive experience that contains six chapters with mini quizzes along the way. This experience features quizzes using flows, micro-animations, odometer counters, tabs, reveals, accordions, and flows with anchoring. This template is great for breaking down large content by turning them into engaging interactive components.

  • Type: White Paper
  • Complexity: Medium
  • Use case: Brand Awareness

Features available

Here are the major features, abilities, and interactive elements used in this template.

  • Accordions
  • Anchors
  • Animations
  • Flow
  • Odometer Counter
  • Reveal
  • Tabs

How-to use

Here is a helpful guide on how to handle all the major features, abilities, and interactive elements available to make the most out of this template.

>> Framing screenshots

Accordions

Step 1: To edit the accordion titles select the Accordion container on the canvas.

Step 2: Under the Variables panel expand the accordion sections you would like to edit. Update the accordion title by editing the Label.

Step 3: To edit or add content within the accordion section, select the accordion section on the canvas.

Step 4: Edit or add content within the section by double clicking on the elements within it.

Anchors

Step 1: To add an anchor select the final destination element the user should be sent to.

Step 2: On the top right corner of the edit panel select the anchor icon and give the anchor a name.

Step 3: Select the element that should take the user to the final destination element when they select it.

Step 4: Select the +Behaviors panel  and expand the Scroll To section. From the (no target) dropdown select the anchor name of the final destination element and assign a tag.

Step 5: To edit or change the final destination, select the element that should take the user to the destination.

Step 6: Select the Behaviors panel, under the Scroll To section, update the anchor to the new anchor of the final destination.

Animations

Step 1: To edit or to add an animation, first select the element you want to animate on the canvas. 

Step 2: Under the Animations panel, expand the (trigger) dropdown, and select an animation trigger. 

Step 3: After selecting the animation trigger, another (choose) dropdown will appear. Expand the second dropdown to select the type of animation you want to apply. 

Step 4: To remove an existing animation, click on the X to the right of the blue animation tag. 

Flow

Step 1: To update the content within your Flow, begin by selecting it on the canvas.

Step 2: Within the Flow, locate the first Flow Step at the top. You can edit the contents within the container, add content, or remove all of the content from the Flow Step.

Step 3: To edit the flow step transition, layout, or add arrows/progress bar select the flow and navigate to the micro themes. Expand the Others tab and select Flow then select the transition. 

Odometer Counter

Step 1: To edit the Odometer Counter, select the text element on the canvas.

Step 2: Double click to open the text editor and then navigate to the Standard Text at the top left of the editor.

Step 3: Update the data-val=”33” to the new value. 

Reveal

Step 1: To edit when the reveal container will appear, first select the Reveal element on the canvas. 

Step 2: Under the Variables panel, you can choose to change the Reveal type and when the reveal will appear by selecting from the options listed. 

Step 3: The reveal options in the Micro-themes allow for different transition and overlay stylings.

Tabs

Step 1: To edit the tab titles select the Tabs container on the canvas.

Step 2: Under the Variables panel expand the tab sections you would like to edit. Update the tab title by editing the Label.

Step 3: To edit or add content within the tab section, select the tab section on the canvas.

Step 4: Edit or add content within the section by double clicking on the elements within it.

Content Writing Template

Here is the content structure’s template to make it easier for you when providing content guidelines or creating the copy for this template, from understanding the content structure to getting to know the amount of words needed to each text piece.

Related templates

If you like this template, you might want to check out these other similar models.

Have a question?

Still have questions or are facing troubles when handling this template? Please do not hesitate to send any additional questions to [email protected], so we can make sure to have this article constantly up to date.

Share this: