Large

Trello Label Icon

By Paulo Amaral Last update Sep 4, 2013 — Installed 2 times.

Script Summary: Add a customizable icons to Trello labels, by color, using only CSS. No Javascript or jQuery required.



Version: 1.3

Copyright: 2013+, Paulo Amaral

Script homepage

Thumb Thumb Thumb Thumb

About this Userscript:
This userscript adds icons to Trello labels according to their colors, improving user experience and organization. You can use any PNG, JPG or GIF image of your choice, just follow the instructions at the code. 16x16 PNG or GIF icons are most recommended. There is no javascript or jQuery, only CSS manipulation!


IF YOU USE OR TRY IT, PLEASE GIVE ME YOUR FEEDBACK AND WRITE A REVIEW!!!


What do I need to do to install this on my computer?


Where do I change the icons?

At the first commands of the code, change these variables' values:

var imgGreen = "http://www.paulodev.com.br/images/icons/16x16/control_play_blue.png";
var imgYellow = "http://www.paulodev.com.br/images/icons/16x16/lightbulb_off.png";
var imgOrange = "http://www.paulodev.com.br/images/icons/16x16/user_go.png";
var imgRed = "http://www.paulodev.com.br/images/icons/16x16/error.png";
var imgPurple = "http://www.paulodev.com.br/images/icons/16x16/comment.png";
var imgBlue = "http://www.paulodev.com.br/images/icons/16x16/emotion_sleep.png";

There are some icons that you can use here: http://www.paulodev.com.br/images/icons/16x16/

(Credits of this incredible icon package: http://www.fatcow.com/free-icons)

Can I have different icons for different boards?

Sure! Install this script more than once, and change the "@match" url at the begin of the code!


How will the cards looks like?

Nice, don't you think?