Fur Affinity: Icons for Notification Area

Added by Wolfey@userstyles, Created: May 25, 2012, Updated: Nov 09, 2012
  • With the style applied (Generated screenshot)
  • Without the style applied (Generated screenshot)
"Submissions" Icon:
"Comments/Journals/Favorites/Watches" Icon:
"Private Message" Icon:
"Trouble Ticket" Icon:


This style will add icons beside each link in the notification area (to the left of the "Log Out" link), to make it easier to see what notifications you have. The icons are:
  • Submissions: Photograph
  • Comments/Journals/Favorites/Watches (All combined as one item): Book
  • Private Message: Note
  • Trouble Ticket: Bug
(Icons are from the http://famfamfam.com/lab/icons/silk/.)

More info
[UPDATE: 2012/11/09]
* The default icons can now be replaced with custom icons - for more information, see the "To replace any of the default icons..." section below.
To replace any of the default icons with a custom icon, type in the custom icon's "data:" URL in the "Provide your own" input field for the icon that you want to change. Custom icons should be exactly 16 pixels wide by 16 pixels high (to avoid causing image/text alignment issues when this style is applied to the page). Converting an icon to a "data:" URL can be done on pages such as http://www.greywyvern.com/code/php/binary2base64 (via URL) or http://www.miraclesalad.com/webtools/image_encoder.php (via file upload).
At this time, I can only confirm that "Submissions", "Journals" and "Notes" work as expected. I have noticed that an entry for "Trouble Tickets" exists in the HTML code for the notification area, but have not yet received that type of notification; as a result, I cannot confirm if the "Trouble Ticket" notification icon works.

If your notification area lists anything other than the above four links, please send me a private message that includes the following information:
  1. The letter used for the notification (e.g., "C").
  2. The type of notification that the letter represents (e.g., "C" represents a new comment).
  3. A screenshot of the notification area.
  4. A copy of the section of HTML code used for the notification area - an example is shown below:

    <li class="noblock">
    <a href="/controls/messages/">2 messages</a> (
    <a title="Submissions" href="/msg/submissions/">1S</a>,
    <a title="Comments, Journals, Favorites, and Watches" href="/msg/others/">1J</a>
    <a title="Notes" href="/msg/pms/"></a>
    <a title="Trouble Tickets" href="/msg/troubletickets"></a>
    ) </li>

    Your code will vary from this example; please make sure it includes everything from the "<li>" tag before the "# messages" link to the "</li>" tag after the closing parenthesis.
Once I have this information, I will be able to fix this style (if necessary). Thank you for any help that you can provide in regard to this style.

You should to add comment and rate the style.


+ Create discussion

Applies to:
CC0 1.0 Universal.
Wolfey@userstyles has waived all copyright and related or neighboring rights to Fur Affinity: Icons for Notification Area, to the extent allowed by law.

Related styles:

WARNING: This webware is not functioning properly. Please enable javascript in your browser and try again.