This component is a sidebar with the categories tree.
To update the categories components, you can link the sidebar to the categories component. This will either update this component when a category is clicked in the categories component, or update the categories component when this component is clicked.
How to create this component.
var categoriesSidebar = sdk.component('categoriesSidebar', target:String, options:Object);
By default, this component looks like this:
This is the HTML component. For example, the "#inbenta" target is:
<div id="inbenta"></div>
Available options to set in this component
Name | Type | Default | Description |
---|---|---|---|
firstLevelCategory | integer | 0 | Category to start the tree |
selectedCategory | integer | 0 | Active category |
loadCategoryOnClick | boolean | true | When a category is clicked load it in the component |
Default options object
{
firstLevelCategory: 0,
selectedCategory: 0
}
Methods can be used in this component.
Name | Description |
---|---|
setSelectedCategory(category: integer) |
Set the active category |
setFirstLevelCategory(category: integer) |
Set root category of the sidebar |
setCategoriesDataInterceptor(interceptor:function) |
Set a categories interceptor. |
This component does not have any subcomponents.
Events to listen on this component.
Name | Event data | Description |
---|---|---|
click | category |
Sent whether a category is clicked |
This component calls the API endpoint /tracking/events
to register a click event when a user clicks on a content.
Labels of this component. The default labels of each component can be rewritten in the sdk creation configuration.
Name | Default | Description |
---|---|---|
CATEGORIES_SIDEBAR_TITLE | Categories |
HTML for categories sidebar title |
Create sidebar and categories components and link them.
var categoriesSidebar = sdk.component('categoriesSidebar', '#sidebar');
var categoriesBreadcrumb = sdk.component('categoriesBreadcrumb', '#breadcrumb');
var categories = sdk.component('categories', '#categories');
categories.linkToCategoriesSidebar(categoriesSidebar);
categories.linkToCategoriesBreadCrumb(categoriesBreadcrumb);