From now on main document to be updated is here:

https://www.notion.so/culturesuite/Overview-of-Parameters-in-Parts-7a16f8548da14af1b34a553274659145


Please do not update this Freshdesk document any more. info underneath is just kept for reference




In the article How to find different parts and add/change parameters you will find more information on how to add parts to a page and add a parameter to that part. This manual is about the specific parameters to add and change and explains what it does.


TABLE OF CONTENTS


Common terms

You'll see the word "boxed" used in various cases in this document. "Boxed" means fitting the width of the website layout, which is smaller than the entire width of the screen on most devices.


Generic parameters

These are applicable to most if not all parts.


animations

Animations will subtly animate images as your mouse cursor moves over them. Values can be combined (e.g. "zoom twist" will both zoom and twist an image). The names should be self-explanatory: please experiment!

Possible values: 

zoom, twist, shadow, glow, saturate, desaturate, slide, skew, shift


pTop, pBottom

Padding above (pTop) or below (pBottom) the part. Typically "20px" or "30px", etc.
Possible values:

[a value in pixels]


bgColor

Background behind the part. Can be any kind of css shorthand for the background property: a simple color ("red"), a hexadecimal color ("#f00"), a background image, a gradient, or a combination.
https://developer.mozilla.org/en-US/docs/Web/CSS/background

Possible values:

[a background]


contentAlign

Most parts with text, like descriptions, teasers, etc. can be aligned to the left edge of the content box, whereas normally they are slightly centered.

Possible values:

[empty], left


Sticky parts 

Parts that are present on every page on the website. 


variant

Layout variant. By default it displays only shortcuts, and the full main menu is behind the "hamburger".

  • "suckerfish" has drop-down menus for each main menu item.
  • "shortcuts-unified" puts the logo, service menu and shortcuts all on one line.
  • "shortcuts-unified-alt" splits the shortcuts from the service menu. With the logo centered the shortcuts sit on one side, the service menu on the other.

Possible values:

[empty] (default), suckerfish, shortcuts-unified, shortcuts-unified-alt


suckerfishMode

Suckerfish variations.
Accepts a combination of values. By default it has the logo above the menu.

  • "unified" has the logo, menu and service menu on one line.
  • "on-top" keeps the full menu on top, even in combination with a showcase banner.
  • "small" means the sub-menu's aren't the full width.
  • "right" aligns the main menu to the right, underneath the service menu.

Possible values:

[empty] (default), unified, on-top, small, right


socials

Display social media icons in the menu.

Possible values:

[empty] (default), 1 or true


unfoldedMenu

Display menu items all folded out: all lower level menu-items are at once visible. The main menu is split into columns: to let the second column start with the 4th top-level item enter the number 4.

Possible values:

[a number]


showcaseBgColor

The color for the background behind a boxed showcase.

