My first steps with TiddlyWiki

 …

12th September 2015
This news is only a test
15th December 2014
TW on Node.js: usage basics
20th November 2014
get real tiddler title in edit/draft mode
18th November 2014
Date format
16th November 2014
Show the source code of a tiddler in code block (with proper line breaks)
External Image Path defined with a global macro
ViewTemplate conditional content inserted after title
Obtain current date/time
12th November 2014
Icons for tags, cool!
9th November 2014
Custom CSS style for tiddlers
27th October 2014
Playing with filters
New tiddler from custom template
get the current date and time
Table of contents
Playing with filters 2: filter operators
MyTabSample
Using tabs in a tiddler
MyTabSample2
Macros
filter with bullet list
Simple list of tiddlers
26th October 2014
Substory, subtiddlers, nested tiddlers
A shuffle filter operator
Tagging, list field, order of tiddlers
customize
Journal tiddlers
19th October 2014
Checkbox widget to set a field value
30th August 2014
ExampleTemplate
Nested list filter
17th August 2014
Install a plugin
Resources to explore
16th August 2014
display a tag pill
Find current TW version
11th August 2014
export filtered tiddlers?
8th August 2014
Working on an offline version of a client-server TW
7th August 2014
Export a static HTML snapshot
6th August 2014
TW on Node.js: tiddlers format and related limitations
Menu
Creating substories (nested tiddlers)
Preserving open tiddlers at startup
5th August 2014
Update browser history option
TW on Node.js: nested TW folders
TW on Node.js: pros and cons
TW on Node.js: installation for Ubuntu Linux
28th July 2014
Saving with TiddlyFox
search
usage
technical
task mgmt
resource
question
node.js
lists/filters
guide
feature idea
ask
answered
27th July 2014
sort tiddlers by order of creation date
TiddlyDesktop
Task management
Manipulating dates with buttons
Lists and filters
Tutorials and general information
Editing several tiddlers
TW Icons in tiddlers
Sidebar
19th July 2014
copy/move tiddlers from one wiki to another
Tagging with a tiddler name
Combine tags through drop down list
making a TW wiki accessible
using creation/modification date, sort by date
TiddlyDesktop pros and cons
modify all tiddlers in a list (e.g. add/remove tag) ?
Images, attach files?
18th July 2014
how to link easily a particular tiddler from an online tiddlywiki ?
Sidebar tabs customization
show all tags ? see untagged tiddlers?
show all tiddlers (links)
Open a system/shadow tiddler?
Access the Advanced Search
open a list of tiddlers
how to transclude an external tiddler, (e.g. from online tiddly) ?
Outline
Introduction
Transclusion mode

Menu

Erwan 10 years ago

Resources (+ info/doc...)

My notes about Node.js

My beginner's guide (barely started)

Questions

Answered

To search

To ask

Untagged questions

Misc (untagged or not in the previous categories)

This news is only a test

Erwan 9 years ago

Well, this wiki is very old news actually. The only new thing about it is this tiddler that I'm currently writing, for the purpose of testing the TWCS new news feature.

Let's hope it works well, and let's hope many wiki authors will have more interesting news than that to publish!

TW on Node.js: usage basics

Erwan 10 years ago

Main

  • To create a new TW folder: tiddlywiki mynewwiki --init server
    • Remark: this command only creates a directory mynewwiki containing the file tiddlywiki.info (general settings).
  • To start the server on an existing TW folder: tiddlywiki <tw folder> --server &
    • Note 1: the & is linux-specific (run in the background)
    • Note 2: several TW folders can be open at the same time using different ports, e.g: tiddlywiki <tw folder> --server 8090
  • To actually open the TW folder, go to http://127.0.0.1:8080/ in your browser (this connects you to the server started as above)

Converting/importing between standalone HTML TW and TW folders

  • Convert/import an existing standalone html TW to Node.js format:
    • Note 1: the destination TW folder <tw folder> must exist, i.e. it must at least have been initialized with --init server, but can also be already populated with tiddlers.
    • Note 2: only one file can be "loaded" at a time.
tiddlywiki <tw folder> --load <standalone tw html>
  • Convert/export from a Node.js TW folder to a standalone html TW:
    • Note: this process is also called "building TW5", since it generates a full TW5 instance.
tiddlywiki <tw folder> --rendertiddler $:/core/save/all <standalone tw html> text/plain

This version saves "all" the tiddlers, including the plugins needed for the node.js server version. This might cause errors of the wiki is made available on the internet.

tiddlywiki <tw folder> --rendertiddler $:/plugins/tiddlywiki/tiddlyweb/save/offline <standalone tw html> text/plain

