---
title: "Carousel Tour Widget"
slug: "carousel-tour-widget"
updated: 2026-06-09T11:12:33Z
published: 2026-06-09T11:12:33Z
canonical: "docx.syndigo.com/carousel-tour-widget"
stale: true
---

> ## Documentation Index
> Fetch the complete documentation index at: https://docx.syndigo.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Carousel Tour Widget

| Mandatory Elements | Mandatory Attributes |
| --- | --- |
| 1. content 2. steps 3. step | 1. Ref (image- only if image element is present) 2. download (video-only if video element is present) 3. download (video-loop- only if video-loop element is present) |

**The following are the keypoints**:

- **<font-opacity>**  (step), **<text-width>** (step) will default to 100, when value is not sent or sent as empty or null.
- Below are the valid values for the position (step).
  - Left
  - Right
  - Center
- **<position>** (step) will default to Left when the value is not sent or sent as an empty or null or invalid value.
- **<font-background-color>** (step) and font-color (step) must be valid HEX color code.
- **<font-background-color>** (step) will default to #ffffff when the value is not sent or sent as an empty.
- <font-color (step)> will default to #000000 when the value is not sent or sent as an empty.
- Below are the valid values for the **<color-option>** (step).
  - BlackOverWhite
  - WhiteOverBlack
  - BlackNoBackground
  - WhiteNoBackground
  - Custom
- <color-option> (step) will default to BlackNoBackground when the value is not sent or sent as an empty or null or invalid value.</color-option>
- Below are the valid values for the **<text-position>** (step).
  - Left
  - Right
  - Center
- **<text-position>** (step) will default to Center when the value is not sent or sent as an empty or null or invalid value.
- Below elements will be ignored if it does not contain ref attribute.
  - download
  - snapshot
  - info-asset
- For valid attribute values refer Valid Tag Value section.
- **<tag>** (presentation) will default to Carousel when not sent.
- If the layout attribute under **<content>** tag is not sent, then the system will default it to SlideShow.
- Valid values for layout will be  

a. SlideShow  

b. StepByStep

#### XML

