Заметки по использованию TiddlyWiki

This page contains our TiddlyWiki Cheet Sheet and collection of useful resources for using TiddlyWiki.
Sites: tiddlywiki.com, Wiki, alternativeto.net
See also our short review of this program.

Quick navigation:
- our Cheat Sheet
- recipes
- outer resources

 

 


our TiddlyWiki Cheat Sheet

(contains quick references to WikiText at tiddlywiki.com)

Block Quotes

<<< ... <<<    - multi-line block quote

<<< ... <<< ... - multi-line block quote with citation

> ... - single-line block quote

 

Code Blocks

``` ... ```  - code block

 

Dashes

-- - n-dash
--- - m-dash

 

Definitions

; Term 1
: Definition 1
; Term 2
: Definition 2

 

Formatting

`...`   or  ``...``  -  line of code

''...''  -  bold

//...//  - italic

__...__  -  underscore

^^...^^  -  superscript

,,...,,  -  subscript

~~...~~  -  strikethrough

 

HTML tags

<!-- ... -->  -  comments

"HTML decoding" means replacing HTML entities that represent special characters with that character:
    · &amp; replaced with &
    · &nbsp; replaced with ' ' (non breaking space)
    · &lt; replaced with <
    · &gt; replaced with >
    · &quot; replaced with "
    · &#94; replaced with ^
    · &#124; replaced with |
    · &#96; replaced with `
 

Hard Linebreaks

"""..."""   -  predefined linebreaks

 

Headings

! Heading level 1

!!!!!! Heading level 6

 

Horizontal Rule

---  -  horizontal rule

 

Images