[#hexcode]


autoSlide

If the slideshow is enabled for the showcase banners, it's possible to set it to automatically go to the next slide after a number of seconds. Set the number of seconds (e.g. "4") in this parameter to enable this feature.

Possible values:

[a number]


showcaseProductions

Switch the header to showcase mode (e.g. transparent) on production detail pages. Be sure to set the production hero to the "showcase" variant.

Possible values:

true, false (default)


No parameters for this part.


Post footer

postFooter

Layout variant.

  • "boxedLeftRight" spreads the post-footer across the width of the page.
  • "fullWLeft" aligns all text to the left.
  • "fullWRight" aligns all text to the right.

Possible values:

boxedLeftRight (default), fullWLeft, fullWRight


fullWidth

Layout variant. If set to true, the sponsor footer will spread as wide as the screen.

Possible values:

[empty] (default), true (yes)


Parts

Parts that are used on various pages on the website.


Page hero

This part is also used for Theme and News detail pages.

 

variant

Layout variant. By default the header spreads the entire width of the screen and the title of the page is placed on top of the image. The flat variant places the title below the image (for increased readability). The other variants also control the positioning of the image to the title.

The people variant creates a centered profile image with the title underneath, in a style that matches the automated people detail pages.

Possible values:

[empty] (default), flat, image-left, image-right, fiftyfifty, people


bg

Image positioning and size.

Possible values:

[empty] (default), image_boxed


aspectRatio

Only when bg = image_boxed

Possible values:

[empty] (default), 16/9


video

Applies an auto-playing video, similar to the homepage showcase video. Does not work in combination with these variants: flat, fiftyfifty, image-left/right. Just provide the video url (Youtube, Vimeo).

Possible values:

[a url]


video_on_mobile

Video's don't reliably auto-start on mobile web browsers, and might be too slow to load on mobile connections. This parameter allows you to disable the video on mobile devices.

Possible values:

true (default), false


hideSubtitle / hideTeaser

Hide the line of text under the title. In some cases this might be a teaser, in others a subtitle.

Possible values:

true, false (default)


Media

Various layout options for single and multiple images in media galleries.

single

  • boxed: boxed
  • boxed_caption: boxed with text floating in a on top of the image
  • boxed_caption_below: boxed with a small caption underneath the image
  • boxed_caption_left: boxed with text on the left
  • boxed_caption_right: boxed with text on the right
  • boxed_content: full width with text on the left
  • boxed_content_flipped: full width with text on the right
  • fullW: full width
  • tile: a small single tile


Possible values:

boxed, fullW, boxed_caption, boxed_caption_left, boxed_caption_right, boxed_caption_below, boxed_content, boxed_content_flipped, tile


multi

  • fullW_grid33: full width grid 3 columns
  • fullW_grid50: full width grid 2 columns
  • fullW_slide: full width slideshow
  • masonry: 3 tiles
  • masonry_compact: 5 tiles
  • masonry_compact_full: 5 tiles full details
  • masonry_compact_notext: 5 tiles without text
  • masonry_four_tiles: 4 tiles
  • masonry_notext: 3 tiles without text
  • masonry_wide: 2 tiles


Possible values:

masonry, masonry_notext, masonry_compact, masonry_compact_notext, masonry_compact_full, masonry_wide, fullW_slide, boxed_slide, fullW_grid50, fullW_grid33


For multiple images in a slideshow the following parameters can also be used:


slideNrImg

The number of visible images in the slideshow.

Possible values:

[a number]


slideImgCenter

Sets wether the slides should be centered instead of left-aligned.

true, false (default)


Sets wether images should open in a lightbox if no link is provided (only applies to galleries with multiple images, single images never open in a lightbox).

true (default), false


crop

Determines if the image (for the tiles variants) is square, or has a landscape aspect ratio. All tiles except "5 tiles full details" default to square crops.

square, landscape



Audio/Video

variant

Sets the layout for the embedded multi-media part. By default it fits the box of the site, but it can also be set to be smaller, matching the width of the text column of a description part.

Possible values:

boxed (default), compact


Highlight banner

Can be used as a heading, a button, or a combination of both. 

Images are normally applied as a background, but you can select variants with an image on the left or right of the heading, for single images. For multiple images the implementation is the same as a media part and all the same "multi" parameters apply (refer to that part for details). 

variant

Possible values:

[empty] (default), image-left, image-right, hd-card


Welcome

showAvatar

Possible values:

true (default), false


hideVisitorTags

Possible values:

true, false (default)


Coming Soon

alwaysShowDay

Always show event dates (also if more events happen on the same day).

Possible values:

true, false (default)


bannerOnMobile

Display the banner also on smaller screens.

Possible values:

true, false (default)


dateLast

Show the date at the end, not at the start, of each event.

Possible values:

true, false (default)


excludeThemes

Exclude events that are in a certain theme, by theme ID. 

Possible values:

[a number], [multiple numbers separated by ;]


hideButton

Hide the "buy tickets" button.

Possible values:

true, false (default)


hideHistory

Hide events that have already started.

Possible values:

true, false (default)


hideTime

Hide the time of the event.

Possible values:

true, false (default)


showGenre

Display the genres of the events above the title of the event.

Possible values:

true, false (default)


indicateGenre

Display the genres of the events.

Possible values:

true, false (default)


indicateLocation

Display the location of the events.

Possible values:

true, false (default)


indicateTags

Display the tags of the events.

Possible values:

true, false (default)


list

List today + tomorrow + day after tomorrow, either in one list (all) or grouped by date (default). 

"Toggle" behaves like "all", but adds a theater/movie toggle button.

Possible values:

[empty] (default), all, toggle


max

Limit number of events in the initial list. Previously also as "limit".

Possible values:

[a number]


query

Add a filter query to the "view all" link

Possible values:

[?...]


showHallName

When indicating location include the name of the hall.

Possible values:

true, false (default)


showMovieSubtitle

Show the subtitle field for movies

Possible values:

true, false (default)


showPrices

Show prices per event

Possible values:

true, false (default)


toggleToMovies

Start "toggle" list with movies, not theater events.

Possible values:

true, false (default)


type

Display only a certain production type

Possible values:

all (default), default, movie, long_term


variant

Layout variant, "flipped" places the banner on the right instead of on the left. Also option for flat banner layout.

Possible values:

[empty] (default), flipped, flat




Events List, Event Slides

A list of events or productions, that you can filter by genres, locations, date range and production type. 


start

Start of the date range of events. If omitted will start today. The format is yyyy-mm-dd, e.g. 2023-12-31.

Possible values:

[a date]


end

End of the date range of events. The format is yyyy-mm-dd, e.g. 2023-12-31.

Possible values:

[a date]


pagination

Set this to true to disable pagination.

Possible values:

false (default), true


max

Limit the number of events per page. If omitted will use the default items per page as set in the control panel.

Possible values:

[a number]


production_type

Select the type of productions to display. If omitted will display all types.

Possible values:

[empty] (default), all, default, movie, longterm_event


locations

A comma-separated list of IDs of locations.

Possible values:

[a number]


locationselect

The ID of a single location, or "ownvenues" to select all locations that have the "own location" setting checked. Or "not_ownvenues" to select all other locations.

Possible values:

[a number], ownvenues, not_ownvenues


genre

Only include events with this genre, by ID of the genre.

Possible values:

[a number]


genres

A comma-separated list of one or more genres, by ID of the genre.

Possible values:

[a number]


themes

A comma-separated list of one or more themes, by ID of the theme.

Possible values:

[a number]


hideSupertitle, hideTags, hideGenres

Possible values:

true, false (default)


The Event Slides part has all the same options above, and also these:


variant

Layout options for the slideshow.

The value can be a combination of flat or default (default meaning text on top of the image) and boxed. By default the slider is not boxed (so it's full width of the screen) and flat (meaning text 

Possible values:

[empty] (default), default, flat (default), boxed


sliderStyle

Style options for the slideshow, currently supports enabling a "fade out" gradient overlay.

Possible values:

[empty] (default), fadeout


People

Provides an overview of people, for instance those with a role in a production or story. 


variant

The "variant" parameter controls all layout options. These are:

  • list: a flat textual list of people and their roles
  • featured: large page-wide cards of the people, with an image and their name and roles
  • grid: tiles with name, role and image of the people


The grid layout has several additional options, that can be combined.

  • flat: name and roles in a box underneath the image (instead of overlayed on top of the image)
  • 2, 3, 5: the number of tiles per row of the grid (on a large screen)
  • no-image: hide the images, but keep the grid layout and tile backgrounds

Possible values:

grid (default), list, featured, flat, 2, 3, 5, no-image

Example combinations of options:

grid flat 2

grid no-image 5


crop

Only for the flat variant. Determines if the image is square, or has a landscape aspect ratio.

Possible values:

square, landscape


clusters

A list of comma-separated cluster id's: only people in these roles will be displayed. All people will be displayed if the value is empty.

Possible values:

[a number],[a number]


hideHeading

Optionally hide the heading above the list, when using multiple people lists on a production detail page.

Possible values:

true, false (default)


Productions for People

A list of productions featuring one or more people using filtering by cluster and/or role.


clusters

A list of comma-separated cluster id's.

Possible values:

[a number],[a number]


roles

A list of comma-separated role id's.

Possible values:

[a number],[a number]


Expected Movies

For movie type productions without events.


production_type

Possible values:

movie


productionOnlyWithoutEvents

Possible values:

true, false (default)


FeaturedNews

To display the publication date, enable "news with date" in the control panel.


slideshow

Display as a slider.

Possible values:

true, false (default)


variant

Width of the slider: boxed or full width of the screen.

Possible values:

[empty] (default), boxed


The featured flexgrid or slider displays featured banners, news and events, and will automatically fill the configured grid with upcoming events.

The banners grid displays banners that are not featured. The styling of this grid matches the featured grid, but can also be differer


template

Possible values:

slider (default), flexgrid


displayType

Width of the grid: boxed or full width of the screen.

Possible values:

boxed (default), fullW (full width)


variant

Positioning of text underneath the image (flat) or on top of the image (default).

Possible values:

[empty] (default), flat


row1, row2, row3, row4, row5

Number of items per row, and the height of the row. For example: "2, 400".

Possible values:

[2 numbers, comma separated]


hideSupertitle

Hide the supertitle of events.

Possible values:

true, false (default)


genres

Display genres of events.

Possible values:

true, false (default)


ImagePosition

Display the image at the top of the card (default) or below the title (middle).

Possible values:

[empty] (default), middle


hideTags

Possible values:

true, false (default)


hideSupertitle

Possible values:

true, false (default)


Newsletter subscribe (and News)

The newsletter subscription banner. For legacy reasons also supports a short list of recent news items.


hideNews

To display only the newsletter subscription call to action.

Possible values:

true, false (default)


hideSignup

To display only the list of news items.

Possible values:

true, false (default)


inlineSignup

Instead of a call to action that opens a popup, use and inline form. Requires reCaptcha v3.

Possible values:

true, false (default)




Display a logo above the subscription call to action.

Possible values:

[a url]


Instead of using the Peppered newsletter subscriptions, link to somewhere else.

Possible values:

[a url]


wide

Wide layout variant (only works in combination with hideNews set to true).

Possible values:

true, false (default)


Stories

This part is also used for collections, when choosing to use stories from the collection.

max

Maximum items per page.

Possible values:

[a number]


pagination

Allows you to hide the pagination, e.g. if you just want a grid of recent stories.

Possible values:

true (default), false


variant

Change the positioning of text underneath the image (flat) or on top of the image (default).

Also allows you to select various layouts: grids ("grid" or "grid large") or sliders ("slider" or "slider-wide"). 

Possible values:

default, flat (default)


arrows

Change the style of the arrow for the slider by enabling a round background behind the arrow.

Possible values:

true, false (default)


content_type

To display stories from selected story types, enter the id's of the story type (comma separated).

[a number]


randomizeImages

Instead of using a standardized crop for all images, use the original image aspect ratio.

Possible values:

true, false (default)


firstLarge

Display the first story with a larger image. Requires the grid-large variant.

Possible values:

true, false (default)


filter

Display the the filter bar if there is one or more story type selected.

Possible values:

1 (default), 0


Event List

To change the visual appearance of events throughout the website, use the Event Cards control panel instead of parameters. Use the parameters to change the appearance in a particular context.

The main event overview should use the combined list and filters, for better performance. The sentence filter variant can also be used separately on the homepage.


For the events list

filters

Display the filter above the list, in the specified variant, or the default box.

Possible values:

false (default), true, sentence, simple, sidebar


context

Change the filter mode to the correct variant for courses.

Possible values:

[empty] (default), courses


variant

Select a layout variant for the events. 

Possible values:

[empty] (default), brochure, mobile-ish, topdate


brochureFields

If the brochure variant is selected, these fields are displayed in the popups. You can add multiple values, separated by commas.

Possible values:

teaser, description, description2, programme, credits, video, video2, poster


maxEvents

For the brochure cards: show this many events per production. Defaults to 4.

Possible values:

[a number]


dateType

Date range layout.

Possible values:

[empty] (default), horizontal


compact

Select production types to be displayed in smaller cards without an image.

Possible values:

[empty] (default), default, movie, long_term, all


thumbXL

Display a larger, wider image for each card (not for mobile-ish, brochure).

Possible values:

true, false (default)


gotoButton

When the list are placed on the homepage, instead of pagination display a button that will take the visitor to the full agenda overview page.

Possible values:

true, false (default)


hideTagline, hideTags, hideGenres, hideEndTime, hideLocation, hideHall

Possible values:

true, false (default)


layout

Choose a wider layout for some variants (only for brochure, mobile-ish).

Possible values:

[empty] (default), wide


noSubEvents

Don't display subevents in the agenda, go directly to the production page 

Possible values:

[empty] (default), 1


For the filters

filtersDefaultCollapsed

Default state for filters

Possible values:

true, false (default)


filter

A list of filters to display, a combination of the following (separated by spaces).

Possible values:

date, genre, theme, location, type


cityOption

Add a city filtering option. Requires the "sentence" variant. Set to the name of a city (e.g. "Den Haag").

Possible values:

[a text]


action

Normally applies the filters to the current page. You can also use a separate filters part on the homepage and direct it to the agenda overview when submitting.

Possible values:

[empty] (default), agenda


hideBday

Hide the user's birthday as a preset in the date picker.

Possible values:

true, false (default)


hideCity

In the list of location filters, do not display the location's city.

Possible values:

true, false (default)


customRange

Add a custom preset date range for the date picker.3 comma separated values: with a label, a start and an end date. E.g. Festival,2020-01-01,2020-02-01.

Possible values:

[label], YYYY-MM-DD,YYYY-MM-DD


datepickerAutosubmit

Automatically submit the filter after a selection in the date picker.

Possible values:

true, false (default)



Hero for production

dateType

Date range layout.

Possible values:

[empty] (default), horizontal


dateVariant

Select between having the date on the top, side (default), or no date at all.

Possible values:

[empty] (default), topdate, nodate


hideTags, hideGenres, hideEndTime, hideLocation, hideHall, hideKijkwijzer

Possible values:

true, false (default)


genreVariant

Places the genre above the supertitle.

Possible values:

top


bg

Width of the hero image or video: boxed ("image_boxed") or full width of the screen.

Possible values:

[empty] (default), image_boxed


showCredits, showTagline

Display credits or credits below the title info.

Possible values:

true, false (default)


movieFullInfo

Dsiplay full information, including locations, also for movies.

Possible values:

true, false (default)


toggleThreshold

If there are more events than this number, you need to press the "show events" button to make them visible.

Possible values:

[a number] (default: 1)


singleFolded

If it's a single event, fold the event information into the header.

Possible values:

true, false (default)


infoSupertitle

Show the "info" field of a single event as the "supertitle".

Possible values:

true, false (default)


variant

Layout variants. The showcase variant put the event information on top of the hero image, and shifts the hero image underneath the header (assuming that's empty).

Possible values:

[empty] (default), showcase


Themes (for a theme group)

 

themeListVariant

Text on top of the image (default) or below it (flat).

Possible values:

default, flat


variant

Further layout variants for the cards: alternating wide and small cards (default) only small cards (small) or horizontally split cards with text on one side and an image on the other (fiftyfifty).

Possible values:

[empty] (default), small, fiftyfifty



Description 1

The main description for productions, with a sidebar with meta information.

hideTags, hideThemes

Possible values:

true, false (default)


Flips sides with description and notes.

contentAlign

Possible values:

right (default), left



Quote

A different version of a quote variant.

variant

Possible values:

1 (default), 2


iFrame

IFrames will be blocked by cookie consent, unless the "trusted" parameter is set to true. 

trusted

Possible values:

true, false (default)



Content Library

When using the content library on the routes for the homepage or event detail pages, provide the id of a content library entry. Set the part to "raw" output if there is a custom implementation to render the content.

library_content_id

Possible values:

[a number]


raw

Possible values:

true, false (default)



Genres List

A list of buttons that can be used to filter the agenda overview based on genres.

limit

Limit the number of visible genres. By default 4 genres will be displayed.

Possible values:

[a number]



Various vertical cards (suggestions, featured slides, story slides)


imagePosition

Possible values:

[empty] (default), middle


hideTagline, showTagline

Possible values:

true, false


showGenres

Possible values:

true, false (default)


variant

Possible values:

default, flat (default)







Advanced features

The following can only be adjusted bij an Expert. Please contact us if you like to use these.

Hero images

Hero images are large images at the top of an information or event detail page, the image in a brochure popup, or large single images in a media gallery. "On-load" animations are directly visible as the page loads, or if the popup is opened.

A combination of the following is possible on hero images: 

  • Zoom or twist 
  • Saturate or desaturate 
  • Slide 
  • Fade-in 

For each type of hero image a selection of animations can be configured in the site's stylesheet. 

Common page headers like those for news, theme detail, and others, share the same stylesheet and therefore animations. Currently, it's possible to replace those animations via part parameters (e.g. to have a different animation for news pages), but only one animation can be selected that way: they can currently not be stacked via part parameters like they can in the stylesheet. 

Each information page can have its own animation via part parameters. 

Images

There are several (optional) images the site expects to be present in the client repository: 

  • /images/logo.svg : Logo for header (mandatory) 
  • /images/logo_mobile.svg : Logo for header on mobile (mandatory) 
  • /images/logo_showcase.svg : Separate logo for showcase headers (optional) 
  • /images/logo_order.svg : Separate logo for order process headers (optional)
  • /images/logo_mobile_showcase.svg : Separate logo for showcase headers on mobile (optional, only v1 header)
  • /images/logo_sticky.svg : Logo for sticky menu (optional) 
  • /images/logo_touch.svg : Logo for header when the normal logo doesn't fit next to the servicemenu (optional, only v1 header) 
  • /images/logo_schema.png: Logo for structured data: https://developers.google.com/search/docs/data-types/logo (a 112x112px PNG image)



Keywords: List of parameters which might be used in several parts route