Battle Cards Infographic

The Battle Cards Infographic is a standard infographic with 6 sections that compares 3 different themes or topics. This full page experience is excellent for comparing different content side by side which will help your viewers understand how each topic can benefit their needs. The side navigation allows the viewer to switch and explore between different categories. Interactive reveals and animations will keep the viewer engaged as they navigate through the experience. At the end of the experience, the viewer has the option to contact your company.

COMPLEXITY

Low

TYPE

Infographic

USE CASE

Engagement

Features available

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

Animation

Animation will allow you to animate elements via microthemes. A use case for this would be to have a section fade up and in to a page via scroll.

Custom Code

Custom Code will allow you to add custom interactivity via Javascript or CSS to your creative. A use case for this would be this odometer script that is added to the page and text element in order to have it act as number counting up.

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.

To edit or apply an animation, first select the element you want to animate on the canvas.

Under the Animations panel, expand the (trigger) dropdown to select the animation trigger.

After selecting the animation trigger, expand the (choose) dropdown and choose the type of animation you want to apply to the element.

To edit the navigation, first select the Sticky Container on the canvas.

Within the sticky container, there are Containers with Text elements and Link elements. Each Link element will lead the user to another page in the creative. To edit the link location, select one of the Link elements.

Click under the Actions panel, to open up the action settings. 

Under the Go to Page tab, you can select, from the dropdown, which page the link will go to next.

 

Once you select the page, press OK to save.

Content structure

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.
Preview Content Writing TemplateOpens in a new window.

Best practices

Be sure to tag everything that is "taggable" so that you are able to review everything at a later time in your reports.

Reveals
Flows
Flowsteps
Links
Tabs
Accordions
Lightboxes
Rotators
Sliders

Your conversion point is the most important measurement in determining whether your creative is converting visitors. We recommend having one conversion point per creative. Here is the element and methods in which to set your conversions:

Links
Behaviors
Actions

Before going live with your experience, you want to run a final proofing process. This will review the experience as a whole, with any final revisions necessary. Here is the most important items to be reviewed before GoLive:

  • Review of any integrations
  • Review of conversion point
  • Review of tagging
  • External links are working correctly (opening in a new window)
  • Mark respondents as always new if used for conference or live event
  • Uncheck the robot meta directives (no archive, no follow, no index)
  • Remove path description (if applicable)
  • Make sure traffic source has been added to social share — og URL, twitter (create bit.ly), email share
  • Once live, debug on Facebook (if applicable)

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, so we can make sure to have this page constantly up to date.