openproject/modules/documents/app/views/help/wiki_syntax_detailed.html.erb

<%#-- copyright
OpenProject is an open source project management software.
Copyright (C) 2012-2021 the OpenProject GmbH

This program is free software; you can redistribute it and/or
modify it under the terms of the GNU General Public License version 3.

OpenProject is a fork of ChiliProject, which is a fork of Redmine. The copyright follows:
Copyright (C) 2006-2013 Jean-Philippe Lang
Copyright (C) 2010-2013 the ChiliProject Team

This program is free software; you can redistribute it and/or
modify it under the terms of the GNU General Public License
as published by the Free Software Foundation; either version 2
of the License, or (at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with this program; if not, write to the Free Software
Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.

See docs/COPYRIGHT.rdoc for more details.

++#%>

<% content_for :styles do %>
    body { font:80% Verdana,Tahoma,Arial,sans-serif; }
    h1, h2, h3, h4 {  font-family: Trebuchet MS,Georgia,"Times New Roman",serif; }
    pre, code { font-size:120%; }
    pre code { font-size:100%; }
    pre {
        margin: 1em 1em 1em 1.6em;
        padding: 2px;
        background-color: #fafafa;
        border: 1px solid #dadada;
        width:95%;
        overflow-x: auto;
    }
    a.new { color: #b73535; }

    .CodeRay .c  { color:#666; }

    .CodeRay .cl { color:#B06; font-weight:bold }
    .CodeRay .dl { color:black }
    .CodeRay .fu { color:#06B; font-weight:bold }

    .CodeRay .il { background: #eee }
    .CodeRay .il .idl { font-weight: bold; color: #888 }

    .CodeRay .iv { color:#33B }
    .CodeRay .r  { color:#080; font-weight:bold }

    .CodeRay .s  { background-color:#fff0f0 }
    .CodeRay .s  .dl { color:#710 }
<% end %>

<% html_title "Wiki Formatting" %>
<h1><a name="1" class="wiki-page"></a>Wiki Formatting</h1>

    <h2><a name="2" class="wiki-page"></a>Links</h2>

        <h3><a name="3" class="wiki-page"></a>OpenProject links</h3>

        <p>OpenProject allows hyperlinking between issues, changesets and wiki pages from anywhere wiki formatting is used.</p>
        <ul>
            <li><strong>#124</strong> displays a link to an issue: <del><a href="#" class="issue" title="bulk edit doesn't change the category or version properties (Closed)">#124</a></del> (link is striked-through if the issue is closed)</li>
            <li><strong>##124</strong> displays a link to an issue with context information: <a href="/issues/12" class="issue status-1 priority-2 overdue created-by-me" title="Issue subject (New)">#12 New: Issue subject</a> 2012-05-14 - 2012-05-23 (User Name - assigned to)</li>
            <li><strong>###124</strong> displays a link to an issue with context information and an excerpt (first 3 lines) of the description</li>
            <li><strong>r758</strong> displays a link to a changeset: <a href="#" class="changeset" title="Search engine now only searches objects the user is allowed to view.">r758</a></li>
            <li><strong>commit:c6f4d0fd</strong> displays a link to a changeset with a non-numeric hash: <a href="#" class="changeset">c6f4d0fd</a></li>
            <li><strong>sandbox:r758</strong> displays a link to a changeset of another project: <a href="#" class="changeset" title="Search engine now only searches objects the user is allowed to view.">sandbox:r758</a></li>
            <li><strong>sandbox:c6f4d0fd</strong> displays a link to a changeset with a non-numeric hash: <a href="#" class="changeset">sandbox:c6f4d0fd</a></li>
        </ul>

        <p>Wiki links:</p>

        <ul>
            <li><strong>[[Guide]]</strong> displays a link to the page named 'Guide': <a href="#" class="wiki-page">Guide</a></li>
            <li><strong>[[Guide#further-reading]]</strong> takes you to the anchor "further-reading". Headings get automatically assigned anchors so that you can refer to them: <a href="#" class="wiki-page">Guide</a></li>
            <li><strong>[[Guide|User manual]]</strong> displays a link to the same page but with a different text: <a href="#" class="wiki-page">User manual</a></li>
        </ul>

        <p>You can also link to pages of an other project wiki:</p>

        <ul>
            <li><strong>[[sandbox:some page]]</strong> displays a link to the page named 'Some page' of the Sandbox wiki</li>
            <li><strong>[[sandbox:]]</strong> displays a link to the Sandbox wiki main page</li>
        </ul>

        <p>Wiki links are displayed in red if the page doesn't exist yet, eg: <a href="#" class="wiki-page new">Nonexistent page</a>.</p>

        <p>Links to other resources:</p>

        <ul>
            <li>Documents:
                <ul>
                    <li><strong>document#17</strong> (link to document with id 17)</li>
                    <li><strong>document:Greetings</strong> (link to the document with title "Greetings")</li>
                    <li><strong>document:"Some document"</strong> (double quotes can be used when document title contains spaces)</li>
                    <li><strong>sandbox:document:"Some document"</strong> (link to a document with title "Some document" in other project "sandbox")</li>
                </ul></li>
        </ul>

        <ul>
            <li>Versions:
                <ul>
                    <li><strong>version#3</strong> (link to version with id 3)</li>
                    <li><strong>version:1.0.0</strong> (link to version named "1.0.0")</li>
                    <li><strong>version:"1.0 beta 2"</strong></li>
                    <li><strong>sandbox:version:1.0.0</strong> (link to version "1.0.0" in the project "sandbox")</li>
                </ul></li>
        </ul>

        <ul>
            <li>Attachments:
                <ul>
                    <li><strong>attachment:file.zip</strong> (link to the attachment of the current object named file.zip)</li>
                    <li>For now, attachments of the current object can be referenced only (if you're on an issue, it's possible to reference attachments of this issue only)</li>
                </ul></li>
        </ul>

        <ul>
             <li>Repository files:
                <ul>
                    <li><strong>source:some/file</strong>           (link to the file located at /some/file in the project's repository)</li>
                    <li><strong>source:some/file@52</strong>        (link to the file's revision 52)</li>
                    <li><strong>source:some/file#L120</strong>      (link to line 120 of the file)</li>
                    <li><strong>source:some/file@52#L120</strong>   (link to line 120 of the file's revision 52)</li>
                    <li><strong>source:"some file@52#L120"</strong> (use double quotes when the URL contains spaces</li>
                    <li><strong>export:some/file</strong>           (force the download of the file)</li>
                    <li><strong>sandbox:source:some/file</strong>   (link to the file located at /some/file in the repository of the project "sandbox")</li>
                    <li><strong>sandbox:export:some/file</strong>   (force the download of the file)</li>
                </ul></li>
        </ul>

        <ul>
            <li>Forum messages:
                <ul>
                    <li><strong>message#1218</strong> (link to message with id 1218)</li>
                </ul></li>
        </ul>

        <ul>
            <li>Projects:
                <ul>
                    <li><strong>project#3</strong> (link to project with id 3)</li>
                    <li><strong>project:someproject</strong> (link to project named "someproject")</li>
                </ul></li>
        </ul>


        <p>Escaping:</p>

        <ul>
            <li>You can prevent OpenProject links from being parsed by preceding them with an exclamation mark: !</li>
        </ul>


        <h3><a name="4" class="wiki-page"></a>External links</h3>

        <p>HTTP URLs and email addresses are automatically turned into clickable links:</p>

<pre>
https://www.openproject.org, someone@foo.bar
</pre>

        <p>displays: <a class="external" href="https://www.openproject.org">https://www.openproject.org</a>, <a href="mailto:someone@foo.bar" class="email">someone@foo.bar</a></p>

        <p>If you want to display a specific text instead of the URL, you can use the standard textile syntax:</p>

<pre>
"OpenProject web site":https://www.openproject.org
</pre>

        <p>displays: <a href="https://www.openproject.org" class="external">OpenProject web site</a></p>


    <h2><a name="5" class="wiki-page"></a>Text formatting</h2>


    <p>For things such as headlines, bold, tables, lists, OpenProject supports Textile syntax.  See <a class="external" href="http://www.textism.com/tools/textile/">http://www.textism.com/tools/textile/</a> for information on using any of these features.  A few samples are included below, but the engine is capable of much more of that.</p>

        <h3><a name="6" class="wiki-page"></a>Font style</h3>

<pre>
* *bold*
* _italic_
* _*bold italic*_
* +underline+
* -strike-through-
</pre>

        <p>Display:</p>

        <ul>
            <li><strong>bold</strong></li>
            <li><em>italic</em></li>
            <li><em>*bold italic*</em></li>
            <li><ins>underline</ins></li>
            <li><del>strike-through</del></li>
        </ul>

        <h3><a name="7" class="wiki-page"></a>Inline images</h3>

        <ul>
            <li><strong>!image_url!</strong> displays an image located at image_url (textile syntax)</li>
            <li><strong>!>image_url!</strong> right floating image</li>
            <li>If you have an image attached to your wiki page, it can be displayed inline using its filename: <strong>!attached_image.png!</strong></li>
        </ul>

        <h3><a name="8" class="wiki-page"></a>Headings</h3>

<pre>
h1. Heading
h2. Subheading
h3. Subsubheading
</pre>

        <p>OpenProject assigns an anchor to each of those headings thus you can link to them with "#Heading", "#Subheading" and so forth.</p>


        <h3><a name="9" class="wiki-page"></a>Paragraphs</h3>

<pre>
p>. right aligned
p=. centered
</pre>

        <p style="text-align:center;">This is a centered paragraph.</p>


        <h3><a name="10" class="wiki-page"></a>Blockquotes</h3>

        <p>Start the paragraph with <strong>bq.</strong></p>

<pre>
bq. Rails is a full-stack framework for developing database-backed web applications according to the Model-View-Control pattern.
To go live, all you need to add is a database and a web server.
</pre>

        <p>Display:</p>

        <blockquote>
                <p>Rails is a full-stack framework for developing database-backed web applications according to the Model-View-Control pattern.<br />To go live, all you need to add is a database and a web server.</p>
        </blockquote>


        <h3><a name="11" class="wiki-page"></a>Table of content</h3>

<pre>
{{toc}} => left aligned toc
{{>toc}} => right aligned toc
</pre>

    <h2><a name="12" class="wiki-page"></a>Macros</h2>

    <p>OpenProject has the following builtin macros:</p>

    <p><dl><dt><code>hello_world</code></dt><dd><p>Sample macro.</p></dd><dt><code>include</code></dt><dd><p>Include a wiki page. Example:</p>

    <pre><code>{{include(Foo)}}</code></pre></dd><dt><code>macro_list</code></dt><dd><p>Displays a list of all available macros, including description if available.</p></dd></dl></p>


    <h2><a name="13" class="wiki-page"></a>Code highlighting</h2>

    <p>Code highlightment relies on <a href="http://coderay.rubychan.de/" class="external">CodeRay</a>, a fast syntax highlighting library written completely in Ruby. It currently supports c, cpp, css, delphi, groovy, html, java, javascript, json, php, python, rhtml, ruby, scheme, sql, xml and yaml languages.</p>

    <p>You can highlight code in your wiki page using this syntax:</p>

<pre>
&lt;pre&gt;&lt;code class="ruby"&gt;
  Place you code here.
&lt;/code&gt;&lt;/pre&gt;
</pre>

    <p>Example:</p>

<pre><code class="ruby CodeRay"><span class="no"> 1</span> <span class="c"># The Greeter class</span>
<span class="no"> 2</span> <span class="r">class</span> <span class="cl">Greeter</span>
<span class="no"> 3</span>   <span class="r">def</span> <span class="fu">initialize</span>(name)
<span class="no"> 4</span>     <span class="iv">@name</span> = name.capitalize
<span class="no"> 5</span>   <span class="r">end</span>
<span class="no"> 6</span>
<span class="no"> 7</span>   <span class="r">def</span> <span class="fu">salute</span>
<span class="no"> 8</span>     puts <span class="s"><span class="dl">"</span><span class="k">Hello </span><span class="il"><span class="idl">#{</span><span class="iv">@name</span><span class="idl">}</span></span><span class="k">!</span><span class="dl">"</span></span>
<span class="no"> 9</span>   <span class="r">end</span>
<span class="no"><strong>10</strong></span> <span class="r">end</span>
</code>
</pre>