```
<feed updated="2021-05-17T05:00:00Z">
	<content-package id="12345678910" updated="2021-05-17T05:00:00Z">
		<name>Product 1</name>
		<description>This is product 1.</description>
		<brand>BrandXYZ</brand>
		<mpn>MPN-123456</mpn>
		<gtin>00012345678910</gtin>
		<msrp currency="USD">1,699.00</msrp>
		<sections>
			<section label="carousel">
				<presentation>
					<power-page title="Carousel Test"/>
					<tag>
						<![CDATA[About this brand]]>
					</tag>
				</presentation>
				<content template="carousel" layout="SlideShow">
					<steps>
						<step title="Image Carousel Step" reporting-code="ICS001" position="left" alternate-text="Alt 1" font-background-color="#ffffff" font-color="#000000" color-option="BlackOverWhite" font-opacity="100" text-width="100" text-position="Center">
							<description>
								<styled-text>
									<![CDATA[This is image carousel step.]]>
								</styled-text>
								<footnotes>
									<footnote>Footnotes will be shown at last of the Enhance content.</footnote>
								</footnotes>
							</description>
							<image ref="https://www.test.com/resources/img/12345678910/ImageCoroselStep.jpg" link="https://www.Test.com/" link-label="Label Test 1"/>
							<image ref="https://www.test.com/resources/img/12345678910/ImageCorosel2Step.jpg" link="https://www.Test.com/" link-label="Label Test 2"/>
						</step>
						<step title="Video Carousel Step" reporting-code="VCS001" position="right" alternate-text="Alt 2" font-background-color="#ffffff" font-color="#000000" color-option="BlackOverWhite" font-opacity="100" text-width="100" text-position="Center">
							<description>
								<styled-text>
									<![CDATA[This is video carousel step.]]>
								</styled-text>
								<footnotes>
									<footnote>Footnotes will be shown at last of the Enhance content.</footnote>
								</footnotes>
							</description>
							<video>
								<download ref="https://www.test.com/resources/img/12345678910/Video-carousel.mp4"/>
								<info-asset type="Captioning" language="en" ref="https://www.test.com/resources/img/12345678910/Video-carousel-CaptionEN.vtt"/>
								<info-asset type="Descriptions" language="en" ref="https://www.test.com/resources/img/12345678910/Video-carousel-DescriptionsEN.vtt"/>
								<info-asset type="Subtitle" language="en" ref="https://www.test.com/resources/img/12345678910/Video-carousel-SubtitleEN.vtt"/>
								<snapshot ref="https://www.test.com/resources/img/12345678910/Video-carousel-Snapshot.jpg"/>
							</video>
							<video>
								<download ref="https://www.test.com/resources/img/12345678910/Video-carouse2.mp4"/>
								<info-asset type="Captioning" language="en" ref="https://www.test.com/resources/img/12345678910/Video-carousel-CaptionEN2.vtt"/>
								<info-asset type="Descriptions" language="en" ref="https://www.test.com/resources/img/12345678910/Video-carousel-DescriptionsEN2.vtt"/>
								<info-asset type="Subtitle" language="en" ref="https://www.test.com/resources/img/12345678910/Video-carousel-SubtitleEN.vtt"/>
								<snapshot ref="https://www.test.com/resources/img/12345678910/Video-carousel-Snapshot2.jpg"/>
							</video>
						</step>
						<step title="Video Loop Carousel Step" reporting-code="VLCS001" position="left" alternate-text="Alt 3" font-background-color="#ffffff" font-color="#000000" color-option="BlackOverWhite" font-opacity="100" text-width="100" text-position="Center">
							<description>
								<styled-text>
									<![CDATA[This is video loop carousel step.]]>
								</styled-text>
								<footnotes>
									<footnote>Footnotes will be shown at last of the Enhance content.</footnote>
								</footnotes>
							</description>
							<video-loop>
								<download ref="https://www.test.com/resources/img/12345678910/Videoloop-carousel.mp4"/>
								<info-asset type="Captioning" language="en" ref="https://www.test.com/resources/img/12345678910/Videoloop-carousel-CaptionEN.vtt"/>
								<info-asset type="Descriptions" language="en" ref="https://www.test.com/resources/img/12345678910/Videoloop-carousel-DescriptionsEN.vtt"/>
								<info-asset type="Subtitle" language="en" ref="https://www.test.com/resources/img/12345678910/Videoloop-carousel-SubtitleEN.vtt"/>
							</video-loop>
							<video-loop>
								<download ref="https://www.test.com/resources/img/12345678910/Videoloop-carouse2.mp4"/>
								<info-asset type="Captioning" language="en" ref="https://www.test.com/resources/img/12345678910/Videoloop-carousel-CaptionEN2.vtt"/>
								<info-asset type="Descriptions" language="en" ref="https://www.test.com/resources/img/12345678910/Videoloop-carousel-DescriptionsEN2.vtt"/>
								<info-asset type="Subtitle" language="en" ref="https://www.test.com/resources/img/12345678910/Videoloop-carousel-SubtitleEN2.vtt"/>
							</video-loop>
						</step>
						<step title="Text Carousel Step" reporting-code="TCS001" position="right" alternate-text="Alt 4" font-background-color="#000000" font-color="#ffffff" color-option="WhiteOverBlack" font-opacity="100" text-width="100" text-position="Left">
							<description>
								<styled-text>
									<![CDATA[This is text loop carousel step.]]>
								</styled-text>
								<footnotes>
									<footnote>Footnotes will be shown at last of the Enhance content.</footnote>
								</footnotes>
							</description>
						</step>
					</steps>
				</content>
			</section>
		</sections>
	</content-package>
</feed>
```

#### Preview

![batch-content-delivery-carousel-tour-widget](https://cdn.document360.io/381abf0c-f631-4d76-a7c0-e955ad2c7aa6/Images/Documentation/batch-content-delivery-carousel-tour-widget.png?sv=2026-02-06&spr=https&st=2026-11-10T01%3A33%3A59Z&se=2026-11-10T02%3A33%3A59Z&sr=c&sp=r&sig=W3Rg%2FyiD5UB9h7pKvqPrbf1NUl7H0NXzIvmkrV1mICM%3D)