[img[...]]
[img width=## [tooltip|...]]
{{...}}  -  by transcluding tiddler with image. The disadvantage of this approach is that there is no direct way to control the size of the image.

 

Linking

[[Tiddler Title]]  -  link to a tiddler by title
[[Displayed Title|Tiddler Title]]  -  link to a tiddler with Title

[[http://mal-bioit.ru]]  -  link to a external site
[[Displayed Title|http://mal-bioit.ru]]  -  link to a external site with Title

[ext[Tittle|index.html]]  - using a relative path

CamelCase  -  automatically create a link to another tiddler
http://mal-bioit.ru  -  automatically create a link to site
~  -  suppress from being recognised as link

 

Lists

* First list item
** A subitem
* Second list item  -  bulleted list

# First list item
#* A subitem
# Second list item  -  numbered list with bulleted subitem

 

Macro Calls

<<macroname parameters>> (see Examples)
(A macro is a named snippet of text. WikiText can use the name as a shorthand way of transcluding the snippet.)

 

Macro Definitions

 Like any pragma, this can only appear at the start of a tiddler.

Example of a multi-line macro:
\define sayhi(name:"Bugs Bunny" address:"Rabbit Hole Hill")
Hi, I'm $
name$ and I live in $address$.
\end


Example of a single line macro:
\define sayhi(name:"Bugs Bunny") Hi, I'm $name$.

A more formal presentation of this syntax.

Macros are available to the tiddler that defines them, plus any tiddlers that it transcludes.
To make a macro available to all tiddlers, define it in a tiddler that has the tag $:/tags/Macro.
It is also possible to write a macro as a JavaScript module. JavaScript macros are available to all tiddlers, and offer the maximum flexibility.

 

Paragraphs

Single line breaks are ignored within paragraphs.
To mark the end of a paragraph in TiddlyWiki you need to type enter twice to create a double line break.

 

Styles and Classes

@@.myStyle
...
@@

@@background-color:yellow;
...
@@

Multiple styles and classes can be mixed.

 

Tables

|!Cell1 |!Cell2 |
|Cell3 |Cell3 |

(Exclamation marks are used to indicate header cells.)

|Left aligned content |
| Right aligned content|
| Centred content |
|+++ a very wide column so we can see the alignment +++|

(Table cell alignment is controlled by inserting space characters before and/or after the cell content.)

|^top left |^ top center |^ top right|
|middle left | middle center | middle right|
|,bottom left |, bottom center |, bottom right|

(Vertical alignment of cells is done by inserting either a ^ for top alignment or a , for bottom alignment as the first character of a cell.)

If you need to have a ^ or a , as the first character of a left aligned cell, you can use HTML escaping:
^  -  &#94;
,  -  &#44;

|Cell1 |Cell2 |Cell3 |Cell4 |
|Cell5 |Cell6 |Cell7 |<|
|Cell5 |~|Cell7 |Cell8 |
|>|Cell9 |Cell10 |Cell11 |

(To merge a table cell with the one above, use the special cell text ~. To merge a cell with the one to its left use the text <. To merge one to its right use >. )

|myclass anotherClass|k   - assigns the CSS classes "myclass" and "anotherClass" to the table
|This is a caption |c   - gives the table the caption "This is a caption"
|Cell1 |Cell2 |
|Cell3 |Cell3 |
|Header|Header|h
   - adds a header row of cells with the text "Header"
|Footer|Footer|f   - adds a footer row of cells with the text "Footer"

(Table CSS classes, captions, headers and footers can be specified as special pseudo-rows. )

 

Transclusion

You can incorporate the content of one tiddler within another using the Transclusion notation:
{{MyTiddler}}  - simple transclusion of a single tiddler. This is a shortcut for {{MyTiddler!!text}} 

{{MyTiddler!!field}}  -  transclusion a specified field of a tiddler

{{TargetTiddler||TemplateTitle}}   -  transclusion with templates

 

Typed Blocks

$$$image/svg+xml
   <svg xmlns="http://www.w3.org/2000/svg" width="150" height="100">
      <circle cx="100" cy="50" r="40" stroke="black" stroke-width="2" fill="green" />
   </svg>
$$$

 

Variables

\define tags-of-current-tiddler() {{!!tags}}
The tags are: <<
tags-of-current-tiddler>>
  - The macro returns the value of the tiddler's 'tags' field

<<list-links filter:"[<currentTiddler>backlinks[]]">>  -  list all tiddlers that link to this one

 

Widgets

Widgets provide rich functionality within WikiText. They have the same syntax as HTML elements, but the tag name always starts with $. For example:

<$button message="tm-close-tiddler">Close Me!</$button>

 

11


TiddlyWiki recipes

(contains quick references to WikiText at tiddlywiki.com)

Creation of "Contents" tab (youtube)

1. Create new tiddler with name "Contents".

2. Place $:/tags/SideBar in the "tags" field. This add tiddler to tab panel.

3. Add new field list-before with value $:/core/ui/SideBar/Open . This place our tiddler before tab "Open" in the tab panel.

4. Go to ControlPanel -> Settings -> Default Sidebar Tab and change drop-down list to Contents. This make our tab default.

4. Write down code
<div class="tc-table-of-contents">
   <<toc-selective-expandable 'Contents' sort[title]>>
</div>

The inner macro creates list of tiddlers that have tag 'Contents'. The list is sorted by tittle.
The outer macro decorates earlier created list as content menu (foremost throw away numbers in front of items).

5. Place tag Contents in all Tiddlers that you want to add in Contents tab. Or you can place as tag title of other tiddler to create submenu.

 

 

Tracking Tasks in TiddlyWiki (youtube)

 

1. Content of 'ToDo' tiddler:
<$list filter="[!has[draft.of]tag[task]!tag[done]sort[created]]">
   <$checkbox tag="done">
      <$link to={{!!title}}>
         <$view field="created" format="date" template="DDth mmm hh:mm"/> - <$view field="title"/>
      </$link>
   </$checkbox>
</$list>

1. Content of 'Completed' tiddler:

<$list filter="[!has[draft.of]tag[task]tag[done]sort[created]]">
   <$checkbox tag="done">
      ~~
         <$link to={{!!title}}>
            <$view field="title"/>
         </$link>
      ~~
   </$checkbox>
</$list>

3. Tiddlers with particular tasks must contain tag 'task'.

 

 

Ofiicial site: tiddlywiki.com


outer resources

(contains quick references to WikiText at tiddlywiki.com)

YouTube:

  • TiddlyWiki Hosting Hybrid (31:54, 2016, Andrew Myers) - "Some cool synergies between Dropbox and Github on this hosting method." - Good narration but sound with noise

 

  • Tiddlywiki 5 (collection of 19 videos from different authors, 1-37 minutes, 2015-16)
  • Tiddlywiki (collection of 18 videos from different authors, 1-18 minutes, 2015-16)

 

Articles:

Learning TiddlyWiki 5 (richshumaker.com, 2014)
Organizing Yourself with TiddlyWiki (scottnesbitt.info, 2017)

Build Your Own Personal Wiki Accessible from Any PC (howtogeek.com, 2010)
How to Install a Tiddlywiki Plugin: 12 Steps (with Pictures) (wikihow.com)
Weekend Project: Set Up a Personal Wiki on Linux with TiddlyWiki (linux.com, 2011)
TiddlyWiki 5 - How Does This Work? (rnd-diversions.blogspot.ru, 2014)
TiddlyWiki in the Sky (or TiddlyWeb for TW5) (pleasantprogrammer.com, 2015)

 

TiddlyWiki has 2 actual generation with slightly different syntax: the classic TiddlyWiki and modern TiddlyWiki 5. The last was issued in 2014 September 20. So almost all resources earlier that data is outdated.

Outdated and not interesting resources:

Videos with bad sound/narration
- 08/25/2016 Create your first TiddlyWiki (50:53, 2016, DesignWriteX SteveSchneider)
- Flicker-Dropbox for TiddlyWiki (38:28, 2016, DesignWriteX SteveSchneider)
- 07-05-2016 Working with IFTTT and TiddlyWiki (37:04, 2016, DesignWriteX SteveSchneider)
- Part 2 Class Session Helping Lindsey With Her TiddlyWiki (21:11, 2016, DesignWriteX SteveSchneider) - all videos from this author

Outdated playlists and videos
-
TiddlyWiki Stuff (collection of 44 videos from different authors, 1-14 minutes, 2009-12, MakeZable)
-
TiddlyWiki Classic Clinic (2:18:15, 2014, Eric Shulman)

 

Several varieties of TiddlyWiki Cheat Sheet that can be found in the internet. They all refer to classic TiddlyWiki and not completely fit to modern TiddlyWiki5.
1)
tcm.phy.cam.ac.uk - pdf, 2007.
2)
cheatography.com - pdf, 2012-14, by Simon Fermor = appservgrid.com
3) onemorebug.com - doc, ?2007?
4)
tiddlypocketbook.com

 

It's better to see actual formatting techniques at of.site or connect plugin with markdown.

 

 


Different notes.

Plugin "File Backups 0.3.4" on Firefox 58.0.2 works with bugs and can even destroy file with TiddlyWiki.

Plugin "savetiddlers" on Firefox 58.0.2 runs without problem, but it has limitation on where edited file is located. And with it you can't use browser option "Always ask you where to save files". It's better to use desktop edition of TiddlyWiki.

 

Add new comment

Plain text

  • No HTML tags allowed.
  • Lines and paragraphs break automatically.
  • Web page addresses and email addresses turn into links automatically.