JavaScript toolbar
Adding custom icons
The following example shows how to add custom image icons to your toolbar.
Source code
<html> <script src="https://jsuites.net/v3/jsuites.js"></script> <link rel="stylesheet" href="https://jsuites.net/v3/jsuites.css" type="text/css" /> <link rel="stylesheet" type="text/css" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" /> <div id='toolbar'></div> <script> <div id='toolbar'></div> jSuites.toolbar(document.getElementById('toolbar'), { container: true, items:[ { type: 'icon', content: '<img src="https://image.flaticon.com/icons/svg/95/95645.svg" width="24px;">', title: 'Message', onclick: function() { // Do something console.log('Message'); } }, { type: 'icon', content: '<img src="https://image.flaticon.com/icons/svg/733/733547.svg" width="24px;">', title: 'Facebook', onclick: function() { // Do something console.log('Facebook,etc'); } }] }) </script> </html>