Attribute Lists¶
Summary¶
The Attribute Lists extension adds a syntax to define attributes on the various HTML elements in markdown’s output.
This extension is included in the standard Markdown library.
Syntax¶
The basic syntax was inspired by Maruku’s Attribute Lists feature (see web archive).
The List¶
An example attribute list might look like this:
{: #someid .someclass somekey='some value' }
A word which starts with a hash (#
) will set the id of an element.
A word which starts with a dot (.
) will be added to the list of classes
assigned to an element.
A key/value pair (somekey='some value'
) will assign that pair to the element.
Be aware that while the dot syntax will add to a class, using key/value pairs will always override the previously defined attribute. Consider the following:
{: #id1 .class1 id=id2 class="class2 class3" .class4 }
The above example would result in the following attributes being defined:
id="id2" class="class2 class3 class4"
HTML includes support for some attributes to be a single term, like checked
, for example. Therefore, the attribute
list {: checked }
would result in checked
if the output format is html
or
checked="checked"
if the output format is xhtml
.
Curly braces can be backslash escaped to avoid being identified as an attribute list.
\{ not an attribute list }
Opening and closing curly braces which are empty or only contain whitespace are ignored whether they are escaped or not. Additionally, any attribute lists which are not located in the specific locations documented below are ignored.
The colon after the opening brace is optional, but is supported to maintain consistency with other implementations. Therefore, the following is also a valid attribute list:
{ #someid .someclass somekey='some value' }
In addition, the spaces after the opening brace and before the closing brace are optional. They are recommended as they improve readability, but they are not required.
The Attribute List extension does not have any knowledge of which keys and/or values are valid in HTML. Therefore, it is up to the document author to ensure that valid keys and values are used. However, the extension will escape any characters in the key which are not valid by replacing them with an underscore. Multiple consecutive invalid characters are reduced to a single underscore.
Block Level¶
To define attributes for a block level element, the attribute list should be defined on the last line of the block by itself.
This is a paragraph.
{: #an_id .a_class }
The above results in the following output:
<p id="an_id" class="a_class">This is a paragraph.</p>
An exception is headers, as they are only ever allowed on one line.
A setext style header {: #setext}
=================================
### A hash style header ### {: #hash }
The above results in the following output:
<h1 id="setext">A setext style header</h1>
<h3 id="hash">A hash style header</h3>
See Also
By default, the Fenced Code Blocks extension includes limited support for attribute lists. To get full support, both extensions must be enabled.
Inline¶
To define attributes on inline elements, the attribute list should be defined immediately after the inline element with no white space.
[link](http://example.com){: class="foo bar" title="Some title!" }
The above results in the following output:
<p><a href="http://example.com" class="foo bar" title="Some title!">link</a></p>
If the tables extension is enabled, attribute lists can be defined on table cells. To differentiate attributes for an inline element from attributes for the containing cell, the attribute list must be separated from the content by at least one space and be defined at the end of the cell content. As table cells can only ever be on a single line, the attribute list must remain on the same line as the content of the cell.
| set on td | set on em |
|--------------|-------------|
| *a* { .foo } | *b*{ .foo } |
The above example results in the following output:
<table>
<thead>
<tr>
<th>set on td</th>
<th>set on em</th>
</tr>
</thead>
<tbody>
<tr>
<td class="foo"><em>a</em></td>
<td><em class="foo">b</em></td>
</tr>
</tbody>
</table>
Note that in the first column, the attribute list is preceded by a space; therefore, it is assigned to the table cell
(<td>
element). However, in the second column, the attribute list is not preceded by a space; therefore, it is
assigned to the inline element (<em>
) which immediately preceded it.
Attribute lists may also be defined on table header cells (<th>
elements) in the same manner.
Limitations¶
There are a few types of elements which attribute lists do not work with. As a reminder, Markdown is a subset of HTML and anything which cannot be expressed in Markdown can always be expressed with raw HTML directly.
- Code Blocks:
-
Code blocks are unique in that they must be able to display Markdown syntax. Therefore, there is no way to determine if an attribute list is intended to be part of the code block or intended to define attributes on the wrapping element. For that reason, the extension ignores code blocks. To define attributes on code blocks, the codehilite and fenced code blocks extensions provide some options.
- Nested Elements:
-
Markdown provides mechanisms for nesting various block level elements within other elements. However, attribute lists only ever get applied to the immediate parent. There is no way to specify that an attribute list should be applied some number of levels up the document tree. For example, when including an attribute list within a blockquote, the attribute list is only ever applied to the paragraph the list is defined in. There is no way to define attributes on the
blockquote
element itself. - Implied Elements:
-
There are various HTML elements which are not represented in Markdown text, but only implied. For example, the
ul
andol
elements do not exist in Markdown. They are only implied by the presence of list items (li
). There is no way to use an attribute list to define attributes on implied elements, including but not limited to the following:ul
,ol
,dl
,table
,thead
,tbody
, andtr
.
Usage¶
See Extensions for general extension usage. Use attr_list
as the
name of the extension.
This extension does not accept any special configuration options.
A trivial example:
markdown.markdown(some_text, extensions=['attr_list'])