RedmineTextFormattingMarkdown » History » Version 25

Tuan-Tu Tran, 2020-04-16 17:24

1 1 Hans Ginzel
h1. Markdown formatting
2 1 Hans Ginzel
3 17 Hiroo Hayashi
Below is *Markdown* formatting. For *Textile* formatting see [[RedmineTextFormattingTextile|Textile formatting]].
4 17 Hiroo Hayashi
Currently HTML tags are not allowed by default. See #15520 and #20497 for details.  For other limitations of the current *Markdown* formatting see #16373 and #21443.
5 1 Hans Ginzel
6 1 Hans Ginzel
{{>TOC}}
7 1 Hans Ginzel
8 1 Hans Ginzel
h2. Links
9 1 Hans Ginzel
10 1 Hans Ginzel
h3. Redmine links
11 1 Hans Ginzel
12 16 Hiroo Hayashi
{{include(RedmineTextFormattingRedmineLinks)}}
13 1 Hans Ginzel
14 1 Hans Ginzel
h3. External links
15 1 Hans Ginzel
16 21 Go MAEDA
URLs (http, https, ftp and ftps) are automatically turned into clickable links: 
17 17 Hiroo Hayashi
18 1 Hans Ginzel
* *http://www.redmine.org* -- External link to the redmine website: http://www.redmine.org
19 1 Hans Ginzel
20 21 Go MAEDA
URLs can also use different text than the link itself:
21 17 Hiroo Hayashi
22 2 Hans Ginzel
* *[Redmine web site](http://www.redmine.org)* -- External link with different text: "Redmine web site":http://www.redmine.org
23 22 Ivan Tsybanenko
* *[![Redmine web site](http://www.redmine.org/attachments/7069/Redmine_logo.png)](http://www.redmine.org)* -- External image with a title that links to an URL: 
24 1 Hans Ginzel
25 1 Hans Ginzel
p=. !http://www.redmine.org/attachments/7069/Redmine_logo.png(Redmine web site)!:http://www.redmine.org
26 1 Hans Ginzel
27 1 Hans Ginzel
h3. Email addresses
28 1 Hans Ginzel
29 1 Hans Ginzel
Email addresses are automatically turned into clickable links:
30 1 Hans Ginzel
31 17 Hiroo Hayashi
* *someone@foo.bar* -- Link to an email address: someone@foo.bar
32 3 Hans Ginzel
* *[Email someone](mailto:someone@foo.bar)* -- Email link with different text: "Email someone":mailto:someone@foo.bar
33 1 Hans Ginzel
34 1 Hans Ginzel
More complex email instructions can be added to an email link.  A default subject, default body and CC information can be defined.  Note that spaces in any of these fields need to be replaced with the code %20.
35 3 Hans Ginzel
* *[Email webmaster and admin](mailto:webmaster@foo.bar?cc=admin@foo.bar)* -- Email to webmaster, CC admin:  "Email webmaster and admin":mailto:webmaster@foo.bar?cc=admin@foo.bar
36 3 Hans Ginzel
* *[Email someone for help](mailto:someone@foo.bar?subject=Website%20Help)* -- Email link with the subject "Website Help": "Email someone for help":mailto:someone@foo.bar?subject=Website%20Help
37 3 Hans Ginzel
* *[Email someone for help](mailto:someone@foo.bar?subject=Website%20Help&body=My%20problem%20is%20)* -- Email link with the subject "Website Help" and a default body: "Email someone for help":mailto:someone@foo.bar?subject=Website%20Help&body=My%20problem%20is%20
38 1 Hans Ginzel
39 1 Hans Ginzel
h2. Text formatting
40 4 Hans Ginzel
41 1 Hans Ginzel
For things such as headlines, bold, tables, lists, Redmine supports "Markdown syntax":http://en.wikipedia.org/wiki/Markdown.  See http://daringfireball.net/projects/markdown/syntax, http://agea.github.io/tutorial.md/, http://stackoverflow.com/editing-help for information on using any of these features.  A few samples are included below, but the engine is capable of much more of that. For conversions see "Pandoc":http://pandoc.org. The "Redcarpet formatter":https://github.com/alminium/redmine_redcarpet_formatter is used.
42 1 Hans Ginzel
43 1 Hans Ginzel
h3. Acronym
44 1 Hans Ginzel
45 17 Hiroo Hayashi
Not supported by Markdown
46 1 Hans Ginzel
47 1 Hans Ginzel
h3. Font style
48 1 Hans Ginzel
49 1 Hans Ginzel
<pre><code>* **bold** __bold__
50 1 Hans Ginzel
* *italic* _italic_
51 1 Hans Ginzel
* ***bold italic*** ___bold italic___
52 5 Hans Ginzel
* <ins>underline</ins>
53 5 Hans Ginzel
* <del>strike through</del>
54 5 Hans Ginzel
* Plain <sup>superscript</sup>
55 5 Hans Ginzel
* Plain <sub>subscript</sub>
56 5 Hans Ginzel
* `inline monospace`
57 1 Hans Ginzel
* normal **bold** _italic_ normal;E=mc<sup>2</sup>
58 19 Hiroo Hayashi
* normal<strong>bold</strong><em>italic</em>normal;E=mc<sup>2</sup>
59 17 Hiroo Hayashi
* Escaping: \*\*bold\*\* \_italic\_ \`inlinemono\`
60 17 Hiroo Hayashi
* <notextile><pre>**some lines**      some [link](http://www.redmine.org)</pre></notextile>
61 17 Hiroo Hayashi
* <notextile><pre>\*\*some lines\*\*      some \[link](http\://www\.redmine\.org)</pre></notextile>
62 1 Hans Ginzel
</code></pre>
63 1 Hans Ginzel
64 17 Hiroo Hayashi
displays:
65 1 Hans Ginzel
66 1 Hans Ginzel
 * *bold* *bold*
67 1 Hans Ginzel
 * _italic_ _italic_
68 1 Hans Ginzel
 * *_bold italic_* *_bold italic_*
69 5 Hans Ginzel
 * +underline+
70 5 Hans Ginzel
 * -strike-through-
71 1 Hans Ginzel
 * Plain ^superscript^
72 1 Hans Ginzel
 * Plain ~subscript~
73 1 Hans Ginzel
 * @inline monospace@
74 17 Hiroo Hayashi
 * normal *bold* _italic_ normal;E=mc<notextile></notextile>^2^
75 1 Hans Ginzel
 * normal<notextile></notextile>*bold*<notextile></notextile>_italic_<notextile></notextile>normal;E=mc<notextile></notextile>^2^
76 23 Go MAEDA
 * Escaping: <notextile>**bold** _italic_ `inlinemono`</notextile> 
77 1 Hans Ginzel
 * <pre><notextile></notextile>*some lines*      some "link":http://www.redmine.org</pre>
78 17 Hiroo Hayashi
 * <pre>**some lines**      some [link](http://www.redmine.org)</pre>
79 1 Hans Ginzel
80 19 Hiroo Hayashi
**Note:** HTML tags need to be allowed to use the HTML tags (<strong>, <em>, <ins>, <del>, <sup>, <sub>).  See #15520-16 and #15520-17 for details.
81 1 Hans Ginzel
82 17 Hiroo Hayashi
h3. Color
83 17 Hiroo Hayashi
84 17 Hiroo Hayashi
<pre><code><notextile>* <span style="color:red">red</span> <span style="color:green">green</span> <span style="color:yellow">yellow</span> <span style="color:#82B6E1">blue'ish</span>
85 17 Hiroo Hayashi
* <span style="color:red">red</span><span style="color:green">green</span><span style="color:yellow">yellow</span><span style="color:#82B6E1">blue'ish</span>
86 17 Hiroo Hayashi
* <span style="background-color:lightgreen">Lightgreen Background</span> <span style="background-color:yellow">Yellow Background</span>
87 17 Hiroo Hayashi
* <span style="background-color:lightgreen">Lightgreen Background</span><span style="background-color:yellow">Yellow Background</span>
88 1 Hans Ginzel
</notextile></code></pre>
89 1 Hans Ginzel
90 17 Hiroo Hayashi
displays:
91 1 Hans Ginzel
92 1 Hans Ginzel
 * %{color:red}red% %{color:green}green% %{color:yellow}yellow% %{color:#82B6E1}blue'ish%
93 1 Hans Ginzel
 * %{color:red}red%<notextile></notextile>%{color:green}green%<notextile></notextile>%{color:yellow}yellow%<notextile></notextile>%{color:#82B6E1}blue'ish%
94 1 Hans Ginzel
 * %{background:lightgreen}Lightgreen Background% %{background:yellow}Yellow Background%
95 1 Hans Ginzel
 * %{background:lightgreen}Lightgreen Background%<notextile></notextile>%{background:yellow}Yellow Background%
96 1 Hans Ginzel
97 17 Hiroo Hayashi
**Note:** HTML tags need to be allowed to use the HTML tag (<span>).  See #15520-16 and #15520-17 for details.
98 25 Tuan-Tu Tran
More explicitly, you need to [patch redmine](https://www.redmine.org/boards/2/topics/56096?r=57052#message-57052)
99 17 Hiroo Hayashi
100 1 Hans Ginzel
h3. Inline images
101 1 Hans Ginzel
102 1 Hans Ginzel
* *![](image_url)* displays an image located at image_url (textile syntax)
103 17 Hiroo Hayashi
* *![alt text](image_url "optional title")* displays an image with an alt/title attribute
104 17 Hiroo Hayashi
* *[![](image_url)](URL)* displays an image located at image_url with link URL added
105 1 Hans Ginzel
106 17 Hiroo Hayashi
If you have an image attached to your wiki page, it can be displayed inline using its filename: *![](attached_image.png)*.
107 1 Hans Ginzel
108 17 Hiroo Hayashi
As of this writing, Markdown has no syntax for specifying the dimensions of an image; if this is important to you, you can use regular HTML <img> tags.
109 1 Hans Ginzel
110 17 Hiroo Hayashi
* <img style="float:right" src="URL"/>
111 17 Hiroo Hayashi
* <img style="width:100%" src="attached_image.png"/>
112 17 Hiroo Hayashi
113 17 Hiroo Hayashi
**Note:** HTML tags need to be allowed to use the HTML tag (<img>).  See #15520-16 and #15520-17 for details.
114 17 Hiroo Hayashi
115 17 Hiroo Hayashi
116 1 Hans Ginzel
h3. Headings
117 1 Hans Ginzel
118 1 Hans Ginzel
<pre><code># Heading
119 1 Hans Ginzel
120 1 Hans Ginzel
## Subheading
121 1 Hans Ginzel
122 1 Hans Ginzel
### Subheading
123 1 Hans Ginzel
124 1 Hans Ginzel
or
125 1 Hans Ginzel
126 1 Hans Ginzel
Heading
127 1 Hans Ginzel
=======
128 1 Hans Ginzel
129 1 Hans Ginzel
Subheading
130 1 Hans Ginzel
----------
131 1 Hans Ginzel
</code></pre>
132 1 Hans Ginzel
133 1 Hans Ginzel
Redmine assigns an anchor to each of those headings thus you can link to them with "#Heading", "#Subheading" and so forth.
134 1 Hans Ginzel
135 1 Hans Ginzel
h3. Paragraphs
136 1 Hans Ginzel
137 17 Hiroo Hayashi
Markdown does not support alignment of a paragraph.  Use &lt;div> tags if you need it.
138 1 Hans Ginzel
139 17 Hiroo Hayashi
<pre><code>left aligned
140 17 Hiroo Hayashi
<div style="padding-left:1em;">
141 17 Hiroo Hayashi
left ident 1em
142 17 Hiroo Hayashi
</div>
143 1 Hans Ginzel
144 17 Hiroo Hayashi
<div style="padding-left:2em;">
145 17 Hiroo Hayashi
left ident 2em
146 17 Hiroo Hayashi
as well as for following lines
147 17 Hiroo Hayashi
</div>
148 1 Hans Ginzel
149 17 Hiroo Hayashi
<div style="text-align:right;">
150 17 Hiroo Hayashi
right aligned
151 17 Hiroo Hayashi
</div>
152 1 Hans Ginzel
153 17 Hiroo Hayashi
<div style="padding-right:3em;text-align:right;">
154 17 Hiroo Hayashi
right ident 3em
155 17 Hiroo Hayashi
</div>
156 1 Hans Ginzel
157 17 Hiroo Hayashi
<div style="text-align:center;">
158 17 Hiroo Hayashi
This is centered paragraph.
159 17 Hiroo Hayashi
</div></code></pre>
160 1 Hans Ginzel
161 17 Hiroo Hayashi
displays;
162 1 Hans Ginzel
163 17 Hiroo Hayashi
p. left aligned
164 1 Hans Ginzel
165 17 Hiroo Hayashi
p(. left ident 1em
166 1 Hans Ginzel
167 17 Hiroo Hayashi
p((. left ident 2em
168 17 Hiroo Hayashi
as well as for following lines
169 1 Hans Ginzel
170 17 Hiroo Hayashi
p>. right aligned
171 1 Hans Ginzel
172 17 Hiroo Hayashi
p)))>. right ident 3em
173 1 Hans Ginzel
174 17 Hiroo Hayashi
p=. This is centered paragraph.
175 1 Hans Ginzel
176 17 Hiroo Hayashi
**Note:** HTML tags need to be allowed to use the HTML tags (<div>).  See #15520-16 and #15520-17 for details.
177 1 Hans Ginzel
178 17 Hiroo Hayashi
h3. Horizontal rule 
179 1 Hans Ginzel
180 17 Hiroo Hayashi
@----@
181 1 Hans Ginzel
182 17 Hiroo Hayashi
displays: 
183 1 Hans Ginzel
184 17 Hiroo Hayashi
----
185 1 Hans Ginzel
186 17 Hiroo Hayashi
h3. Preformatted Text
187 1 Hans Ginzel
188 17 Hiroo Hayashi
<pre> <pre>**Your text won't become bold**</pre> </pre>
189 17 Hiroo Hayashi
190 17 Hiroo Hayashi
displays:
191 17 Hiroo Hayashi
192 17 Hiroo Hayashi
<pre>**Your text won't become bold**</pre>
193 17 Hiroo Hayashi
194 17 Hiroo Hayashi
h3. Blockquotes
195 17 Hiroo Hayashi
196 17 Hiroo Hayashi
You can use > at the beginning of each line and stack them for nested quotes:
197 17 Hiroo Hayashi
198 1 Hans Ginzel
<pre>
199 1 Hans Ginzel
>> Rails is a full-stack framework for developing database-backed web applications according to the Model-View-Control pattern.
200 1 Hans Ginzel
>> To go live, all you need to add is a database and a web server.
201 1 Hans Ginzel
> Great!
202 1 Hans Ginzel
</pre>
203 1 Hans Ginzel
204 17 Hiroo Hayashi
displays:
205 1 Hans Ginzel
206 1 Hans Ginzel
>>  Rails is a full-stack framework for developing database-backed web applications according to the Model-View-Control pattern.
207 8 Hans Ginzel
>>  To go live, all you need to add is a database and a web server.
208 8 Hans Ginzel
> Great!
209 1 Hans Ginzel
210 1 Hans Ginzel
h3. Unordered lists
211 1 Hans Ginzel
212 17 Hiroo Hayashi
Unordered lists use asterisks (@*@), pluses (@+@), and hyphens (@-@) as list markers
213 17 Hiroo Hayashi
214 1 Hans Ginzel
<pre>
215 1 Hans Ginzel
* Item 1
216 1 Hans Ginzel
* Item 2
217 1 Hans Ginzel
  * Item 21 (two spaces indentation)
218 1 Hans Ginzel
  * Item 22
219 1 Hans Ginzel
* Item 3
220 1 Hans Ginzel
</pre>
221 1 Hans Ginzel
222 1 Hans Ginzel
displays:
223 1 Hans Ginzel
224 1 Hans Ginzel
* Item 1
225 1 Hans Ginzel
* Item 2
226 1 Hans Ginzel
** Item 21
227 10 Hans Ginzel
** Item 22
228 10 Hans Ginzel
* Item 3
229 1 Hans Ginzel
230 1 Hans Ginzel
h3. Ordered lists
231 1 Hans Ginzel
232 17 Hiroo Hayashi
Ordered lists use numbers followed by periods.
233 17 Hiroo Hayashi
234 1 Hans Ginzel
<pre>
235 17 Hiroo Hayashi
1. Item 1
236 17 Hiroo Hayashi
3. Item 2
237 17 Hiroo Hayashi
2. Item 3
238 17 Hiroo Hayashi
  1. Item 3.1 (two spaces)
239 17 Hiroo Hayashi
  1. Item 3.2
240 1 Hans Ginzel
</pre>
241 1 Hans Ginzel
242 1 Hans Ginzel
displays:
243 1 Hans Ginzel
244 1 Hans Ginzel
# Item 1
245 1 Hans Ginzel
# Item 2
246 1 Hans Ginzel
# Item 3
247 1 Hans Ginzel
## Item 3.1
248 1 Hans Ginzel
## Item 3.2
249 1 Hans Ginzel
250 17 Hiroo Hayashi
Note that the actual numbers you use to mark the list have no effect on the output.
251 17 Hiroo Hayashi
252 1 Hans Ginzel
h3. Tables
253 1 Hans Ginzel
254 17 Hiroo Hayashi
Markdown does not have syntax for a table. Use an HTML table to write a table.
255 1 Hans Ginzel
256 17 Hiroo Hayashi
<pre><code><table>
257 17 Hiroo Hayashi
  <tr><td style="text-align:center;"><strong>UserID</strong></td><td style="text-align:center;"><strong>Name</strong></td><td style="text-align:center;"><strong>Group</strong></td><td style="text-align:center;"><strong>attribute list</strong></td></tr>
258 17 Hiroo Hayashi
  <tr><td>Starting with</td><td>a</td><td>simple</td><td>row</td></tr>
259 17 Hiroo Hayashi
  <tr><td style="text-align:center;" colspan="3">IT</td><td>align left</td></tr>
260 17 Hiroo Hayashi
  <tr><td>1</td><td>Artur Pirozhkov</td><td rowspan="2">Users</td><td style="text-align:right;">align right</td></tr>
261 17 Hiroo Hayashi
  <tr><td>2</td><td>Vasya Rogov</td><td style="text-align:center;">center</td></tr>
262 17 Hiroo Hayashi
  <tr><td rowspan="2">3</td><td rowspan="2">John Smith</td><td>Admin</td><td style="vertical-align:top;" rowspan="2">valign top</td></tr>
263 17 Hiroo Hayashi
  <tr><td>(root)</td></tr>
264 17 Hiroo Hayashi
  <tr><td rowspan="2">4</td><td rowspan="2">-</td><td>Nobody</td><td style="vertical-align:bottom;" rowspan="2">valign bottom</td></tr>
265 17 Hiroo Hayashi
  <tr><td>(anonymous)</td></tr>
266 17 Hiroo Hayashi
</table>
267 17 Hiroo Hayashi
</code></pre>
268 1 Hans Ginzel
269 17 Hiroo Hayashi
displays;
270 17 Hiroo Hayashi
271 17 Hiroo Hayashi
|=. *UserID*   |=. *Name*       |=. *Group*  |=. *attribute list* |
272 1 Hans Ginzel
|Starting with | a              |   simple   |row                 |
273 1 Hans Ginzel
|\3=.IT                                      |<. align left       |
274 1 Hans Ginzel
|1             |Artur Pirozhkov |/2.Users    |>. align right      |
275 1 Hans Ginzel
|2             |Vasya Rogov     |=. center   |
276 1 Hans Ginzel
|3             |John Smith      |Admin
277 1 Hans Ginzel
                                 (root)      |^. valign top       |
278 1 Hans Ginzel
|4             |-               |Nobody
279 1 Hans Ginzel
                                 (anonymous) |~. valign bottom    |
280 1 Hans Ginzel
281 17 Hiroo Hayashi
**Note:** HTML tags need to be allowed to use the HTML tags (<table>, <tr>, <td>).  See #15520-16 and #15520-17 for details.
282 1 Hans Ginzel
283 1 Hans Ginzel
h3. Table of content
284 1 Hans Ginzel
285 1 Hans Ginzel
<pre><code>{{toc}} => left aligned toc
286 1 Hans Ginzel
{{>toc}} => right aligned toc
287 1 Hans Ginzel
</code></pre>
288 1 Hans Ginzel
289 15 Hugues C.
Please keep in mind, that the toc-tag needs an empty line above and underneath it and no other text before and after it.
290 1 Hans Ginzel
291 11 Hans Ginzel
Example:
292 11 Hans Ginzel
293 17 Hiroo Hayashi
<pre><code>h1. headLineOne
294 11 Hans Ginzel
295 11 Hans Ginzel
h2. something
296 1 Hans Ginzel
297 1 Hans Ginzel
{{toc}}
298 1 Hans Ginzel
299 11 Hans Ginzel
h2. something more
300 11 Hans Ginzel
</code></pre>
301 11 Hans Ginzel
302 20 Dietmar H
h3. Footnotes
303 20 Dietmar H
304 20 Dietmar H
A footnote works very much like a reference-style link: it consists of a marker next to the text, e.g. <pre>This is a sentence.[^1]</pre> and a footnote definition on its own line anywhere within the document, e.g. <pre>[^1]: This is a footnote.</pre>
305 20 Dietmar H
306 20 Dietmar H
307 1 Hans Ginzel
h2. Macros
308 1 Hans Ginzel
309 1 Hans Ginzel
Redmine includes a macros system that lets you add custom functions to insert dynamic content in formatted text. You can learn about writing your own macros in [[RedmineMacros]]. Redmine also includes a few builtin macros:
310 1 Hans Ginzel
311 1 Hans Ginzel
{{macro_list}}
312 1 Hans Ginzel
313 1 Hans Ginzel
h2. Code highlighting
314 1 Hans Ginzel
315 24 Go MAEDA
Default code highlightment relies on "Rouge":http://rouge.jneen.net/, a syntax highlighting library written in pure Ruby. It supports many commonly used languages such as *c*, *cpp* (c++), *csharp* (c#, cs), *css*, *diff* (patch, udiff), *go* (golang), *groovy*, *html*, *java*, *javascript* (js), *kotlin*, *objective_c* (objc), *perl* (pl), *php*, *python* (py), *r*, *ruby* (rb), *sass*, *scala*, *shell* (bash, zsh, ksh, sh), *sql*, *swift*, *xml* and *yaml* (yml) languages, where the names inside parentheses are aliases. Please refer to [[RedmineCodeHighlightingLanguages]] for the full list of supported languages.
316 1 Hans Ginzel
317 1 Hans Ginzel
You can highlight code in your wiki page using this syntax:
318 1 Hans Ginzel
319 1 Hans Ginzel
<pre><code>``` ruby
320 1 Hans Ginzel
Place your code here.
321 1 Hans Ginzel
```</code></pre>
322 1 Hans Ginzel
323 1 Hans Ginzel
Example:
324 1 Hans Ginzel
325 1 Hans Ginzel
<pre><code class="ruby">
326 1 Hans Ginzel
# The Greeter class
327 1 Hans Ginzel
class Greeter
328 1 Hans Ginzel
  def initialize(name)
329 1 Hans Ginzel
    @name = name.capitalize
330 1 Hans Ginzel
  end
331 1 Hans Ginzel
 
332 1 Hans Ginzel
  def salute
333 1 Hans Ginzel
    puts "Hello #{@name}!"
334 1 Hans Ginzel
  end
335 1 Hans Ginzel
end
336 1 Hans Ginzel
</code></pre>
337 1 Hans Ginzel
338 1 Hans Ginzel
h2. Translation
339 1 Hans Ginzel
340 1 Hans Ginzel
Note that the following translations may not be up to date. Please refer to the original english documentation if needed.
341 1 Hans Ginzel
342 1 Hans Ginzel
* [[BrRedmineWikiFormatting|Português Brasileiro]]
343 1 Hans Ginzel
* [[RusRedmineTextFormatting|Русский]]
344 1 Hans Ginzel
* [[FrRedmineWikiFormatting|French]]
345 1 Hans Ginzel
* [[KoreanWikiFormatting|Korean]]
346 1 Hans Ginzel
* [[TurkishWikiFormatting|Türkçe]]
347 1 Hans Ginzel
* [[TraditionalChineseWikiFormatting|繁體中文]]
348 1 Hans Ginzel
* [[SimplifiedChineseWikiFormatting|简体中文]]