Extending the user interface

Grease Monkey Scripts

A collection of Greasemonkey scripts to enhance the Bricolage UI.

delete-all.user.js: Add a “Select All” link to the Delete column of the Story Profile

briccatsearch.user.js: Search-as-you-type interface for “New Story” or “New Media” category lists.

Skinning Bricolage

Skin Bricolage using CSS stylesheets.

User Stylesheets

How to skin Bricolage with user stylesheets

All modern browsers support “user stylesheets,” stylesheets written by the browser user, in addition to “author stylesheets,” which are written by the site developer. Since these user stylesheets apply to every page a user visits, there needs to be a way to limit their scope.

Bricolage 1.10.2 now includes an ID on the BODY tag, which you can use when writing these custom stylesheets to override parts of the UI. This ID is in the form “bricolage_VHOST_SERVER_NAME”, where VHOST_SERVER_NAME is the value defined in bricolage.conf.

Unless VHOST_SERVER_NAME has been changed, it defaults to “bricolage__default_”.

To use this to write a user stylesheet, prepend all style rules with “#bricolage__default_”, e.g.

#bricolage__default_ td.workflowTab { background-color: #ff0000 ! important; }

— Marshall Roch

SkinFirefox – how to use the Firefox extension “Stylish” to skin Bricolage