New And Modified Widgets

In This Topic

New Wigets
Modified Widgets
Add filters when using Items_TileListing widget #10945
Additional Features for Items_TileListing widget

The following CyberStore e-commerce widgets have been added or modified in the 2.19 release:

New Wigets

No new widgets in 2.19.1.

Modified Widgets

Add filters when using Items_TileListing widget #10945

Additional Features for Items_TileListing widget

#11057	The CyberStore Compass and Modern themes have been updated to incorporate the newest features including new widgets for display and navigating Items, Categories and search results.
#11124	Uses Sitepages option of popup_detailLinkText to display the link in the popup, defaults to 'View Item Details'. Uses built in SITE_PATHS.application plus /product/ plus the item's stock code to generate the link dynamically. popup_showItemDetailLink to show the link or not. Defaluts to 'true'.
#11125	Dropdown options: 12, 24, 36, All if All is selected Paging turns to endless scrolling. If the number of returned results(# of items) is less than the dropdown selection then the paging goes away Will not display if endless scrolling is selected as sitePages option Overrides site Pages pageSize based on dropdown selection showPagesizeDropdown (true\|false)

#10833

includeItemsFromAllChildCategories: This option should be left at the default of true on a search page. Otherwise it should be set to false,
enableHighlightOnTileClick: this decides if an outline shows on the tile if clicked, defaults tofalse,
tileHeight: the visual height of each tile, shared across al435,
tileWidth: the visual width of each tile, shared across all tiles, defaults to 240,
tileMargin: the spacing between each tile, defaults to 12,
showScroll: allows scrolling of tile view, defaults to true,
tileFlowDirection: this represents the way the tiles are drawn to the page either ‘horizontal’ or defaults to 'vertical',
height: the height of all visible tiles on the page, defaults to 'auto',
overrideCategoryList: can be used to create a static listing page, defaults to PAGE_CATEGORY,
includeModels: whether to allow the tile view to display Models, defaults to true,
includeStockCodes: whether to allow the tile view to display Stock Codes, defaults to true,
includeSKUs: whether to allow the tile view to display SKUs, defaults to true,
getPricingInResults: switch to include pricing in the tile view results, defaults to false,
pageSize: the number of tiles viewable per page/scroll, if left at default takes the value from Console, defaults to -1,
showTileBorder: show a border around each individual tile, defaults to true,
pagerCSSClass: allows for customizing the look of the paging controls, options are ‘compact-theme’, ‘dark-theme’ and defaults to 'light-theme',
pagerButtonsDisplayedBeforeEllipsis: the number of visible page buttons before a new button with an ellipsis is displayed to allow easier navigation across many pages, defaults to 3,
previousPageButtonText: the text to display on the left most paging navigation button, defaults to 'Prev',
nextPageButtonText: the text to display on the right most paging navigation button, defaults to 'Next',
enableGoToPageByEllipsis: works with the pagerButtonsDisplayedBeforeEllipsis option, defaults to true,
pagerButtonsAtEdge: 2,
addToCartButtonText: 'Add to Cart',
popup_AddToCartBtnText:'Add to Cart',
addedToCartButtonText: 'Added to Cart',
addedToCartMessageTimeout: 10000,
addToCartErrorMessageText: null,
addToCartErrorMessageTimeout: 10000,
addToCartError: null,
learnMoreLinkText: 'Detail View',
qtyLabelText: 'Qty:',
pagingMode: 'endless',
enableItemQuickView: false,
popupWidth: 800,
popupModal: true,
popup_showStockCode: true,
popup_showName: true,
popup_showHeadline: true,
popup_showSubHeadline: true,
popup_showShortDescription: true,
popup_priceText: 'Price',
debugMode:true"

#10852

#10886

#10893

#10907

The CyberStore color dictionary created in the CyberStore Management console when setting up color typed Characteristics is stored in the CyberStore database. In addition, when colors are added to the dictionary, it will now be exported as a file that can be used on the client-side for custom UI needs. The file can be loaded as a standard script file which then makes an object array called COLOR_DICTIONARY available to client scripts.

A sample colorDictionary.js file can be seen below:

Copy Code

var COLOR_DICTIONARY = [{
    HexColor: "#00FF00   ",
    Name: "Electric green"
}, {
    HexColor: "#00FFFF   ",
    Name: "Aqua"
}, {
    HexColor: "#993366   ",
    Name: "Boysenberry"
}, {
    HexColor: "#CC99FF   ",
    Name: "Bright ube"
}, {
    HexColor: "#FF0000   ",
    Name: "Red"
}, {
    HexColor: "#FF00FF   ",
    Name: "Fuchsia"
}, {
    HexColor: "#FFFF00   ",
    Name: "Electric yellow"
}]

For more information about setting up custom colors in the Color Dictionary, review the Item Characteristic topic in the User's Guide.

Release Notes

Version 2.19 - April 15, 2020