textTextelementglobaltruetext-thumb200100TextTextFont FamilySelect a custom font - leave empty to use the default font.Font Colour%THEME_COLOR%0Fit to selectionFit to selected area instead of using the font size?0Use gradient for the text?Gradients work well with most fonts. If you use a custom font please ensure you test the Layout on your player.0Gradient1Font Size401Line Height1.21BoldShould the text be bold?00ItalicsShould the text be italicised?00UnderlineShould the text be underlined?00Text WrapShould the text wrap to the next line?11JustifyShould the text be justified?011Show OverflowShould the widget overflow the region?11Text Shadow0Should the text have a shadow?0Text Shadow Colour01Shadow X Offset101Shadow Y Offset101Shadow Blur201Horizontal Aligncenter1Vertical Aligncenter
]]>dateDateelementglobalnonetruedate-thumb30080DateDate Formatd/m/Y H:i:sLanguageSelect the language you would like to use.Font FamilySelect a custom font - leave empty to use the default font.Font Colour%THEME_COLOR%0Fit to selectionFit to selected area instead of using the font size?0Use gradient for the text?Gradients work well with most fonts. If you use a custom font please ensure you test the Layout on your player.0Gradient1Font Size401Line Height1.21BoldShould the text be bold?00ItalicsShould the text be italicised?00UnderlineShould the text be underlined?00Text WrapShould the text wrap to the next line?11Show OverflowShould the widget overflow the region?11Text Shadow0Should the text have a shadow?0Text Shadow Colour01Shadow X Offset101Shadow Y Offset101Shadow Blur201Horizontal Aligncenter1Vertical Aligncenter
{{date}}
]]> 0) {
globalDate.locale(properties.lang);
}
// Format the date with the dateFormat property
var formattedDate = globalDate.format(properties.dateFormat);
// Set the date div value to the formatted date
$(dateEl).html(formattedDate);
if (properties.fitToArea) {
// Set target for the text
properties.fitTarget = '.date';
var $selector = $(target).is('.global-elements-date') ?
$(target) : $(target).find('.global-elements-date');
// Scale text to container
$selector.xiboTextScaler(properties);
}
});
]]>date_advancedDate / Timeelementglobaltruedate-thumb38080Current date?Use the current date to be displayed.1OffsetThe offset in minutes that should be applied to the current date.1Custom DateInsert date to be displayed.0Date Formatd/m/Y H:i:sLanguageSelect the language you would like to use.Font FamilySelect a custom font - leave empty to use the default font.Font Colour%THEME_COLOR%0Fit to selectionFit to selected area instead of using the font size?0Use gradient for the text?Gradients work well with most fonts. If you use a custom font please ensure you test the Layout on your player.0Gradient1Font Size401Line Height1.21BoldShould the text be bold?00ItalicsShould the text be italicised?00UnderlineShould the text be underlined?00Text WrapShould the text wrap to the next line?11Show OverflowShould the widget overflow the region?1Text Shadow0Should the text have a shadow?0Text Shadow Colour01Shadow X Offset101Shadow Y Offset101Shadow Blur201Horizontal Aligncenter1Vertical Aligncenter
]]> 0) {
currentDate.locale(properties.lang);
}
$dateEl.html(currentDate.format(properties.dateFormat));
if (firstRun && properties.fitToArea) {
// Set target for the text
properties.fitTarget = '.date-advanced';
var $selector = $(target).is('.global-elements-date-advanced') ?
$(target) : $(target).find('.global-elements-date-advanced');
// Scale text to container
$(target).find('.global-elements-date-advanced').xiboTextScaler(properties);
firstRun = false;
}
}, 1000);
} else {
// Use custom date
// If date is not defined, don't render
if (String(properties.date).length === 0) {
$dateEl.html('');
return;
}
var customDate = moment(properties.date);
// Check for lang config
if (properties.lang !== null && String(properties.lang).length > 0) {
customDate.locale(properties.lang);
}
// Format the date with the dateFormat property
var formattedDate = customDate.format(properties.dateFormat);
// Set the date div value to the formatted date
$dateEl.html(formattedDate);
if (properties.fitToArea) {
// Set target for the text
properties.fitTarget = '.date-advanced';
var $selector = $(target).is('.global-elements-date-advanced') ?
$(target) : $(target).find('.global-elements-date-advanced');
// Scale text to container
$selector.xiboTextScaler(properties);
}
}
]]>global_imageelementglobalImageimagenone100100Image URLEnter the URL of the image you want to use.OpacityShould the image have some transparency? Choose from 0 to 100.100Scale typeHow should this image be scaled?containHorizontal AlignHow should this image be aligned?centercontainVertical AlignHow should this image be vertically aligned?middlecontainRound Border0Should the image have rounded corners?containBorder Radius201containImage Shadow0Should the image have a shadow?Image Shadow Colour1Shadow X Offset11Shadow Y Offset11Shadow Blur21
]]>global_library_imageglobal_imageelementLibrary Imageglobalnonetrue250250Replace ImageSelect an image from the Toolbox and drop here to replace this element.lineLineelementglobaltrueline-thumb250250Width5Colour%THEME_COLOR%StylesolidTip1 TypesquaredTip2 Typesquared
]]>rectangleRectangleelementglobaltruesquare-thumb250250Background Colour#1775F60Use gradient as background?0Gradient1Round Border0Should the rectangle have rounded corners?Border Radius201Show Outline1Should the rectangle have an outline?Outline Colour%THEME_COLOR%1Outline Width81
]]>circleCircleelementglobalcircle-thumb250250Background Colour#1775F60Use gradient as background?0Gradient1Fit to area0Should the shape scale to fit the element area?Show Outline1Should the circle have an outline?Outline Colour%THEME_COLOR%1Outline Width81
]]>ellipseEllipseelementglobalellipse-thumbtrue300200Background Colour#1775F6Show Outline1Should the circle have an outline?Outline Colour%THEME_COLOR%1Outline Width41
]]>triangleTriangleelementglobaltruetriangle-thumb250250Background Colour#1775F60Use gradient as background?0Gradient1Fit to area0Should the shape scale to fit the element area?Show Outline1Should the triangle have an outline?Outline Colour%THEME_COLOR%1Outline Width81
]]>pentagonPentagonelementglobaltruepentagon-thumb250250Background Colour#1775F60Use gradient as background?0Gradient1Fit to area0Should the shape scale to fit the element area?Show Outline1Should the pentagon have an outline?Outline Colour%THEME_COLOR%1Outline Width81
]]>hexagonHexagonelementglobaltruehexagon-thumb250250Background Colour#1775F60Use gradient as background?0Gradient1Fit to area0Should the shape scale to fit the element area?Show Outline1Should the hexagon have an outline?Outline Colour%THEME_COLOR%1Outline Width81
]]>placeholderPlaceholderelementglobalnonefalseplaceholder-thumb200100Placeholder typePlease select the type of placeholder to use as target.allPlaceholder: {{placeholderType}}
]]>image_placeholderImage Placeholdertrueglobal_imageelementglobalnonefalse200100Placeholder optionsPlaceholder messageImage PlaceholderPlaceholder message colour#333Font FamilySelect a custom font - leave empty to use the default font.Font Size22Placeholder background colour#f9f9f9