Displaying a Gallery of Rotating Content

Content Layer

name	Page Info
id	278129461
class	watermark-layer

Content Column

name	Page Body
width	100.00001%
id	278129463

Content Block

background-color	transparent
name	Prompt
id	494677873
class	tight manual-prompt-flex

Adding a content carousel.

Content Block

name	Outcome
rich-link-hovers	true
id	1042866408
class	tight manual-outcome-flex

Using the Rotate Content macro, you can insert a revolving series of content of your choosing: text, images, videos, macros, or a combination of those — whatever you can normally insert into a block can be rotated with this method.

The macro pulls in content from a source page set up with a series of content blocks. The rotating display can occur randomly, or in a sequential order.

Content Block

name	Steps
rich-link-hovers	true
id	494842117
class	steps-block numbered manual-steps-flex

Create a Source Page.

This page can be located wherever you'd like. To keep it out of search, however, we recommend either stashing it in a resource space, or otherwise moving it outside the page tree hierarchy.

Add two or more blocks to the Source Page.

Try adding an image and some text to each block.

Identify or create a page for your gallery.

Insert the Rotate Content macro.

Insert your Source Page from Step 1 into the Page Title field.

This field defines the page from which to display block content.

HTML Wrap

class	docs-screenshot

Set display effects, such as delay, transition type, and control settings.

HTML Wrap

class	docs-screenshot

Content Block

padding	0
name	Example title
id	60595869

HTML Wrap

class	callout

Hover over the block below to see an example of scroll buttons used as controls.
Click through to see the Rotate Content macro in action.

ROTATING GALLERY EXAMPLE

Content Block

overflow	hidden
name	Display
id	58368699
class	clean
height	320px

Rotate Content

source-page	reference:Rotate Content Source
non-random	true
add-scroll-buttons	true

Content Block

name	Note
rich-link-hovers	true
id	495965127
class	manual-note-flex

Note

Extracting Content from Blocks

Background images are treated as part of the containing block. For this reason, if you would like block background images from your source page to also come through, you will not want to extract content — leave this box unchecked.
When not extracting content, remove any padding on the block containing the Rotate Content macro. This will ensure that the source content fills the macro block completely.

Block Design

A gallery block (containing the macro) will adjust in size to accommodate source block content of varying size, if a block height is not set. To solve for this:

use uniform content and/or block sizes on the source page
set a height on the containing gallery block

Content Block

name	Tip
rich-link-hovers	true
id	894522670
class	manual-tip-flex
collapsible	collapse

Tip

If using:

Replace me with something to note about this how-to entry that falls outside the scope of all other sections; and
Add the tight-bottom class to the next visible/non-collapsed block above this one to narrow the gap between the two blocks.

Content Block

name	Warning
rich-link-hovers	true
id	894530759
class	manual-warning-flex
collapsible	collapse

Warning

If using:

Replace me with something to note about this how-to entry that falls outside the scope of all other sections; and
Add the tight-bottom class to the next visible/non-collapsed block above this one to narrow the gap between the two blocks.

Content Block

name	Info
rich-link-hovers	true
id	894537203
class	manual-info-flex
collapsible	collapse

Info

If using:

Replace me with something to note about this how-to entry that falls outside the scope of all other sections; and
Add the tight-bottom class to the next visible/non-collapsed block above this one to narrow the gap between the two blocks.

Content Layer

background-color	$lightGrayColor
name	Related
id	888168050

Content Column

name	Related
width	100%
id	888168051

Content Block

rich-links-hide-description	true
rich-link-hovers	true
rich-links-columns	4
rich-links-vertical	true
rich-links-image-height	100px
rich-links-hide-site-icon	true
rich-links-details-padding	10px
name	Related
rich-links-enable	true
border-width	0
rich-links-details-alignment	left
rich-links-margin	20px 30px 0 0
id	496234544
class	related-block clean manual-related-flex

Page tree

Transform Your Digital Workplace

Industry Expertise

Inform Your Strategic Direction

Redefining Work

Documentation and Support

Versions Compared

Old Version 80

New Version 81

Key

Create a Source Page.

Add two or more blocks to the Source Page.

Identify or create a page for your gallery.

Insert the Rotate Content macro.

Insert your Source Page from Step 1 into the Page Title field.

Set display effects, such as delay, transition type, and control settings.

ROTATING GALLERY EXAMPLE

Platform

Company

Support

Brikit Services