How to add a button to the dashboard toolbar:
Follow the steps below to incorporate a button into the toolbar of a Sisense dashboard.
Open the dashboard to which you want to add a button to the toolbar.
Access the dashboard menu by clicking on the three dots located at the top-right corner of the dashboard and choose 'Edit Script.' This action will open the script editor for the dashboard in a new tab.
Copy and paste the script provided below into the script editor window of the dashboard. Feel free to customize the button's style, text, and add the desired action to be performed upon clicking.
dashboard.on('initialized', (sender, args) => {
const btnsHolder = $('.prism-toolbar__section--right .prism-toolbar__cell.btns-holder');
const newButton = document.createElement('button');
newButton.className = 'btn custom-btn';
newButton.style.backgroundColor = '#9b9ae6'; //background color
newButton.style.color = '#000000'; //font color
const buttonText = document.createElement('span');
buttonText.className = 'btn__text btn-text-sp2';
buttonText.textContent = 'New Button'; //Text to be displayed on button
newButton.append(buttonText);
$(newButton).on({
click: ({target}) => {
//Add action to be performed on button click
console.log('Button Clicked');
},
mouseenter: (event) => {
$(event.currentTarget).css('background-color', '#aeaddb'); //Background color on hover over
},
mouseleave: (event) => {
$(event.currentTarget).css('background-color', '#9b9ae6'); //Background color
}
});
btnsHolder.prepend(newButton);
})
Save the script, and refresh the dashboard to observe the newly added button in action.
