Customising Widget icons

This post looks at how to replace icons on the UserList with a style that better matches your site.

Standard icons

Standard icons

To start, if you don’t already have a Mibbit chat you can get one running in a few minutes by creating a widget and pasting the code into your web page.  All configuration is done through the Widget Manager including icons which we will look at now.

Mibbit has two sets of icons here: User icons (showing the type of connection) and Mode icons which show the status of each person. It’s important to know which you want to change, find or create a new icon and make sure you have a URL for it (upload it if needed).  Once you’re clear on the new style you want navigate to ‘Prefs’ and ‘Userlist’ in the Widget Manager and edit the user and mode icons entries, replacing the existing entry.

Once you save the new settings you can preview them here too. In this example we have used icons from the Crystal Clear set by Everaldo Coelho plus our very own frog!

If you’re looking for colors and text changes these are easy; use ‘prefs’ to set connect messages, change buttons and set the color of virtually any item on the whole config. Even custom Filters and prompt images can be configured with an upgrade.