Skip to main content
Model available for use in the Templates, and also returned by PureClarity in server-side requests

​
Properties

​
height
number
The height of the carousel
​
width
number
The width of the carousel
​
milliseconds
number
Milliseconds before auto scrolling, if active
​
autoscroll
boolean
Sets if autoscroll is on
​
isResponsive
boolean
Expands to width of container
​
isMaxWidth
boolean
If responsive, set’s if height and width is the max that the carousel should be
​
stopOnHover
boolean
If autoscroll is on, this sets if it should stop when mouse over
​
type
string
Set to carousel
​
html
string
[Serverside mode only] The html rendered version based on the Template
​
images
array
Array containing Carousel Image objects
​
images[].url
string
The location of the image file
​
images[].linkLocation
string
The link location of where a user should be taken if they click the image
​
images[].altText
string
The Alt Text attribute for the image
​
images[].showContent
boolean
Sets if text content should be shown
​
images[].content
string
The html content to overlay the image
​
images[].left
number
The left pixels for the content
​
images[].top
number
The top pixels for the content
​
images[].index
number
The index of the image in the array (zero based index)
​
images[].clickEvt
string
The JavaScript function to be executed on mouse down over the image elementImportant: This is required to track when users click through on a product. If this is omitted then reporting will be inaccurate

​
Example

{
  "height": 400,
  "width": 800,
  "milliseconds": 5000,
  "autoscroll": true,
  "isResponsive": true,
  "isMaxWidth": true,
  "stopOnHover": true,
  "type": "carousel",
  "html": "<div class='pc-carousel'>...</div>",
  "images": [
    {
      "url": "https://example.com/images/banner1.jpg",
      "linkLocation": "https://example.com/sale",
      "altText": "Summer Sale Banner",
      "showContent": true,
      "content": "<h2>Summer Sale - Up to 50% Off</h2>",
      "left": 50,
      "top": 100,
      "index": 0,
      "clickEvt": "_pc('track','click',{zoneid:'HP01',campaignid:'456'})"
    },
    {
      "url": "https://example.com/images/banner2.jpg",
      "linkLocation": "https://example.com/new-arrivals",
      "altText": "New Arrivals Banner",
      "showContent": false,
      "content": "",
      "left": 0,
      "top": 0,
      "index": 1,
      "clickEvt": "_pc('track','click',{zoneid:'HP01',campaignid:'457'})"
    }
  ]
}