You can configure a carousel widget to display a rotating carousel of previews of articles and external content on a page.
Considerations
-
Default image: When an article does not have a featured image when added to a slide, an
image icon will be displayed over a transparent slide.
Who can do this?
- Workplace administrators
- Site administrators
Set up
- In the Page Builder, select
New Widget.
- From the Widget List, select the
handlebars beside the carousel widget to drag and drop the widget into place on the Page Builder. See Widget placement on a page for more information on placing widgets on a page.
- Select the placed widget's
Edit button.
- Review and make changes to the settings in the Configuration side panel. See the Settings section below for more details.
- In the Configuration side panel, select Save to apply your changes or Cancel to discard them.
- At the top of the Page Builder, select Save Page to save your changes.
Settings
| Setting | Description |
|---|---|
| (Optional) Select to expand and collapse the configuration side panel for increased visibility. | |
| Widget Title |
(Optional) Enter a title for the widget. The title appears as a heading above the widget's contents to provide context to the widget and structure the page's content with defined sections. When entering a title, you do so only for the currently selected language. To enter the title for other languages, select the desired language from the Widget Title Languages dropdown and enter a title in Widget Title. |
|
(Optional) Select a color swatch from the available color palettes or enter a hexadecimal color code for the title's text. The digital workplace's theme configures the availability of palettes and the use of hexadecimal colors. To enter a hexadecimal color code, use the format: |
|
|
(Optional) Select a color swatch from the available color palettes or enter a hexadecimal color code for the title bar's background color. The digital workplace's theme configures the availability of palettes and the use of hexadecimal colors. To enter a hexadecimal color code, use the format: |
|
| Widget Title Languages | (Optional) Select a language from the dropdown to enter a Widget Title translation in the currently selected language. |
| Make Widget Full Width | (Optional) Select to expand the widget to the full width of the available area or page. |
| Show Slide Markers | (Optional) Select to add navigation dots below the carousel for each slide, which users can select to navigate between slides. |
| Auto Play | (Optional) Select to turn on the carousel's auto-play, which cycles through the slides. |
| Auto Play Duration |
Available when Auto Play is selected Select an auto-play duration time. Options include:
|
| Add slide |
Select to choose a slide type. Options include:
The widget will display up to 5 slide types at a time, including any combination of URL slides, content slides, and feed slides. An individual feed slide can display 1 to 50 articles per feed slide added to the widget. For example, if you have two feed slides configured in the widget, it can display up to 100 articles from those two feeds. |
| (Optional) Select the handlebars beside a slide to drag and drop it in the widget configuration side panel to reorder the slides. | |
|
Slide: Search Content |
Available in Content Slide only Search for an article by the title and select it to auto-populate the Headline and URL fields. The slide's preview images are also populated from the article's featured image. Note A warning will be displayed if the article does not have a featured image: "This article does not have an image and will use a default image unless you upload a specific one for it."
To fix this error, you can choose an alternative article or add a featured image to the article itself. |
|
Headline text color |
Available in Content Slide and URL Slide (Optional) Select a color swatch from the available color palettes or enter a hexadecimal color code for the URL Slide's headline text color. The digital workplace's theme configures the availability of palettes and the use of hexadecimal colors. To enter a hexadecimal color code, use the format: |
|
Headline background color |
Available in Content Slide and URL Slide (Optional) Select a color swatch from the available color palettes or enter a hexadecimal color code for the URL Slide's headline's background color. The digital workplace's theme configures the availability of palettes and the use of hexadecimal colors. To enter a hexadecimal color code, use the format: |
|
Slide: Headline |
Available in Content Slide and URL Slide (Optional) Enter a headline to be displayed over the slide's image. For content slides, the headline is auto-populated with the article's title. |
|
Slide: URL |
Available in Content Slide and URL Slide Enter a valid URL address for the link to redirect the user to their browser. The article's URL is auto-populated for content slides.
|
|
Slide: Select a Feed |
Available in Feed Slide only Select the feed from which content will be displayed.
|
|
Slide: Number of Slides |
Available in Feed Slide only Select the number of articles to be displayed. Options include:
|
|
Slide: Test this link |
Available in Content Slide and URL Slide (Optional) Select to open the link in a new tab to test that the correct content is loaded. |
|
Slide: Open in New Tab |
Available in all slides (Optional) Select to allow the link to be opened in a new tab in the user's browser. |
|
Slide: Background Image |
Available in URL Slide only A background image is required to use a URL slide. Upload an image to appear as the background of the URL slide. For image specifications, see the Featured image article. To upload the image:
|
|
Slide: Image Alt Text |
Available in Content Slide and URL Slide (Optional) While optional, it is recommended to enter a brief description of the image to allow screenreaders to describe the slide's image for accessibility. |
|
Slide Description text color |
Available in Content Slide and URL Slide (Optional) Select a color swatch from the available color palettes or enter a hexadecimal color code for the slide description's text color. The digital workplace's theme configures the availability of palettes and the use of hexadecimal colors. To enter a hexadecimal color code, use the format: |
|
Slide Description background color |
Available in Content Slide and URL Slide (Optional) Select a color swatch from the available color palettes or enter a hexadecimal color code for the slide description's background color. The digital workplace's theme configures the availability of palettes and the use of hexadecimal colors. To enter a hexadecimal color code, use the format: |
|
Slide: Slide Description |
Available in Content Slide and URL Slide (Optional) Enter a secondary description that is displayed below the slide's headline or feed chip. |
|
Slide: Display Options |
Available in Content Slide and Feed Slide (Optional) Select checkboxes to hide different widget components from displaying for each slide. Options include:
All options are unchecked by default. |
|
Slide: Delete |
(Optional) Select to remove the slide from the carousel widget. |
Note:
The digital workplace theme determines the appearance of the widget's content unless a widget setting specifically overrides a theme setting. See the Theme article for more information.