mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2024-11-16 23:04:50 +00:00
9c0d6a46cc
* html-comment, that can be used in the pragma area * add commentpragma test * fix typo * fix typo and change comments ab bit * combine html-comment and pragma-comment and add some docs, how to use it * Make docs simpler by removing caching info * change h2 wording
116 lines
3.3 KiB
Plaintext
116 lines
3.3 KiB
Plaintext
caption: HTML
|
||
created: 20131205160816081
|
||
modified: 20210614100305329
|
||
tags: WikiText
|
||
title: HTML in WikiText
|
||
type: text/vnd.tiddlywiki
|
||
|
||
! HTML tags and comments
|
||
|
||
HTML tags and comments can be used directly in WikiText. For example:
|
||
|
||
```
|
||
<article class="hello">
|
||
This is my nice and simple block of text. HelloThere
|
||
<!-- This comment will not appear in the wikified output -->
|
||
</article>
|
||
```
|
||
|
||
!! Pragma Comments
|
||
|
||
<<.from-version 5.2.0>> Comments can now be freely intermixed with pragmas as well as within the main body of a block of wikitext.
|
||
|
||
```
|
||
<!-- NEW: Comment that describes the macro -->
|
||
\define test()
|
||
some text <!-- inline comment -->
|
||
\end
|
||
|
||
<<test>>
|
||
```
|
||
|
||
! Important
|
||
|
||
<<.tip """[[Widgets share the same syntax as HTML tags|Widgets in WikiText]], and so the following information applies to them, too.""">>
|
||
|
||
! Block mode versus Inline mode
|
||
|
||
To get the content of an HTML element to be parsed in block mode, the opening tag must be followed by two linebreaks.
|
||
|
||
Without the two linebreaks, the tag content will be parsed in inline mode which means that block mode formatting such as wikitext tables, lists and headings is not recognised.
|
||
|
||
! Self closing elements
|
||
|
||
The following tags are treated as 'void'. This means that `<tag>` is treated as if it were `<tag/>`, and that no terminating `</tag>` is needed (if one is provided it will be ignored and treated as plain text).
|
||
|
||
* `<area>`, `<base>`, `<br>`, `<col>`, `<command>`, `<embed>`, `<hr>`, `<img>`, `<input>`, `<keygen>`, `<link>`, `<meta>`, `<param>`, `<source>`, `<track>`, `<wbr>`
|
||
|
||
If you don’t close any other tag then it will behave as if the missing closing tag were at the end of the tiddler.
|
||
|
||
! Attributes
|
||
|
||
In an extension of conventional HTML syntax, attributes of elements/widgets can be specified in several different ways:
|
||
|
||
* a literal string
|
||
* a transclusion of a TextReference
|
||
* a transclusion of a [[macro/variable|Macros in WikiText]]
|
||
* as the result of a [[Filter Expression]]
|
||
|
||
!! Literal Attribute Values
|
||
|
||
Literal attribute values can use several different styles of quoting:
|
||
|
||
* Single quotes (eg `attr='value'`)
|
||
* Double quotes (eg `attr="value"`)
|
||
* Tripe double quotes (eg `attr="""value"""`)
|
||
* No quoting is necessary for values that do not contain spaces (eg `attr=value`)
|
||
|
||
Literal attribute values can include line breaks. For example:
|
||
|
||
```
|
||
<div data-address="Mouse House,
|
||
Mouse Lane,
|
||
Rodentville,
|
||
Ratland."/>
|
||
```
|
||
|
||
By using triple-double quotes you can specify attribute values that contain single double quotes. For example:
|
||
|
||
```
|
||
<div data-address="""Mouse House,
|
||
"Mouse" Lane,
|
||
Rodentville,
|
||
Ratland."""/>
|
||
```
|
||
|
||
!! Transcluded Attribute Values
|
||
|
||
Transcluded attribute values are indicated with double curly braces around a TextReference. For example:
|
||
|
||
```
|
||
attr={{tiddler}}
|
||
attr={{!!field}}
|
||
attr={{tiddler!!field}}
|
||
```
|
||
|
||
!! Variable Attribute Values
|
||
|
||
Variable attribute values are indicated with double angle brackets around a [[macro invocation|Macro Calls in WikiText]]. For example:
|
||
|
||
```
|
||
<div title=<<MyMacro "Brian">>>
|
||
...
|
||
</div>
|
||
```
|
||
|
||
!! Filtered Attribute Values
|
||
|
||
Filtered attribute values are indicated with triple curly braces around a [[Filter Expression]]. The value will be the first item in the resulting list, or the empty string if the list is empty.
|
||
|
||
This example shows how to add a prefix to a value:
|
||
|
||
```
|
||
<$text text={{{ [<currentTiddler>addprefix[$:/myprefix/]] }}} />
|
||
```
|
||
|