NOTE: This is a DistributionDocument. Please help maintain high quality documentation: This is a wiki, please fix the documentation if you find errors or incomplete content. Put questions and suggestions concerning the documentation of this topic in the comments section below. Use the Support web for problems you are having using TWiki.

TWiki Documentation Graphics

This is the TWiki icon library. The graphics can be used in topics and by web applications.

To show the icon, write this in any topic:

• <img src="%PUBURLPATH%/%TWIKIWEB%/TWikiDocGraphics/note.gif" alt="" width="16" height="16" />
• %PUBURL%/%TWIKIWEB%/TWikiDocGraphics/note.gif
  

Note: Click on an icon in the table below to change above example

Icon File Name Comment help.gif Help (write %H% or %Q%) note.gif Note bubble.gif Speech bubble tip.gif Tip / Idea (write %I% or %T%) warning.gif Warning / Important (write %X%) stop.gif Stop car.gif Car carparking.gif Car parking target.gif Blue target starred.gif Red star, highlight (write %S%) stargold.gif Gold star, favorites gear.gif Gear wrench.gif Wrench pencil.gif Refactor / Edit (write %P%) flag.gif Small flag unchecked.gif Unchecked box checked.gif Checked box choice-yes.gif Yes / Done (write %Y%) choice-no.gif No choice-cancel.gif Cancel minus.gif Minus in a circle plus.gif Plus in a circle updated.gif UPDATED, 56x8 (write %U%) new.gif NEW, 28x8 (write %N%) todo.gif TODO, 40x8 done.gif DONE, 40x8 closed.gif CLOSED, 42x12 more.gif More arrow, 42x12 detail.gif Detail arrow, 47x12 hand.gif Pointing hand arrowleft.gif Arrow red left arrowright.gif Arrow red right (write %M%) arrowup.gif Arrow red up arrowdown.gif Arrow red down arrowbleft.gif Arrow blue left arrowbright.gif Arrow blue right arrowbup.gif Arrow blue up arrowbdown.gif Arrow blue down arrowdot.gif Meet here (arrows to red dot) go_start.gif Go start go_fb.gif Go fast back go_back.gif Go back go_forward.gif Go forward go_ff.gif Go fast forward go_end.gif Go end wip.gif Work in progress rfc.gif Request for comments days.gif Days hourglass.gif Hour glass watch.gif Watch globe.gif Globe home.gif Home building.gif Building group.gif Group person.gif Person persons.gif Persons lock.gif Lock folder.gif Folder lockfolder.gif Locked folder lockfoldergray.gif Locked folder, gray locktopic.gif Locked topic locktopicgray.gif Locked topic, gray refreshtopic.gif Refresh topic viewtopic.gif View topic edittopic.gif Edit topic topicdiffs.gif Topic difference topicbacklinks.gif Topic back-links newtopic.gif New topic searchtopic.gif Search topic filter.gif Filter sort.gif Sort trash.gif Trash statistics.gif Statistics index.gif Index indexlist.gif Index list cachetopic.gif Cache topic printtopic.gif Print topic attachfile.gif Attach file download.gif Download save.gif Save notify.gif Notify mail.gif Mail changes.gif Changes recentchanges.gif Recent changes changes-small.gif Recent changes, 15x9 rss-feed.gif RSS feed, 36x14 rss-small.gif RSS feed, 15x9 xml-feed.gif XML feed, 36x14 xml-small.gif XML feed, 15x9 led-gray.gif Gray small LED led-red.gif Red small LED led-orange.gif Orange small LED led-yellow.gif Yellow small LED led-green.gif Green small LED led-aqua.gif Aqua small LED led-blue.gif Blue small LED led-purple.gif Purple small LED empty.gif Empty transparent 16x16 spacer line_ud.gif Line graph up-down line_lr.gif Line graph left-right line_udlr.gif Line graph up-down-left-right line_ur.gif Line graph up-right line_rd.gif Line graph right-down line_ld.gif Line graph left-down line_ul.gif Line graph up-left line_udr.gif Line graph up-down-right line_lrd.gif Line graph left-right-down line_udl.gif Line graph up-down-left line_ulr.gif Line graph up-left-right dot_ud.gif Dot graph up-down dot_lr.gif Dot graph left-right dot_udlr.gif Dot graph up-down-left-right dot_ur.gif Dot graph up-right dot_rd.gif Dot graph right-down dot_ld.gif Dot graph left-down dot_ul.gif Dot graph up-left dot_udr.gif Dot graph up-down-right dot_lrd.gif Dot graph left-right-down dot_udl.gif Dot graph up-down-left dot_ulr.gif Dot graph up-left-right

Note: Click on an icon to see how to use it

This is one way to create a library of common icons, accessible through user-defined TWikiVariables set in WebPreferences, or in TWikiPreferences for site-wide use. There are other approaches as well:

• TWiki's FileAttachments show their own icons for many different file types. As documented in TWikiVariables, write %ICON{"pdf"}% to show the icon
• The TWiki:Plugins/SmiliesPlugin, using a different short hand than %VARIABLES%, may be worth checking out for extended use
• The TWiki:Plugins/RenderListPlugin renders bullet lists with icons

-- TWiki:Main.PeterThoeny - 12 Feb 2005
-- TWiki:Main.MikeMannix - 16 May 2002

Comments & Questions about this Distribution Document Topic

Usage?

Hey Mike, I saw you adding these things on recently - looks nice...

We've done similar things with some of our webs, but rather than having lots of entries on the WebPreferences page, we tend to do this instead:

• Set PICTURE = http://twiki.org/p/pub/TWiki/WebDiagrams

Which we can then use like this:

• %PICTURE%/some-random-picture.gif
  

That way you can simply add more piccies as time goes by without having to add in more and more shortcuts...

-- TWikiGuest - 28 Sep 2001

This is a minor experiment, for a very few frequently used symbols. By defining each icon individually in WebPreferences, they can have really short variable names:

• %X% = - eXclamation [ALERT!]
• %H% = - [HELP]
• %T% = - [TIP]

The % signs are a bit awkward. The SmiliesPlugin, using colons - : - should be easier to type. Just substitute or add icons... Dunno if performance or short-term compatibility are current considerations. Hope the TopicVarsPlugin is friendly, works well. Being able to create libraries including variables, self-contained in topics would be great. -- MikeMannix - 16 May 2002

-- MikeMannix - 27 Dec 2001

Can we get rid of the 8831 gif? I also removed the "Set TLS" variable declaration in my WebPreferences.

-- JonReid - 09 Feb 2002

• It's not the prettiest thing. And the top edge highlight makes it look less than straight... I respectfully requested "Powered by TWiki" logos in the hi-rez face, 88x31, 48x48, couple others. Actually, an even smaller logo than 88x31 to place in the bottom (right side?) would be a good way to brand every page in a way that people probably wouldn't DELETE. BTW, why don't you like it? -- MikeMannix - 16 May 2002

Im a little confused why we would want multiple ways to include icons. Why not reuse the SmiliesPlugin and simply add the new icons there. Personally I think :help: is easier to remember than %H%, especially when you have multiple icons...

-- JohnCavanaugh - 01 Jul 2002

I don't think the SmiliesPlugin is part of the standard distribution. As long as that is the case, it makes sense to provide an alternate means. But you're right, for those who have installed SmiliesPlugin, I think it is easier.

-- JonReid - 12 Aug 2002

I've put the code necessary for including each image in a topic, including the shorthand variables where available.

This would be so much easier with ParameterizedVariables. Then I could do something like %GRAPHIC{"stargold" width="16" height="16"}% and it would be expanded to <img src="%PUBURL%/TWiki/TWikiDocGraphics/stargold.gif" alt="stargold.gif" width="16" height="16" />. In fact since the width and height of most graphics are 16x16 they could be the default values and they would onlt need to be specified if they are different, i.e. %GRAPHIC{"stargold"}% and %GRAPHIC{"todo" width="40" height="8"}%.

-- SamHasler - 11 Feb 2005

Good idea to show how to use the images. I changed it a bit since the table was getting rather wide, especially with the pattern skin's sidebar. The icons are now clickable, when clicked, the example on top changes to the selected icon. The example also shows preferences shortcuts, example .

-- PeterThoeny - 13 Feb 2005

Hey, that's great!

I wasn't happy with it myself and thought it might get changed back. That's a neat solution.

I fixed the dot image links, their examples were showing the line images.

-- SamHasler - 13 Feb 2005

Well spotted, thanks Sam!

-- PeterThoeny - 13 Feb 2005

Added variable %C% to TWikiPreferences for the closed icon TravisBarker add at his request.

-- SamHasler - 26 Aug 2005

I have redone the CLOSED image as a GIF which is somewhat better readable.

-- PeterThoeny - 26 Aug 2005

And I've moved the shortcut from TWikiPreferences to Codev.WebPreferences.

-- SamHasler - 26 Aug 2005

I think this powered bottons colection can be useful for some people (and it can use the Dakar %ICON{...}% variable):

-- AurelioAHeckert - 08 Nov 2005

The official logo for 80x15 size is T-logo-80x15.gif,

-- PeterThoeny - 08 Nov 2005

The official released version of this page (TWikiDocGraphics) pointed me to this page for updating the docs ... but this seems to be very outdated. I wanted to contribute a Visio icon (vsd.gif) that is missing, but I don't know where to post it.

-- PankajPant - 25 May 2007

create a new bug report and attach the icon there, please. we'll need the bug report in order to check the icon into svn should it be accepted. thanks!

-- WillNorris - 25 May 2007

Pankaj, post it here and I can twikinize it and take it into the icon collection.

-- ArthurClemens - 25 May 2007

Here you go:

-- PankajPant - 28 May 2007

I have added your icon to the svn repository.

-- ArthurClemens - 17 Jun 2007