This (recommended) version will save only the content, not the plugins needed by the node.js server version (in the same way as in standard standalone html versions).

See also:

Sources

get real tiddler title in edit/draft mode

Erwan 10 years ago

Normally the title of a tiddler MyTiddler is changed to Draft of 'MyTiddler' when the tiddler is in edit mode.

To obtain the title of the current tiddler, whether the tiddler is in view or in edit (draft) mode:

<$list filter=[all[current]get[draft.of]] emptyMessage={{!!title}}/>
get real tiddler title in edit/draft mode

using http://tiddlywiki.com/#FilterOperator%3A%20get

Date format

Erwan 10 years ago

Don't forget "leading zero" to make date stamps look always the same:

<<now "YYYY-0MM-0DD-0hh0mm">>

2025-04-25-0052

could be e.g. 2014-02-03-0014

whereas

<<now "YYYY-MM-DD-hhmm">>

2025-4-25-52

would be 2014-2-3-14.

Show the source code of a tiddler in code block (with proper line breaks)

Erwan 10 years ago

To show the source content of a tiddler, for instance $:/core/ui/Buttons/new-journal-here:

<pre>
  <$view tiddler="$:/core/ui/Buttons/new-journal-here"/>
</pre>

  \define journalButtonTags()
[[$(currentTiddlerTag)$]] $(journalTags)$
\end
\define journalButton()
<$button tooltip={{$:/language/Buttons/NewJournalHere/Hint}} aria-label={{$:/language/Buttons/NewJournalHere/Caption}} class=<<tv-config-toolbar-class>>>
<$action-sendmessage $message="tm-new-tiddler" title=<<now "$(journalTitleTemplate)$">> tags=<<journalButtonTags>>/>
<$list filter="[<tv-config-toolbar-icons>prefix[yes]]">
{{$:/core/images/new-journal-button}}
</$list>
<$list filter="[<tv-config-toolbar-text>prefix[yes]]">
<span class="tc-btn-text"><$text text={{$:/language/Buttons/NewJournalHere/Caption}}/></span>
</$list>
</$button>
\end
<$set name="journalTitleTemplate" value={{$:/config/NewJournal/Title}}>
<$set name="journalTags" value={{$:/config/NewJournal/Tags}}>
<$set name="currentTiddlerTag" value=<<currentTiddler>>>
<<journalButton>>
</$set></$set></$set>

Works also for the current tiddler, of course:

<pre>
  <$view/>
</pre>

  To show the source content of a tiddler, for instance [[$:/core/ui/Buttons/new-journal-here]]:

```
<pre>
  <$view tiddler="$:/core/ui/Buttons/new-journal-here"/>
</pre>
```

<pre>
  <$view tiddler="$:/core/ui/Buttons/new-journal-here"/>
</pre>

Works also for the current tiddler, of course:

```
<pre>
  <$view/>
</pre>
```

<pre>
  <$view/>
</pre>


From Ton Gerner's "exploration of TW5" http://tw5exploration.tiddlyspot.com/#%24%3A%2F_macros%2Fcodefilter

From Ton Gerner's "exploration of TW5" http://tw5exploration.tiddlyspot.com/#%24%3A%2F_macros%2Fcodefilter

External Image Path defined with a global macro

Erwan 10 years ago

http://tb5.tiddlyspot.com/#External%20Image%20Path

ViewTemplate conditional content inserted after title

Erwan 10 years ago

http://tb5.tiddlyspot.com/#Conditional%20ViewTemplate%20Section

Obtain current date/time

Erwan 10 years ago

See http://tiddlywiki.com/#NowMacro

Example:

<<now "On est le DD/MM/YY, il est hhhmm">>

On est le 25/4/25, il est 0h52

Icons for tags, cool!

Erwan 10 years ago

An icon (as well as a coulour of course) can be associated with a tag in the tag manager (found in the sidebar, "more" tab, "Tags" sub-tab).

See also the tiddler customize, with the icon in the title (see in particular how it is implemented with the fields)

Custom CSS style for tiddlers

Erwan 10 years ago

A CSS stylesheet is a tiddler tagged $:/tags/Stylesheet. It should be assigned type text/css (normally). Anything defined in this stylesheet is applied immediately (assuming the definition properly overrides the current theme).

To apply a particular CSS style to the tiddlers tagged with a tag MyTag, define a stylesheet (as above) which defines the class .tc-tagged-MyTag.

Remark: in order for the CSS rule .tc-tagged-ColourBorders to be applied (the border part), it must override the rule tc-tiddler-frame which contains:

border: 1px solid #FFF;

And apparently this requires the overriding rule to redefine completely the border style: width, style and colour (i.e. it does not work if it redefines only the style and width, it seems).

Sources: