There’s no limit to the number of LiveWhale Calendar widgets you can create—however, there may be cases where you find it more efficient to re-use one saved widget rather than creating many copies.

If you’re looking to show the same widget style across multiple groups—say, a “featured events” card design used on every department’s homepage—a Global widget already handles this for you (LWC 3.2.0+). When a user clicks “Get Code” on a Global widget, LiveWhale automatically scopes its results to whichever group it’s being used in (by adding &group= behind the scenes), so editors across campus can grab the same Get Code snippet and drop it in without needing to customize anything.

For other kinds of reuse—filtering by tag, excluding certain content, splitting results by date range, or anything beyond simple per-group scoping—you can still alter a widget’s criteria inline using data-options, without having to build a whole new widget.

In your widget code, find the string that looks like data-options=”id=123&format=html”. You can add almost any widget setting to that data-options string separated by ampersands. For example,

• data-options=”id=123&format=html&group=Music“
• data-options=”id=123&format=html&category=Performances&exclude_tag=Private“
• data-options=”id=123&format=html&start_date=2024-01-01“
• data-options=”id=123&format=html&tag=soccer|hockey|basketball“ (use | to separate multiple values)

You could use this to divide up the results of a single widget by date:

<h3>2023 Events</h3>
<div class="lwcw" data-options="id=123&format=html&start_date=2023-01-01&end_date=2023-12-31"></div>
<h3>2012 Events</h3>
<div class="lwcw" data-options="id=123&format=html&start_date=2022-01-01&end_date=2022-12-31"></div>

Note: Use the date format YYYY-MM-DD when providing start_date and end_date to avoid ambiguity. More about start_date and end_date formatting here.

Or you can use one saved widget across many different pages and groups:

<div class="lwcw" data-options="id=123&format=html&group=Academic Calendar"></div>
<div class="lwcw" data-options="id=123&format=html&group=Biology"></div>
<div class="lwcw" data-options="id=123&format=html&group=Chemistry"></div>

Using the above options, a number of LiveWhale Calendar schools choose to simply make one or two global widgets (a list view and a “featured” card view, say) and then add components to their main site CMS that lets editors select a widget style and filter by their chosen group or tag without ever having to copy/paste the HTML manually.

Important note: If you need to use an actual ampersand (&) in one of your data-options — for example, to give an embedded calendar the header “Upcoming Dates & Deadlines,” or get events from a group called “Chemistry & Biochemistry” — you must use the URL-encoded version %26, because ampersands are otherwise used to separate key/value pairs.

<div class="lwcw" data-options="id=123&format=html&header=Dates %26 Deadlines&group=Chemistry %26 Biochemistry"></div>

More about working with widgets.