List

A widget that displays a collection of different content types.

<div
	data-component="fu-widget"
	data-content-type="list"
	data-content-id="your-list-id"
	data-list-classic-quiz-url="/quiz/{CONTENT_ID}/custom-path"
	data-list-personality-quiz-url="/personality-quiz/{CONTENT_ID}/custom-path"
	data-list-either-or-url="/either-or/{CONTENT_ID}/custom-path"
	data-list-poll-url="/poll/{CONTENT_ID}/custom-path"
	data-list-match-quiz-url="/match-quiz/{CONTENT_ID}/custom-path"
	data-list-items-count="10"
	data-list-items-per-row="2"
	data-list-widget-mode="LOAD_MORE"
></div>

Configuration Attributes

URL Configuration

You can specify URL patterns for each content type in the list widget either through global configuration (in the initialization) or through HTML attributes. These URL patterns should include {CONTENT_ID}, which will be replaced with the actual content ID when generating links. HTML attributes override the global URL configuration.

Widget Modes

• load-more (default): Shows data-list-items-count items with a "Load More" button that appends the next page
• limited: Shows exactly data-list-items-count items, with no Load More button
• paged: Splits the content into numbered pages of data-list-items-count and renders pagination controls

Values are case-insensitive and _ is accepted for -, so "LOAD_MORE" and "load-more" both work.

Playing an Item in Place

With no urls configured, clicking a card opens the item in a modal and plays it right there. Classic Quiz, Personality Quiz, Poll, Either/Or, Match Quiz and Event Game are all supported.

The played widget inherits the global configuration — themeOptions, leads, consents, the sign-in / additional / share CTAs, rulesDisplay, optionsLayout, showAnswerExplanations and the onFinish / onShare callbacks all apply exactly as they would to a standalone embed.

With some urls configured, cards of those types navigate instead. Cards whose own type has no URL are inert — they neither navigate nor open the modal.

Features

• Mixed content display of different widget types
• Responsive grid layout — data-list-items-per-row columns, dropping to one below 600px
• Click-through navigation, or playing the item in a modal when no URLs are set
• Load-more, limited and paged display modes
• Sponsor logos from each item's branding
• Support for all widget content types