ELOG/elog
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
master
elog/resources/elcode_english.html
T

399 lines
13 KiB
HTML
Executable File
Raw Permalink Blame History

<!--
$Revision$
-->
<html><head>
<title>ELCode Help</title>
<style type="text/css">
td {
color:black;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
}
h1 {
font-size=5;
color:white;
}
h2 {
font-size=2;
color:white;
align:left;
}
</style>
</head>
<body>
<table border=0 width=100%% bgcolor=#486090 cellpadding=1 cellspacing=0 align=center>
<tr><td><table cellpadding=5 cellspacing=0 border=0 width=100%% bgcolor=#486090>
<tr><td align=center bgcolor=#486090><h1>ELCode Help</h1></td></tr>
<tr><td bgcolor=#FFFFFF><br>
ELCode is a special set of tags to format an ELOG entry. It is similar to HMTL, but simpler. Tags are
enclosed in braces [ and ] rather than &lt; and &gt;. Some tags change the formatting of the text like
boldface, size and color, while other tags allow the embedding of URLs and images. The ELCode tags are
similar to the <a href="http://www.phpbb.com/phpBB/faq.php?mode=bbcode">BBCode</a> tags, sometimes also
referred as <i>vB code</i>.<br><br>
<p></td></tr>
<tr><td bgcolor=#486090><h2>Text formatting</h2></td></tr>
<tr><td bgcolor=#FFFFFF><br>Following tags in ELCode allow the basic formatting of the text:<p>
<table border=0 width=100%% bgcolor=#808080 cellpadding=5 cellspacing=1 align=center>
<tr><th bgcolor=#D0D0FF width=200>Tag</th><th bgcolor="#ffccff">Keyboard shortcut</th><th bgcolor=#FFFFFF>Meaning</th></tr>
<tr><td bgcolor=#D0D0FF width=200><b>[b]</b>Hello<b>[/b]</b>
<td bgcolor="#ffccff">CTRL+B</td>
<td bgcolor=#FFFFFF>will become bold text like <b>Hello</b></tr>
<tr><td bgcolor=#D0D0FF width=200><b>[u]</b>Hello<b>[/u]</b>
<td bgcolor="#ffccff">CTRL+U</td>
<td bgcolor=#FFFFFF>will become underlined text like <u>Hello</u></tr>
<tr><td bgcolor=#D0D0FF width=200><b>[i]</b>Hello<b>[/i]</b>
<td bgcolor="#ffccff">CTRL+I</td>
<td bgcolor=#FFFFFF>will become italics text like <i>Hello</i></tr>
<tr><td bgcolor=#D0D0FF width=200><b>[color=red]</b>Hello<b>[/color]</b> or <br>
<b>[color=#FF0000]</b>Hello<b>[/color]</b>
<td bgcolor="#ffccff"></td>
<td bgcolor=#FFFFFF>will both become <font color="red">Hello</font>. One can
either speciy a well know color name like white, red, green, lightgreen, or a hexadecimal RGB value, where the first two
digits (00 - FF) are for the red component, the second for the green and the third for the blue part.</tr>
<tr><td bgcolor=#D0D0FF width=200><b>[size=5]</b>Hello<b>[/size]</b>
<td bgcolor="#ffccff"></td>
<td bgcolor=#FFFFFF>will become text like <font size=5>Hello</font>.
The size of the text in pixels ranges from 1 to 29. Here are some examples:
<font size=1>size=1</font>,
<font size=2>size=2</font>,
<font size=3>size=3</font>,
<font size=4>size=4</font>,
<font size=5>size=5</font>,
<font size=6>size=6</font>.
</tr>
<tr><td bgcolor=#D0D0FF width=200><b>[font=comic]</b>Hello<b>[/font]</b>
<td bgcolor="#ffccff"></td>
<td bgcolor=#FFFFFF>will change the text font. Here are some examples:
<font face="comic sans ms">comic</font>,
<font face="courier">courier</font>,
<font face="arial">arial</font>,
<font face="tahoma">tahoma</font>,
<font face="times">times</font>,
<font face="verdana">verdana</font>
</tr>
<tr><td bgcolor=#D0D0FF width=200><b>[center]</b>Hello<b>[/center]</b>
<td bgcolor="#ffccff"></td>
<td bgcolor=#FFFFFF><center>will put the text in the center</center></tr>
<tr><td bgcolor=#D0D0FF width=200>
<b>[h1]</b>Hello<b>[/h1]</b><br>
<b>[h2]</b>Hello<b>[/h2]</b><br>
<b>[h3]</b>Hello<b>[/h3]</b>
<td bgcolor="#ffccff">CTRL+H</td>
<td bgcolor=#FFFFFF>will become a heading of <font size=6><b>level 1</b></font>, <font size=5><b>level 2</b></font> or <font size=4><b>level 3</b></font></tr>
<tr><td bgcolor=#D0D0FF width=200>
<b>[line]
<td bgcolor="#ffccff"></td>
<td bgcolor=#FFFFFF>will become a horizontal line such as <hr /></td></tr>
</table><p>
Tags can be nested, such as<p>
<b>[size=5][color=red][b]</b>Hello<b>[/b][/color][/size]</b><p>
which would produce
<font size=5 color=red><b>Hello</b></font>. Note that tags have to be nested correctly, things like<p>
<b>[b][color=red]</b>This is wrong!<b>[/b][/color]</b><p>
are incorrect, since the <b>[b]</b> tag is opened first and therefore must be closed last, after the
closing <b>[/color]</b> tag, such as in<p>
<b>[b][color=red]</b>This is correct<b>[/color][/b]</b><br><br>
</td></tr>
<tr><td bgcolor=#486090><h2>Escape character</h2></td></tr>
<tr><td bgcolor=#FFFFFF><br> Sometimes one does not want ELCode tags to be
interpreted, like in a discussion forums where one wants to explain some tags
for example. In order to avoid interpretation of tags, one puts a backslash "\"
in front of the tag, like \[b] instead of [b].<br><br>
</td></tr>
<tr><td bgcolor=#486090><h2>Anchor</h2></td></tr>
<tr><td bgcolor=#FFFFFF><br>An anchor can be put into an entry with
<b>[anchor]</b><i>anchor_name</i><b>[/anchor]</b>. This is equivalent to a HTML anchor like
<b>&lt;a name="</b><i>anchor_name</i><b>"&gt;&lt;/a&gt;</b>.
Such anchors can be referenced inside an entry with
<b>elog:&lt;id&gt;#<i>anchor_name</i></b> where <b>&lt;id&gt;</b> is the ID number of
the entry (the number from the left column in the list display). <br><br>
</td></tr>
<tr><td bgcolor=#486090><h2>Smileys</h2></td></tr>
<tr><td bgcolor=#FFFFFF><br>Smileys, or Emoticons, are small graphical images which can be used to
express some feeling using a short code, e.g. :) means happy. They are converted by elog automatically into
small graphical images, such as<br><br>
<table align=center border=0 bgcolor=#202020 cellpadding=5 cellspacing=1>
<tr><td bgcolor=#D0D0FF>:)<td bgcolor=#FFFFFF><img src="icons/smile.png"</td>
<td bgcolor=#D0D0FF>:(<td bgcolor=#FFFFFF><img src="icons/frown.png"</td>
<td bgcolor=#D0D0FF>;)<td bgcolor=#FFFFFF><img src="icons/wink.png"</tr>
<tr><td bgcolor=#D0D0FF>:))<td bgcolor=#FFFFFF><img src="icons/happy.png"</td>
<td bgcolor=#D0D0FF>:D<td bgcolor=#FFFFFF><img src="icons/biggrin.png"</td>
<td bgcolor=#D0D0FF>?-)<td bgcolor=#FFFFFF><img src="icons/confused.png"</tr>
<tr><td bgcolor=#D0D0FF>;(<td bgcolor=#FFFFFF><img src="icons/crying.png"</td>
<td bgcolor=#D0D0FF>:]<td bgcolor=#FFFFFF><img src="icons/pleased.png"</td>
<td bgcolor=#D0D0FF>:O<td bgcolor=#FFFFFF><img src="icons/yawn.png"</tr>
<tr><td bgcolor=#D0D0FF>8-)<td bgcolor=#FFFFFF><img src="icons/cool.png"</td
<td bgcolor=#D0D0FF>8o<td bgcolor=#FFFFFF><img src="icons/astonished.png"</td>
<td bgcolor=#D0D0FF>X(<td bgcolor=#FFFFFF><img src="icons/mad.png"</td>
<tr><td bgcolor=#D0D0FF>:P<td bgcolor=#FFFFFF><img src="icons/tongue.png"</td>
<td colspan=4 bgcolor=#FFFFFF></tr><br><br>
</table><p>
<tr><td bgcolor=#486090><h2>Quoting</h2></td></tr>
<tr><td bgcolor=#FFFFFF><br>There are two ways of quoting, with a reference and
without:<br><br>
<ul>
<li>Enclosing some text with <b>[quote]</b>Original Text<b>[/quote]</b> produces a quote without reference such as:<p>
<table border=0 width=98%% bgcolor=black cellpadding=5 cellspacing=1>
<tr><td bgcolor=#486090><font color=white size=1>Quote:</font></td></tr>
<tr><td bgcolor=#FFFFB0>Original Text</td></tr>
</table>
<li>Enclosing some text with <b>[quote="Mr. Bean"]</b>Original Text<b>[/quote]</b> produces a quote with reference such as:<p>
<table border=0 width=98%% bgcolor=black cellpadding=5 cellspacing=1>
<tr><td bgcolor=#486090><font color=white size=1>Mr. Bean wrote:</font></td></tr>
<tr><td bgcolor=#FFFFB0>Original Text</td></tr>
</table><p>
Note that it is mandatory to enclose the reference "Mr. Bean" in quotation marks.<p>
</ul>
<tr><td bgcolor=#486090><h2>Fixed width text [CTRL+O]</h2></td></tr>
<tr><td bgcolor=#FFFFFF><br>To output text with fixed width using a Courier-type font, enclose it in<p>
<b>[code]</b>Hello<b>[/code]</b><p><p>
This might be useful in computer code listings or tables to increase the readability, like<p>
<b>
<pre>
Item Price Availability
==== ===== ============
Apples 0.50 1000
Grapefruits 2.50 100
Sun-dried Tomatos 12.50 20
</b></pre><p>
versus<p>
<b>
Item Price Availability<br>
==== ===== ============<br>
<br>
Apples 0.50 1000<br>
Grapefruits 2.50 100<br>
Sun-dried Tomatos 12.50 20<br>
</b><p>
Note that all other ELCode tags are disabled inside the <b>[code]</b> tags. This
might be helpful to display some program code or similar which contains characters
which would wrongly be interpreted as tags or smileys. If this behaviour is not
wanted, like if some program code should be annotated with bold face etc. the
tags <b>[code1]</b>...<b>[/code1]</b> can be used which allows other ELCode
tags inside.<p>
<tr><td bgcolor=#486090><h2>Lists [CTRL+L]</h2></td></tr>
<tr><td bgcolor=#FFFFFF><br>An unordered list can be created with the tags <b>[list][/list]</b> like<p>
<b>[list]</b><br>
<b>[*]</b>Ocean<br>
<b>[*]</b>Forest<br>
<b>[*]</b>Desert<br>
<b>[/list]</b><br>
<p>
to produce<p>
<ul>
<li>Ocean
<li>Forest
<li>Desert
</ul>
<p>
A new list item starts with <b>[*]</b>, which can be entered via the keyboard
shortcut <b>CTRL-N</b>.
In an ordered list one can specify what is used before each item. To create a numbered list one
can use <b>[list=1][/list]</b>:<p>
<b>[list=1]</b><br>
<b>[*]</b>Ocean<br>
<b>[*]</b>Forest<br>
<b>[*]</b>Desert<br>
<b>[/list]</b><br>
<p>
to produce<p>
<ol type="1">
<li>Ocean
<li>Forest
<li>Desert
</ol>
<p>
for an alphabetical list <b>[list=a][/list]</b> like<p>
<b>[list=a]</b><br>
<b>[*]</b>Ocean<br>
<b>[*]</b>Forest<br>
<b>[*]</b>Desert<br>
<b>[/list]</b><br>
<p>
to produce<p>
<ol type="a">
<li>Ocean
<li>Forest
<li>Desert
</ol>
<p>
Other possibilities are <b>[list=A]</b> for capital letters and <b>[list=I]</b> for Roman numbering.<p>
<tr><td bgcolor=#486090><h2>Tables</h2></td></tr>
<tr><td bgcolor=#FFFFFF><br>Tables can be created with the tags <b>[table][/table]</b> like<p>
<b>[table border="1"]</b><br>
One<b>|</b>Two<br>
<b>|-</b><br>
Three<b>|</b>Four<br>
<b>[/table]</b>
<p>
to produce<p>
<table border="1">
<tr><td>One</td><td>Two</td></tr>
<tr><td>Three</td><td>Four</td></tr>
</table>
<p>
The parameters after <b>[table ...]</b> are directly used in the HTML &lt;table&gt;
tag. To increase the cell padding, on can add for example<p>
<b>[table border="1" cellpadding="20"]</b><br>
One<b>|</b>Two<br>
<b>|-</b><br>
Three<b>|</b>Four<br>
<b>[/table]</b>
<p>
to produce<p>
<table border="1" cellpadding="20">
<tr><td>One</td><td>Two</td></tr>
<tr><td>Three</td><td>Four</td></tr>
</table>
<p>
Table headings are not supported, but can be simulated by embedding the cell
contents with a <b>[B]...[/B]</b> tag.<p>
<tr><td bgcolor=#486090><h2>Creating links</h2></td></tr>
<tr><td bgcolor=#FFFFFF><br>Hyperlinks or Uniform Resouce Locators (URLs) can be created in various ways:<p>
<ul>
<li>Any syntactically correct URL gets automatically transformd into a link, even without any leading <b>http://</b>
in front of it. So <b>elog.psi.ch/elog</b> gets converted into <a href="http://elog.psi.ch/elog">elog.psi.ch/elog</a> and
<b>http://www.cern.ch</b> gets converted to <a href="http://www.cern.ch">http://www.cern.ch</a>.<p>
<li>To specify an URL explicitly, enclose it in <b>[url]</b>www.cern.ch<b>[/url]</b><p>
<li>If the link should contain some text different from the URL, specify it with <b>[url=http://www.cern.ch]</b>Text<b>[/url]</b> like
in<p>
Go to <b>[url=http://www.cern.ch]</b>CERN<b>[/url]</b> <p>
which will produce:<p>
Go to <a href="http://www.cern.ch">CERN</a><p>
<li>The same works for email addresses. They can be used like in <b>[email]</b>john.doe@domain.org<b>[/email]</b> or simply as
<b>john.dow@domain.org</b> which will be converted automatically into <a href="mailto:john.doe@domain.org">john.doe@domain.org</a>.<p>
<tr><td bgcolor=#486090><h2>Embedding images [CTRL+M]</h2></td></tr>
<tr><td bgcolor=#FFFFFF><br>There are two ways to embed images in the text:<p>
<ul>
<li>Images can be embedded in the text with the <b>[img]</b>URL<b>[/img]</b> tags, where
the URL must point to an image availabe on the internet. Note that this only works for images which
are accessible through a web browser. Images on your local hard disk cannot be accessed from outside
unless you don't run a public web server. You can for example embed the elog logo with:<p>
<b>[img]</b>http://elog.psi.ch/elogs/elog.png<b>[/img]</b><p>
which produces <img src="../../../elog/themes/default/elog.png">
<li>You can upload an image as an attachment in your elog entry and link to it with<p>
<b>[img]</b>elog:/1<b>[/img]</b><p>
where <b>elog:/1</b> stands for the first attachment, <b>elog:/2</b> for the second etc. If you reference
your attached images in this way, they are not shown again at the end of the entry.<p>
</ul>
<tr><td bgcolor=#486090><h2>Other keyboard shortcuts</h2></td></tr>
<tr><td bgcolor=#FFFFFF>
<ul>
<li><b>CTRL+P</b>: Preview</li>
<li><b>CTRL+ENTER</b>: Submit</li>
</ul>
It should be noted that keyboard shortcuts do not work properly in all browsers. They have been successfully
tested in Firefox.
</td></tr>
</td></tr></table></td></tr></table>
<center>
<font size=1 face=sans-serif><a href="http://elog.psi.ch/elog">ELOG Home Page</a></font>
</center>
</body></html>
Reference in New Issue View Git Blame Copy Permalink