%META:TOPICINFO{author="PeterThoeny" date="1077756660" format="1.0" version="1.25"}%
---+ TWiki Documentation Graphics

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:
	* In any topic, write =%<nop>PUBURL%/%<nop>TWIKIWEB%/%TOPIC%/help.gif= to show the %PUBURL%/%TWIKIWEB%/%TOPIC%/help.gif icon
	* The TWiki:Plugins/TopicVarsPlugin lets you set variables in any topic, not just in WebPreferences, for use in the same topic
	* The TWiki:Plugins/SmiliesPlugin, using a different short hand than =<nop>%VARIABLES%=, may be worth checking out for extended use
	* __Related:__ TWiki's FileAttachments show their own icons for many different file types. As documented in TWikiVariables, write =%<nop>ICON{"pdf"}%= to show the %ICON{"pdf"}% icon

In this example, <nop>%TOPIC% - this topic - acts as the icon library. Graphics are uploaded and displayed. Then, the paths are set in [[TWiki.TWikiPreferences#DocGraphics]] for site-wide access. You can also create individual library pages in each web. And you don't have to restrict yourself to graphics: Preferences Variables can include text and links to any type of file.

| *Icon* | *File Name* | *Comment* |
|  <img src="%ATTACHURLPATH%/help.gif" alt="help.gif"  width="16" height="16"  />  | =help.gif= | Help  |
|  <img src="%ATTACHURLPATH%/tip.gif" alt="tip.gif"  width="16" height="16"  />  | =tip.gif= | Tip / Idea |
|  <img src="%ATTACHURLPATH%/warning.gif" alt="warning.gif"  width="16" height="16" />  | =warning.gif= | Warning / Important |
|  <img src="%ATTACHURLPATH%/stop.gif" alt="stop.gif"  width="16" height="16"  />  | =stop.gif= | Stop |
|  <img src="%ATTACHURLPATH%/target.gif" alt="target.gif"  width="16" height="16"  />  | =target.gif= | Blue target |
|  <img src="%ATTACHURLPATH%/pencil.gif" alt="pencil.gif"  width="16" height="16"  />  | =pencil.gif= | Refactor / Edit |
|  <img src="%ATTACHURLPATH%/choice-yes.gif" alt="choice-yes.gif"  width="16" height="16"  />  | =choice-yes.gif= | Yes / Done |
|  <img src="%ATTACHURLPATH%/choice-no.gif" alt="choice-no.gif"  width="16" height="16"  />  | =choice-no.gif= | No |
|  <img src="%ATTACHURLPATH%/choice-cancel.gif" alt="choice-cancel.gif"  width="16" height="16"  />  | =choice-cancel.gif= | Cancel |
|  <img src="%ATTACHURLPATH%/updated.gif" alt="updated.gif"  width="56" height="8"  />  | =updated.gif= | Updated |
|  <img src="%ATTACHURLPATH%/new.gif" alt="new.gif"  width="28" height="8"  />  | =new.gif= | New |
|  <img src="%ATTACHURLPATH%/starred.gif" alt="starred.gif"  width="16" height="16"  />  | =starred.gif= | Highlight (positive) |
|  <img src="%ATTACHURLPATH%/stargold.gif" alt="stargold.gif"  width="16" height="16"  />  | =stargold.gif= | Favorites (gold star) |
|  <img src="%ATTACHURLPATH%/arrowright.gif" alt="arrowright.gif"  width="16" height="16"  />  | =arrowright.gif= | Moved to... |
|  <img src="%ATTACHURLPATH%/arrowdot.gif" alt="arrowdot.gif"  width="16" height="16"  />  | =arrowdot.gif= | Meet here (arrows to red dot) |
|  <img src="%ATTACHURLPATH%/wip.gif" alt="wip.gif"  width="16" height="16"  />  | =wip.gif= | Work in progress |
|  <img src="%ATTACHURLPATH%/rfc.gif" alt="rfc.gif"  width="16" height="16"  />  | =rfc.gif= | Request for comments |
|  <img src="%ATTACHURLPATH%/days.gif" alt="days.gif"  width="16" height="16"  />  | =days.gif= | Days |
|  <img src="%ATTACHURLPATH%/hourglass.gif" alt="hourglass.gif"  width="16" height="16"  />  | =hourglass.gif= | Hour glass |
|  <img src="%ATTACHURLPATH%/watch.gif" alt="watch.gif"  width="16" height="16"  />  | =watch.gif= | Watch |
|  <img src="%ATTACHURLPATH%/globe.gif" alt="globe.gif"  width="16" height="16"  />  | =globe.gif= | Globe |
|  <img src="%ATTACHURLPATH%/folder.gif" alt="folder.gif"  width="16" height="16"  />  | =folder.gif= | Folder |
|  <img src="%ATTACHURLPATH%/viewtopic.gif" alt="viewtopic.gif"  width="16" height="16"  />  | =viewtopic.gif= | View topic |
|  <img src="%ATTACHURLPATH%/edittopic.gif" alt="edittopic.gif"  width="16" height="16"  />  | =edittopic.gif= | Edit topic |
|  <img src="%ATTACHURLPATH%/topicdiffs.gif" alt="topicdiffs.gif"  width="16" height="16"  />  | =topicdiffs.gif= | Topic difference |
|  <img src="%ATTACHURLPATH%/topicbacklinks.gif" alt="topicbacklinks.gif"  width="16" height="16"  />  | =topicbacklinks.gif= | Topic back-links |
|  <img src="%ATTACHURLPATH%/newtopic.gif" alt="newtopic.gif"  width="16" height="16"  />  | =newtopic.gif= | New topic |
|  <img src="%ATTACHURLPATH%/searchtopic.gif" alt="searchtopic.gif"  width="16" height="16"  />  | =searchtopic.gif= | Search topic |
|  <img src="%ATTACHURLPATH%/printtopic.gif" alt="printtopic.gif"  width="16" height="16"  />  | =printtopic.gif= | Print topic |
|  <img src="%ATTACHURLPATH%/attachfile.gif" alt="attachfile.gif"  width="16" height="16"  />  | =attachfile.gif= | Attach file |
|  <img src="%ATTACHURLPATH%/home.gif" alt="home.gif"  width="16" height="16"  />  | =home.gif= | Home |
|  <img src="%ATTACHURLPATH%/changes.gif" alt="changes.gif"  width="16" height="16"  />  | =changes.gif= | Changes |
|  <img src="%ATTACHURLPATH%/notify.gif" alt="notify.gif"  width="16" height="16"  />  | =notify.gif= | Notify |
|  <img src="%ATTACHURLPATH%/mail.gif" alt="mail.gif"  width="16" height="16"  />  | =mail.gif= | Mail |
|  <img src="%ATTACHURLPATH%/empty.gif" alt="empty.gif"  width="16" height="16"  />  | =empty.gif= | Empty transparent 16x16 spacer |
|  <img src="%ATTACHURLPATH%/line_ud.gif" alt="line_ud.gif"  width="16" height="16"  />  | =line_ud.gif= | Line graph up-down |
|  <img src="%ATTACHURLPATH%/line_lr.gif" alt="line_lr.gif"  width="16" height="16"  />  | =line_lr.gif= | Line graph left-right |
|  <img src="%ATTACHURLPATH%/line_udlr.gif" alt="line_udlr.gif"  width="16" height="16"  />  | =line_udlr.gif= | Line graph up-down-left-right |
|  <img src="%ATTACHURLPATH%/line_ur.gif" alt="line_ur.gif"  width="16" height="16"  />  | =line_ur.gif= | Line graph up-right |
|  <img src="%ATTACHURLPATH%/line_rd.gif" alt="line_rd.gif"  width="16" height="16"  />  | =line_rd.gif= | Line graph right-down |
|  <img src="%ATTACHURLPATH%/line_ld.gif" alt="line_ld.gif"  width="16" height="16"  />  | =line_ld.gif= | Line graph left-down |
|  <img src="%ATTACHURLPATH%/line_ul.gif" alt="line_ul.gif"  width="16" height="16"  />  | =line_ul.gif= | Line graph up-left |
|  <img src="%ATTACHURLPATH%/line_udr.gif" alt="line_udr.gif"  width="16" height="16"  />  | =line_udr.gif= | Line graph up-down-right |
|  <img src="%ATTACHURLPATH%/line_lrd.gif" alt="line_lrd.gif"  width="16" height="16"  />  | =line_lrd.gif= | Line graph left-right-down |
|  <img src="%ATTACHURLPATH%/line_udl.gif" alt="line_udl.gif"  width="16" height="16"  />  | =line_udl.gif= | Line graph up-down-left |
|  <img src="%ATTACHURLPATH%/line_ulr.gif" alt="line_ulr.gif"  width="16" height="16"  />  | =line_ulr.gif= | Line graph up-left-right |
|  <img src="%ATTACHURLPATH%/dot_ud.gif" alt="dot_ud.gif"  width="16" height="16"  />  | =dot_ud.gif= | Dot graph up-down |
|  <img src="%ATTACHURLPATH%/dot_lr.gif" alt="dot_lr.gif"  width="16" height="16"  />  | =dot_lr.gif= | Dot graph left-right |
|  <img src="%ATTACHURLPATH%/dot_udlr.gif" alt="dot_udlr.gif"  width="16" height="16"  />  | =dot_udlr.gif= | Dot graph up-down-left-right |
|  <img src="%ATTACHURLPATH%/dot_ur.gif" alt="dot_ur.gif"  width="16" height="16"  />  | =dot_ur.gif= | Dot graph up-right |
|  <img src="%ATTACHURLPATH%/dot_rd.gif" alt="dot_rd.gif"  width="16" height="16"  />  | =dot_rd.gif= | Dot graph right-down |
|  <img src="%ATTACHURLPATH%/dot_ld.gif" alt="dot_ld.gif"  width="16" height="16"  />  | =dot_ld.gif= | Dot graph left-down |
|  <img src="%ATTACHURLPATH%/dot_ul.gif" alt="dot_ul.gif"  width="16" height="16"  />  | =dot_ul.gif= | Dot graph up-left |
|  <img src="%ATTACHURLPATH%/dot_udr.gif" alt="dot_udr.gif"  width="16" height="16"  />  | =dot_udr.gif= | Dot graph up-down-right |
|  <img src="%ATTACHURLPATH%/dot_lrd.gif" alt="dot_lrd.gif"  width="16" height="16"  />  | =dot_lrd.gif= | Dot graph left-right-down |
|  <img src="%ATTACHURLPATH%/dot_udl.gif" alt="dot_udl.gif"  width="16" height="16"  />  | =dot_udl.gif= | Dot graph up-down-left |
|  <img src="%ATTACHURLPATH%/dot_ulr.gif" alt="dot_ulr.gif"  width="16" height="16"  />  | =dot_ulr.gif= | Dot graph up-left-right |

-- TWiki:Main.PeterThoeny - 29 Jan 2004 %BR%
-- TWiki:Main.MikeMannix - 16 May 2002

%META:FILEATTACHMENT{name="help.gif" attr="" comment="Help" date="1001637645" path="C:\02_TWikiDocs\help.gif" size="130" user="MikeMannix" version="1.1"}%
%META:FILEATTACHMENT{name="tip.gif" attr="" comment="Tip" date="1007360101" path="C:\02_TWikiDocs\tip.gif" size="123" user="MikeMannix" version="1.2"}%
%META:FILEATTACHMENT{name="warning.gif" attr="" comment="Warning" date="1001637707" path="C:\02_TWikiDocs\warning.gif" size="138" user="MikeMannix" version="1.1"}%
%META:FILEATTACHMENT{name="pencil.gif" attr="" comment="Pencil" date="1018768623" path="C:\DATA\pencil.gif" size="172" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="choice-yes.gif" attr="" comment="Green checkmark - DONE" date="1021532287" path="C:\02_TWikiDocs\choice-yes.gif" size="82" user="MikeMannix" version="1.2"}%
%META:FILEATTACHMENT{name="updated.gif" attr="" comment="Updated" date="1018768662" path="C:\DATA\updated.gif" size="317" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="new.gif" attr="" comment="New" date="1018768672" path="C:\DATA\new.gif" size="167" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="starred.gif" attr="" comment="Star" date="1018768688" path="C:\DATA\starred.gif" size="128" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="arrowright.gif" attr="" comment="Red arrow to right" date="1018768726" path="C:\DATA\arrowright.gif" size="81" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="viewtopic.gif" attr="" comment="View topic" date="1036034850" path="C:\Data\Temp\viewtopic.gif" size="904" user="PeterThoeny" version="1.2"}%
%META:FILEATTACHMENT{name="edittopic.gif" attr="" comment="Edit topic" date="1036034837" path="C:\Data\Temp\edittopic.gif" size="931" user="PeterThoeny" version="1.2"}%
%META:FILEATTACHMENT{name="newtopic.gif" attr="" comment="New topic" date="1043200306" path="C:\Data\Temp\newtopic.gif" size="158" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="searchtopic.gif" attr="" comment="Search topic" date="1042874143" path="C:\Data\Temp\searchtopic.gif" size="192" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="printtopic.gif" attr="" comment="Print topic" date="1042874157" path="C:\Data\Temp\printtopic.gif" size="147" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="attachfile.gif" attr="" comment="Attach file" date="1042874171" path="C:\Data\Temp\attachfile.gif" size="193" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="home.gif" attr="" comment="Home" date="1047017417" path="C:\Data\Temp\home.gif" size="172" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="changes.gif" attr="" comment="Changes" date="1047017437" path="C:\Data\Temp\changes.gif" size="167" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="notify.gif" attr="" comment="Notify" date="1047103200" path="C:\Data\Temp\notify.gif" size="183" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="stop.gif" attr="" comment="Stop" date="1051155739" path="C:\Data\Temp\stop.gif" size="895" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="watch.gif" attr="" comment="Watch" date="1051159775" path="C:\Data\Temp\watch.gif" size="925" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="wip.gif" attr="" comment="Work in progress" date="1055022570" path="C:\Data\Temp\wip.gif" size="155" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="rfc.gif" attr="" comment="Request for comments" date="1055022645" path="C:\Data\Temp\rfc.gif" size="177" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="days.gif" attr="" comment="Days" date="1055022662" path="C:\Data\Temp\days.gif" size="125" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="hourglass.gif" attr="" comment="Hour glass" date="1055022919" path="C:\Data\Temp\hourglass.gif" size="128" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="stargold.gif" attr="" comment="Favorites" date="1064988628" path="C:\Data\Temp\stargold.gif" size="180" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="empty.gif" attr="" comment="Empty transparent 16x16 spacer" date="1069116309" path="C:\Data\Temp\empty.gif" size="100" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="line_ud.gif" attr="" comment="Line graph up-down" date="1069726077" path="line_ud.gif" size="114" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="line_lr.gif" attr="" comment="Line graph left-right" date="1069726092" path="line_lr.gif" size="105" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="line_udlr.gif" attr="" comment="Line graph up-down-left-right" date="1069726105" path="line_udlr.gif" size="116" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="line_ur.gif" attr="" comment="Line graph up-right" date="1069726118" path="line_ur.gif" size="111" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="line_rd.gif" attr="" comment="Line graph right-down" date="1069726136" path="line_rd.gif" size="106" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="line_ld.gif" attr="" comment="Line graph left-down" date="1069726148" path="line_ld.gif" size="106" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="line_ul.gif" attr="" comment="Line graph up-left" date="1069726161" path="line_ul.gif" size="111" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="line_udr.gif" attr="" comment="Line graph up-down-right" date="1069726180" path="line_udr.gif" size="115" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="line_lrd.gif" attr="" comment="Line graph left-right-down" date="1069726206" path="line_lrd.gif" size="111" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="line_udl.gif" attr="" comment="Line graph up-down-left" date="1069726219" path="line_udl.gif" size="116" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="line_ulr.gif" attr="" comment="Line graph up-left-right" date="1069726231" path="line_ulr.gif" size="112" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="dot_ud.gif" attr="" comment="Dot graph up-down" date="1069727650" path="dot_ud.gif" size="108" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="dot_lr.gif" attr="" comment="Dot graph left-right" date="1069727663" path="dot_lr.gif" size="105" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="dot_udlr.gif" attr="" comment="Dot graph up-down-left-right" date="1069727679" path="dot_udlr.gif" size="111" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="dot_ur.gif" attr="" comment="Dot graph up-right" date="1069727692" path="dot_ur.gif" size="106" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="dot_rd.gif" attr="" comment="Dot graph right-down" date="1069727705" path="dot_rd.gif" size="107" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="dot_ld.gif" attr="" comment="Dot graph left-down" date="1069727718" path="dot_ld.gif" size="106" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="dot_ul.gif" attr="" comment="Dot graph up-left" date="1069727729" path="dot_ul.gif" size="106" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="dot_udr.gif" attr="" comment="Dot graph up-down-right" date="1069727744" path="dot_udr.gif" size="109" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="dot_lrd.gif" attr="" comment="Dot graph left-right-down" date="1069727756" path="dot_lrd.gif" size="108" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="dot_udl.gif" attr="" comment="Dot graph up-down-left" date="1069727770" path="dot_udl.gif" size="109" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="dot_ulr.gif" attr="" comment="Dot graph up-left-right" date="1069727783" path="dot_ulr.gif" size="108" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="arrowdot.gif" attr="" comment="Arrows to red dot" date="1073858315" path="C:\Data\Temp\arrowdot.gif" size="927" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="topicdiffs.gif" attr="" comment="Topic difference" date="1073858341" path="C:\Data\Temp\topicdiffs.gif" size="916" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="topicbacklinks.gif" attr="" comment="Topic back-links" date="1073858382" path="C:\Data\Temp\topicbacklinks.gif" size="933" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="mail.gif" attr="" comment="Mail" date="1073864027" path="C:\Data\Temp\mail.gif" size="897" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="choice-no.gif" attr="" comment="No" date="1073890365" path="C:\Data\Temp\choice-no.gif" size="908" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="choice-cancel.gif" attr="" comment="Cancel" date="1073890377" path="C:\Data\Temp\choice-cancel.gif" size="886" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="globe.gif" attr="" comment="Globe" date="1075364114" path="C:\Data\Temp\globe.gif" size="1024" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="folder.gif" attr="" comment="Folder" date="1075364129" path="C:\Data\Temp\folder.gif" size="903" user="PeterThoeny" version="1.1"}%
%META:FILEATTACHMENT{name="target.gif" attr="" comment="Blue Target" date="1077756487" path="target.gif" size="199" user="PeterThoeny" version="1.1"}%
