Interesting article giving the perspective of someone who has been away from TiddlyWiki for a few years:
Way back in the mists of time (actually, January 2009) I wrote about a really cool tool called TiddlyWiki, a “non-linear personal web notebook”. Fast forward to today and I just had an out of body experience: Completely by accident I found a TiddlyWiki that I started when I wrote that piece and it still works!
Finding code that works flawlessly after just two or three years is magical enough but after seven years?! And given that TiddlyWiki is written as a single page Web application and considering how different browsers are now than they were in 2009, the fact that the old version of TiddlyWiki still works is not short of miraculous.
A thesis notebook based on TiddlyWiki.
This is an example of a thesis notebook powered by TiddlyWiki 5.0.8-beta.
TiddlyWiki is a great piece of software created by Jeremy Ruston. It allows you, among other things, to take notes, organize ideas, store information, and display all your stuff the way you want. It is an incredibly flexible tool you can adapt to fit almost all your needs.
This TiddlyWiki has been customized to serve as a philosophy notebook centered around authors, books and papers, concepts and theories, and personal notes. I use it along with Zotero, which is a dedicated bibliography software. Both are free, open source projects. TiddlyWiki can be downloaded at https://tiddlywiki.com.
A desktop application for TiddlyWiki, running on Windows.
https://lamusia.github.io/#ATWiki
TiddlyWiki for Windows. A unique non-linear notebook for capturing, organising and sharing complex information.
buggyj has created several useful plugins, including a WYSIWYG HTML editor, a configurable calendar and tag lists with draggable ordering.
A collection of customisations and macros from Danielo Rodriguez.
http://braintest.tiddlyspot.com/
This is my personal tiddlywiki file for testing.
Here I will post the tools and Macros that I develop for this awesome tool. That way, all the help the comunity gave me can came back to the comunity again.
Task & Delegation Tracking, Meetings & Agenda Items, Project Roles, Progress & Status Updates, Reference Items, Tickler Calendar, Conversation Logging, Book Notes & Library, and More!
Cardo is a standalone, browser-based tool that can be used as a simple task manager, or as a complex Project Management system (and indeed, I do use it this way in my daily work) as well as a fully Wiki-ized personal knowledge store. It runs completely independently in the browser, even without an Internet connection, making it possible to carry around on a USB stick, or to use on the morning commute.
An adaptor to enable TiddlyWiki to sync changes with a CouchDB database.
https://github.com/wshallum/couchadaptor
CouchDB sync adaptor for TiddlyWiki 5. Requires TiddlyWiki >= 5.1.2.
Works in limited testing. Not sure how well it handles conflicts.
A guide to creating a baby journal with TiddlyWiki.
http://a-penguin-in-redmond.blogspot.co.uk/2014/02/creating-baby-journal-with-tiddlywiki-5.html
Keeping a journal about your baby is fun. It allows you to keep track of those events in your baby's life and development that are most important to you, and to tell them in your own words. [...]
There are plenty of online services that can help to keep such a diary, but you need to have an internet connection to access them, and you have to trust them to keep your data safe.
A dark palette for TiddlyWiki.
https://draculatheme.com/tiddlywiki
Install manually
Open the Control Panel > Appereance > Palette, scroll down and clone a platte, rename it to Dracula and copy the code from the website.
Activating theme
- Open the Control Panel > Appereance > Palette
- Scroll down and select Dracula
- Boom! It's working
A adaptation of TiddlyWiki perfect for using as a Notebook sysetem.
https://akhater.github.io/drift/
Drift is an adaptation of TiddlyWiki with the goal of helping you Collect. Organize. and Grow. your ideas while keeping tab on how they interconnect together and fluidly Drift from one to another.
The 2 main components of Drift are TWCrosslinks and DailyNotes so you never miss an idea
Drift was inspired by TiddlyBlink / Stroll and adapted to fit my needs.
A TiddlyWiki plugin for kanban-like organization in the style of Trello™ using boards, lists, and cards.
Dynamic Tables is a set of macros that allow you to create tables where the rows are created from tiddlers and the columns from the tiddler fields, or where the columns are created from tiddlers and the rows from their fields. Individual cells can be edited on the fly. Row tables can be sorted by columns and column tables can be sorted by rows.
A plugin that allows to encrypt your tiddlers individually Danielo Rodriguez.
http://danielorodriguez.com/TW5-EncryptTiddlerPlugin/
Advantages:
- You can specify a different password for each tiddler if you want.
- You don't have to encrypt your whole wiky.
- If you forget your password, you only lose a tiddler.
- It's possible to edit the tiddler content , tags and fields except the encrypt field after encryption.
- [...]
An extension for Mozilla Firefox that smoothes out some of the friction from TiddlyWiki's built-in HTML5 fallback saver, making it almost as easy to use as TiddlyFox. The workflow is intended to work out of the box, without configuration.
https://github.com/pmario/file-backups which contains links to the documentation and introduction video(s).
A chrome version is planned!
This wiki gives examples for various filters and their use in the list widget
http://tobibeer.github.io/tw/filters/#Filter%20Examples
This wiki gives examples for various filters and their use in the list widget. A good starting point to understand what filters yield which results also is test-filters.js.
The Font Awesome 5 Free SVG images collection converted to tiddlers that you can easily import (drag'n'drop) in your wiki.
An adaption of the "Ghostwriter" theme for TiddlyWiki.
https://ibnishak.github.io/ghostwriter/
Ghostwriter is a popular, minimalist and mobile responsive theme for the blogging platform ghost. This is an adaptation for TiddlyWiki.
Creates bubble maps of Biblical texts.
http://giffmex.org/gospels.bubbles.html#Gospels%20Bubbles
This TiddlyWiki, which is still under construction, has several features that together make it lightning fast to find passages, types of passages, themes, people, places and images in the New Testament Gospels. The bubblemaps are color-coded overviews of each Gospel. Each type of passage (miracle story, parable, etc) was assigned a color. Bubblemaps allow you to do three things:
- The bubblemaps are color-coded overviews of each Gospel. Each type of passage (miracle story, parable, etc) was assigned a color. Bubblemaps allow you to do three things:
- See how the different types of passages are distributed throughout each Gospel.
- Hover over passages to see the verses and titles.
- Click on a passage to open it and see the themes and other data it mentions.
- The themes by passage indexes are lists of the passages in each Gospel, followed by the themes and other data found in the passage. Clicking on a theme calls up a list of all the passages that mention that theme.
- The indexes of themes contain lists of links to each theme, person, group, place and image. Clicking on a theme calls up a list of all the passages that mention that theme.
- There is a search window hidden in the right hand menu. Use the search window to find passages quickly, by typing things like sower or paralytic. Click the arrows in the upper right of the screen to open the menu and search.
This new textbook from Soren Bjornstad is highly recommended for learning TiddlyWiki. The presentation and design are also a first class example of using TiddlyWiki.
From the site:
Grok TiddlyWiki is a textbook that helps you build a deep, lasting understanding of and proficiency with TiddlyWiki through a combination of detailed explanations, practical exercises, and spaced-repetition reviews of prompts called takeaways.
An adaptation of the TiddlyWiki powered GTD® system formerly known as MonkeyGTD for TiddlyWiki version 5.
GSD5 is a Getting-Thing-Done tool for TiddlyWiki5 based off the mGSD classic TiddlyWiki.
A collection of helpers by Thomas Elmiger, among them a tweet button macro, a text-stretch solution, a snippet extraction macro and a tiddler that installs a scroll-to-top button via drag-and-drop.
Quick Extensions for TiddlyWiki 5 – […] As I take from the community, I am happy if I can give back. You can use my stuff to do whatever you like, but remember to save a back-up first.
Thomas
A guide in Russian to creating an online shop with TiddlyWiki. No serverside code is needed, instead orders are handled by Disqus.
An extensive collection of hints and tips from Jed Carty.
http://inmysocks.tiddlyspot.com
I made this so that some of my friends with absolutely no coding experience could use some of the better features of TW5 without having to learn much. I am hopefully going to continue updating it as I learn new things. There isn't really anything here that isn't available in plenty of other places, but I figured that since I spent a while putting it together and people keep saying that TW needs more documentation I would post it here.
A step by step guide to running TiddlyWiki on a CentOS Virtual Private Server.
http://www.rosehosting.com/blog/install-and-run-tiddlywiki-on-a-centoos-6-vps-using-nginx/
In this tutorial we will guide you through the steps of installing and running TiddlyWiki on a CentOS 6 VPS.
We will also install and configure Nginx as a reverse proxy, so you can run TiddlyWiki behind Nginx.
Some palettes by JD.
http://j.d.palette.tiddlyspot.com/
You can install any or all of these by dragging any of the below links into your Tiddlywiki:
- Brown One
- C8 Dark
- Cool Mint
- Neonize
- Spartan Day
- Spartan Night
A complete online shop made in TiddlyWiki!
A collection of extensions by @malgam
http://malsandbox.tiddlyspot.com
The "loadnew" plugin provides the JavaScript module $:/plugins/malgam/loadnew/loadnew.js that implements an incremental load command for Tiddlywiki 5.
The javascript code is based on the built-in module $:/core/modules/commands/load.js that loads tiddlers from a Tiddlywiki file into a node.js Tiddlywiki instance. This command loads all non-system tiddlers, irrespective of whether they have been modified since last loaded. As a result, all tiddlers in the node.js tiddlers folder will end up with a new modification date.
In contrast, the loadnew command only loads tiddlers that either don't already exist in the tiddlers folder, or have a newer modified date than the existing tiddler.
With a backup strategy that uses a file system snapshot process to preserve historical versions of tiddlers, the loadnew command minimises the sizes of the resulting snapshots.
Mathcell allows spreadsheet-like abilities in a completely contained TiddlyWiki.
http://mathcell.tiddlyspot.com/
Mathcell allows spreadsheet-like abilities in a completely contained TiddlyWiki. Additional abilities allow it work as a general math engine.
A Spanish guide to using TiddlyWiki on Android.
http://3palmeras.wordpress.com/2014/11/05/microblogging-con-tiddlywiki/
Tiddlywiki software is prodigious based on javascript which is capable of holding a notepad that can be edited with Internet Explorer or function as a full blog, contained in a single file.
Translation by Google Translate
An adaption of the "Moments" theme for TiddlyWiki.
http://tesseractmoments.surge.sh/
Moments is a beautiful free and responsive theme available for wordpress from here: http://www.s5themes.com/theme/moments/. This is an adaptation of the same for TW5 platform. All the design credits goes to the site and the original designer. If TW5 is going to be here for 25 years, might as well suit up.
This theme by JD features a left side bar, advanced functionality from the search bar and plenty of customizability built in.
A terrific demo of drag and drop, pan and zoom, and other sophisticated touch effects. Based on the muuri plugin by Uwe Stuehler.
Notebook is a clean, uncluttered theme for TiddlyWiki.
https://nicolas.petton.fr/tw/notebook.html
Notebook is a clean, uncluttered theme for TiddlyWiki.
- The theme is responsive and comes with mobile support through the included notebook-mobile plugin.
- Notebook comes with 3 default colour palettes, a grey, beige and dark one. To switch between colour palettes, click the color palette switch button in the top bar.
- Notebook uses a custom left sidebar, with another sticky bar at the top of the page (or at the bottom on mobile).
NoteSelf is your personal, private, customizable, Evernote-like experience. You want cloud? Fine! You don't? Fine too! It's all yours, It's your decision! Why not be a bit selfish?
NoteSelf is the perfect place to store your ideas, notes, thoughts, tips, tricks, recipes... whatever you want to put into it! NoteSelf will store, index, and make it easily searchable, so you will find it instantly whenever you need it!
You already know and love Evernote, we know it. It is comfortable, it syncs, has search capabilities... Wow, it's almost perfect, but what about:
- Privacy - Everything is stored on the Evernote's servers!
- Customization - If you don't like the interface of Evernote, there's nothing you can do
NoteSelf is built on top of TiddlyWiki, a powerful, free, highly customizable and open-source personal wiki. We took the best of it, it's powerful customization system, and mixed it with one of the best embedded databases available, PouchDb, for bringing the synchronization capabilities you need.
A quick guide to using TiddlyWiki (written in German)
http://michaelsonntag.net/notizen-mit-tiddlywiki-systemuebergreifend-nutzen
Those using multiple different computer platforms (if only PC and Android) knows for certain: You would like to sync notes across computers and thereby be independent of any apps or services. I am concerned at any rate so and so I am constantly looking for the perfect solution.
With TiddlyWiki I found it mostly. As the name suggests, it TiddlyWiki is a Wikisystem. In contrast to all other wikis, TiddlyWiki is a single HTML file that runs in the browser and thus can be used on all modern operating systems. And because there is only one file, it can be very easily via the well-known cloud services (Dropbox, Google Drive, ownCloud) or synchronized with FTP or used on a USB stick.
(Translation from German by Google Translate)
A fast Forth interpreter for the Commodore PET, written in 6502 assembly language. The TiddlyWiki containing program documentation is automatically generated from the source code: see https://github.com/chitselb/pettil.
Objectives of the project are, in no particular order:
- make a Forth that runs on my Commodore PET 2001
- have fun
- improve my "6502 assembly golf" skills
- find other people who are interested in this project
Embed Reveal.js presentations inside your TiddlyWiki.
https://sukima.github.io/tiddlywiki-reveal-js/
reveal.js enables you to create beautiful interactive slide decks using HTML.
With the power of TiddlyWiki and Reveal.js one can…
- …make an interactive tiddler with fancy animations
- …Make it go full screen for professional keynote
- …Distribute the slideshow with examples and additional resources in one HTML file
An extension for Google Chrome and Mozilla Firefox that smoothes out some of the friction from TiddlyWiki's built-in HTML5 fallback saver, making it almost as easy to use as TiddlyFox once it is set up correctly.
Detailed description of setting up TiddlyWiki on Node.js on OS X.
http://undefinedvalue.com/2015/04/02/setting-personal-tiddlywiki-server-os-x
For a new job, I decided to set up a personal wiki to keep notes. I wanted to keep it simple, meeting these requirements:
- All the data is in a Dropbox folder (so it can be automatically synced between machines)
- It must support Markdown syntax
After looking at the options, I settled on TiddlyWiki. I've used "classic TiddlyWiki" before, and liked its simplicity, but I was always a little annoyed with the weird steps you have to go through to save changes. The new version of TiddlyWiki includes support for running it as a real HTTP server, so you can use it just like an online wiki.
But it took me a couple of hours to figure out how to set that up. The TiddlyWiki documentation is not clear ("not clear" is a euphemistic way of saying "terrible"). So, I've written up these instructions in the hope it will spare somebody else all the frustration I had.
A gamers guide to using TiddlyWiki.
http://helugame.wordpress.com/2013/09/07/shining-ark-7-using-tiddlywiki/
I’ve been using TiddlyWiki for this game mainly to record the monsters’ locations and the items that they drop. This is so that when I need a certain item to upgrade/create weapons, I can quickly look it up; which monsters drop it and which quests have those monsters.
As I play the game, as I encounter new information, I just input them into my Shining Ark TiddlyWiki. It’s like I’m building a wiki from scratch. The reason why I don’t just use online wikis is that 1) it’s too easy to get spoiled and 2) sometimes online wikis provide too much information (who cares about the non-gameplay related descriptions that can be found in the game, etc).
A collection of plugins by Stephen Kimmel, including a number of additional editor toolbar buttons.
http://skplugins.tiddlyspot.com/
In keeping with the general spirit of the TiddlyWiki community, ie, you develop something useful and/or potentially interesting you share it with others, I'm sharing some of the plugins I've developed to go with the new Editor Toolbar. You'll find them and a more extensive discussion of what each does at http://skplugins.tiddlyspot.com/
Slides and Stories is a repository of the tools to optimize TW for scientific research and for presenting and publishing results.
http://slidesnstories.tiddlyspot.com
SlidesnStories
...is a tool to save and reload sets of Tiddlers. This is already working, The aim is to develop a mechanism to transform these into instant slideshows.
MetaTabs
is a tool which gives you the possibility to attach and show specific information in tabs at the bottom of each Tiddler: ideas, notes, tasks, stories and presentations, comments, annotations and footnotes.
It is inspired by MagicTabs and Tiddlyscholar by Alberto Molina Pérez, which are very elaborated tools that alas do not seem to be in active development any more. I wanted to change the behaviour in some ways. For example I wanted show tabs only if they have content....furthermore there is
- an export-plugin,
- a footnote-plugin,
- and a plugin to rearrange Tiddlers in the StoryRiver
A adaptation of TiddlyWiki perfect for using as a Notebook sysetem.
https://giffmex.org/stroll/stroll.html
Stroll is a TiddlyWiki adaptation imitating certain features of Roam to help users easily see connections between their notes and navigate between them. Features include:
- bi-directional links,
- autocompletion when linking,
- renaming of links upon changing tiddler titles,
- side-by-side editing of multiple notes.
An enormous collection of tips beautifully curated by Tobias Beer. It is actually a collection of sites, with sub-sites dedicated to topics such as filtering (http://tobibeer.github.io/tw/filters/).
http://tobibeer.github.io/tb5/
A collection of references and sandbox for testing concepts around TiddlyWiki 5...
A Kanban implementation for TiddlyWiki with a familiar look and feel (see the demo).
https://ibnishak.github.io/Tesseract/projects/tekan/Tekan.html
This is Tekan, a TW based kanban. The easiest way to know tekan is to use it. So let us begin, shall we?
A adaptation of TiddlyWiki perfect for using as a Notebook sysetem.
https://kebifurai.github.io/TiddlyResearch/
Tiddly Research is a free and local note-taking environment based on TiddlyWiki
Core Features:
- Bidirectional note linking on multiple levels
- Tags
- Linked references
- Unlinked references
- Transclusions
- Bullet point based hierarchical note taking structure
- Integration with the spaced repetition flashcards tool Anki
- TODOs
- and more
Note: This is an older version of TiddlyServer. A modern version can be referenced here.
TiddlyServer is a special purpose Desktop app, designed to facilitate managing multiple instances of TiddlyWiki running as a server. It does not require internet acess to access the wikis.
https://github.com/mklauber/TiddlyServer/releases/
TiddlyServer can import both TiddlyWiki files and TiddlyFolder wikis. For each wiki, you specify a prefix to serve it with and the source to import from. It will copy the wikis to its own internal store and begin serving them up at http://localhost:8080/{prefix}/. The export button for each wiki will convert it to a single file wiki.
Reaction to TiddlyWiki5 from the translator of the German edition of TiddlyWikiClassic.
http://blog.netplanet.org/2014/01/03/tiddlywiki-5-im-betatest/
There is little software that can still inspire me so even after years, as on the first day. This includes TiddlyWiki, the "pocket-wiki". The latter is because the Wiki completely fits into an HTML file, and this HTML file brings everything - JavaScript program logic, CSS appearance and the entire Wiki content as stored records. So a TiddlyWiki file is then sometimes happy times some megabytes in size, but just has the unbeatable advantage that it works just as fast file created locally in a variety of browsers.
(Translation from German by Google Translate)
An early release of an edition of TiddlyWiki customised for rigorous, academic notetaking.
http://tw5.scholars.tiddlyspot.com/
TiddlyWiki for Scholars is a personal customization of TiddlyWiki 5.0.13-beta I made for note-taking from readings, but it can be useful for other purposes. The idea behind this adaptation is to show and to allow creating relevant data related to the current tiddler without leaving the tiddler.
A collection of tips and guides in French, introduced by this blog post:
http://sylvain.naud.in/post/2014/10/29/Ressources-pour-TiddlyWiki-5-%28FR%29
Ce guide de prise en main de TiddlyWiki vous permettra de débuter sur ce logiciel : rédiger du texte avec la syntaxe wiki, insérer des images, créer des Tiddler, faire une recherche, ajouter des fonctionnalités, et bien d'autres choses.. Bonne lecture ! Sylvain
A Knowledge Network about TiddlyWiki.
http://confocal-manawatu.pbworks.com/w/page/113574373/TiddlyWiki
Interconnected with the visual taxonomy at every node: http://debategraph.org/Stream.aspx?nid=457381&vt=bubble&dc=focus
TWKN will be transferred into TWederation/TiddlyMap format as soon as I am convinced in reliable and secure versioning and multi-user operation in TW format. Your assistance and support would be highly appreciated.
Notes and tips by a developer working on writing TiddlyWiki plugins – including TWExe, a widget for running Windows scripts and executables.
A collection of articles covering integration with Fargo, Font Awesome and Google Calendar, and tips for managing task lists.
http://blog.jeffreykishner.com/tiddlywiki/
I have become a regular user of TiddlyWiki and have become so accustomed to using Font Awesome icons in Fargo that I wanted to incorporate the icons into my wikis as well.
A topical index of known plugins, tutorials, themes, and other helpful tools for TiddlyWiki.
https://dynalist.io/d/zUP-nIWu2FFoXH-oM7L7d9DM
Some of the topics indexed so far include:
Dutch blog post about TiddlyWiki
https://breinbout.wordpress.com/2014/11/26/tiddlywiki/
I'm allergic to websites that are highly dependent on JavaScript. I think that JavaScript has many useful applications to add functionality to a site, but content needs to be visible if JavaScript is switched off. I use the NoScript extension for Firefox and surf with pleasure over the Internet without spontaneous things happen that I do not give permission. I love JavaScript on a short leash. More crazier maybe I'm so excited about TiddlyWiki.
(Translation from Dutch by Google Translate)
An extensive collection of tips and resources for users of TiddlyWiki in Japanese.
http://bacchus.ivory.ne.jp/bourbon/
TiddlyWikiをHTML5にしたTiddlyWiki5が正式にリリースされました。このTiddlyWiki5の使い方について、自分で試した機能を中心に解説します。
TiddlyWiki5は、非常に多機能なローカルWikiです。このブログに書いてあることは、TiddlyWiki5で出来ることのごく一部です。
A TiddlyWiki5 forum on Reddit.
https://www.reddit.com/r/TiddlyWiki5/
A TiddlyWiki5 forum on Reddit. As of 2016, it claims to have the most up-to-date list of plugins available for TW5.
Huge collection of customisations and tweaks from Ton Gerner.
http://tongerner.tiddlyspot.com/
I am a longtime user of TiddlyWiki Classic and still use it daily since you can't do everything in TiddlyWiki 5 (yet) ;)
I started experimenting with TW5 at the end of September 2013 (alpha10). Since I missed a few things in the layout I got used to in TiddlyWiki Classic 1, I started with modifying the layout of TW5. To share my knowledge, I made a few guides about these 'modifications'. The guides started as a non-linear personal web notebook (yeah, the subtitle of TiddlyWiki!). I started experimenting with layout things and used TW5 to document my experiments.
A wealth of hints, tips and notes about using TiddlyWiki on Node.js:
TiddlyWiki is different from other wikis because of its principle of dynamically customizeable "storyline" based on tiddlers as basic units of information. That is, the user "composes" their own version of the webpage by clicking on tiddler links, which add tiddlers to the page in order to compose a storyline.
The Node.js implementation in TiddlyWiki5 adds all the advantages of flat-file markup language based type of site. This makes TiddlyWiki an excellent alternative to flat-file based CMS/webpage/blog authoring systems for the web.
Also very cool is the treatment of tags as menus everywhere.
http://larigot.avarts.ionio.gr/users/iani/wikis/tw5square.html
Also available on GitHub (download and save index.html and open it in your browser).
Stephan Hradek's growing catalogue of tips, tutorials, and other resources. Stephan has also developed several plugins and macros that you can find at http://tiddlystuff.tiddlyspot.com/.
http://tw5magick.tiddlyspot.com/
Some things in TiddlyWiki seem like Magic. As my preferred nick is Skeeve, I felt that TW5 Magick is a proper name for this collection of some of the "magic" tricks one can do with TiddlyWiki.
Tips and guides for using TiddlyWiki.
http://techlifeweb.com/tw5tribalknowledge.html
I never used Node.js until a couple weeks ago when I wanted to try a TW5 installation on Node and expand my knowledge a bit. I figured someone else may be in the same boat so I wrote it all down
An alternative LaTeX plugin for TiddlyWiki5. It supports a wider set of LaTeX commands than KaTeX, though not as extensive as MathJax
http://tw5-texzilla.tiddlyspot.com
This plugin provides LaTeX support in TiddlyWiki5, using the TeXZilla latex parser to generate MathML.
Only Firefox and Safari support MathML at the moment, so the plugin is only useful if you're using one of these browsers. It might be possible to combine this plugin with MathJax to convert MathML to something that other browsers can understand, e.g. HTML+CSS, but I haven't tried this.
A collection of TiddlyWiki resources from Mario Pietsch, with a focus on cloud deployments. Mario also maintains the German translation of TiddlyWiki.
My name is Mario Pietsch from Austria. I'm living near Salzburg.
This page, will be the portal to my TiddlyWiki, TiddlyWeb related content.
A guide (in French) to using TiddlyWiki on the BiblioBox, a variation of the PirateBox mobile communication and file sharing system.
http://bibliobox.net/blog/post/2014/07/16/un-wiki-sur-votre-bibliobox-avec-tiddlywiki
I've known TiddlyWiki since its beginning in 2004. For personal or professional needs, I used it regularly for notepad staff in 2007 and 2012. But I admit I ignored the tool during the past two years. And then I said yesterday: but why not put TiddlyWiki on a BiblioBox? Because it is a single HTML file with javascript. In addition I knew the existence of a server version for saving online amendments.
Hand optimised from a translation by Google Translate
A beautiful theme that leverages the white spaces between elements.
A collection of references for testing concepts around TiddlyWiki 5...
This is PMario's playground with ramblings about TiddlyWiki and related stuff.
It basically is a "jump off" page to various TiddlyWiki sites, that show editions, themes and plugins.
Matabele's stylish and clean system for personal task management.
This is my work in progress version of TW5, incorporating various features and ideas as and when they intrigue me. To grab any feature you may wish to try, drag the listed tiddlers across to the dropzone of an empty TiddlyWiki 5.0.10-beta
An experiment to embed interactive 3D graphics within TiddlyWiki by Jamal Wills. It is based X3DOM, an open source JavaScript library.
TiddlyWiki is an incredibly flexible and versatile tool that is conceived and constructed differently than most software. This can make it hard to understand until the moment when it clicks, and becomes a seamless extension of your brain.
Starting with the basics, TiddlyWiki is a note-taking web application you can download for free, store wherever you like and customise however you wish. Use it to capture, organise and share your notes in ways that word processors and other note-taking tools cannot.
TiddlyWiki is designed to be non-linear, structuring content with stories, tags, hyperlinks, and other features. You can organise and retrieve your notes in ways that conform to your personal thought patterns, rather than feel chained to one preset organisational structure.
You can use TiddlyWiki as a single file that you view and edit through any web browser, whether you are online or offline. Or you can use it as a powerful Node.js application that stores each of your notes as a separate file.
How can you make TiddlyWiki work for you? We recommend you start with our introductory documentation listed below, and then browse the TableOfContents, available in the Contents tab in the sidebar. Or just follow our simple instructions and try it out for yourself!
Also see:
purpose | calculate the absolute value of a list of numbers |
---|---|
input | a selection of titles |
output | the absolute value of the input numbers |
New in: 5.1.20 See Mathematics Operators for an overview.
A plugin to integrate the Ace editor into TiddlyWiki.
Being quite new to TW5 development I tried my best to draft a SyncAdaptor to store tiddlers in IndexedDb. This is quite useful if an application / plugin installation is not possible (we have quite some restrictions at work...).
TiddlyWiki wouldn't be possible without the ongoing support of the TiddlyWiki Community. Their attention and feedback has made it possible to gain an understanding of what is wanted from the product, and their passion for it has taught me that it is worth the investment.
TiddlyWiki incorporates code from these fine OpenSource projects:
And media from these projects:
purpose | calculate the arccosine value (in radians) of a list of numbers |
---|---|
input | a selection of titles |
output | the arccosine (in radians) of the input numbers |
New in: 5.1.21 See Mathematics Operators for an overview.
New in: 5.1.23The action-confirm widget is an action widget that prompts the user for confirmation and invokes other action widgets contained within it only if the user confirms. ActionWidgets are used within triggering widgets such as the ButtonWidget.
The action-confirm widget is invisible. Any content within it is only processed if the user confirms the action, or the confirmation has been disabled by the $prompt
attribute.
Attribute | Description |
---|---|
$message | Optional message displayed to the user when asking for confirmation. |
$prompt | Optional flag, set to "no" to disable the prompt for confirmation. Defaults to "yes" |
Here is an example of a button that asks the user for confirmation, before deleting the caption and tags fields of the current tiddler:
<$button>
<$action-confirm $message="Do you wish to delete the caption and tags?">
<$action-deletefield caption tags/>
Delete "caption" and "tags"
</$action-confirm>
</$button>
That renders as:
Here is an example of a button that uses the optional $prompt
attribute to control whether to prompt the user before deleting the text field of the tiddler HelloThere:
<$button>
<$action-confirm $message="Do you wish to delete the text field?" $prompt={{$:/state/promptUser}}>
<$action-deletefield $tiddler="HelloThere" $field="text"/>
</$action-confirm>
Delete text from ~HelloThere
</$button>
That renders as:
The action-createtiddler widget is an action widget that creates new tiddlers. ActionWidgets are used within triggering widgets such as the ButtonWidget.
There are several differences from the tm-new-tiddler message:
The action-createtiddler widget is invisible.
New in: 5.2.0 The action widgets contained within the action-createtiddler widget are executed after the new tiddler has been created with the title of the tiddler in the variable createTiddler-title
and createTiddler-draftTitle
.
Attribute | Description |
---|---|
$basetitle | The initial title that will be attempted. If a tiddler with that title already exists, then a numerical counter is added to the title and incremented until it is unique |
$savetitle | (deprecated – see below) A text reference identifying a field or index into which the title of the newly created tiddler will be stored after it is created |
$savedrafttitle | (deprecated – see below) New in: 5.1.20 A text reference identifying a field or index into which the draft title associated with the newly created tiddler will be stored after it is created. This is useful when using a sequence of action widgets to create a new tiddler, put it into edit mode, and position it within the list of its parent tag |
$timestamp | Specifies whether the timestamp(s) of the target tiddler will be updated (modified and modifier, plus created and creator for newly created tiddlers). Can be "yes" (the default) or "no" |
$template | New in: 5.1.22 The title of a template tiddler, that will be used to create a new tiddler |
$overwrite | New in: 5.1.22 If set to "yes", it will overwrite existing tiddlers. Be careful! |
{any attributes not starting with $} | Each attribute name specifies a field to be created in the new tiddler |
New in: 5.2.0 Note that the attributes $savetitle
and $savedrafttitle
are no longer needed. Instead, any action widgets that need to use the title of the newly created tiddler should be contained within the action-createtiddler widget, and reference the variables createTiddler-title
and createTiddler-draftTitle
to obtain the title.
Caption for new button: <$edit-text tiddler="$:/state/new-button-caption" tag="input" default=""/> <$button> <$action-createtiddler $basetitle="Homemade Button" tags="$:/tags/PageControls" text={{$:/state/new-button-caption}}> <$action-navigate $to=<<createTiddler-title>>/> </$action-createtiddler> Create a new non-functional page control button and open the tiddler </$button>
That renders as:
Caption for new button:
This example will create "New Tiddler", "New Tiddler 1", " New Tiddler 2" and so on
\define testCreate() <$action-createtiddler /> \end <$button actions=<<testCreate>> > Create Tiddler </$button>
- Clicking this button, will also open the Right sidebar: Recent tab
This example will use the base title defined in $:/language/DefaultNewTiddlerTitle.
It will overwrite the tiddler, if the button is clicked several times.
\define testCreate() <$action-createtiddler $basetitle={{$:/language/DefaultNewTiddlerTitle}} $overwrite="yes"/> \end <$button actions=<<testCreate>> > Create Tiddler </$button>
- Clicking this button, will also open the Right sidebar: Recent tab
This example will uses a base-title and a template: ActionCreateTiddlerWidget Template
It will create: "base", "base 1", "base 2" and so on
\define testCreate() <$action-createtiddler $basetitle="base" $template="ActionCreateTiddlerWidget Template"/> \end <$button actions=<<testCreate>> > Create Tiddler </$button>
- Clicking this button will also open the Right sidebar: Recent tab
This example uses a base-title "base" and a template: ActionCreateTiddlerWidget Template.
There will be new fields "aa" and "bb" which are added to the new tiddlers.
\define testCreate() <$action-createtiddler $basetitle="base" $template="ActionCreateTiddlerWidget Template" aa="new field aa" bb="new field bb" /> \end <$button actions=<<testCreate>> > Create Tiddler </$button>
- Clicking this button will also open the Right sidebar: Recent tab
This example will create "New Tiddler", "New Tiddler 1", " New Tiddler 2" and so on
\define testCreate()
<$action-createtiddler />
\end
<$button actions=<<testCreate>> >
Create Tiddler
</$button>
- Clicking this button, will also open the Right sidebar: Recent tab
This example will use the base title defined in $:/language/DefaultNewTiddlerTitle.
It will overwrite the tiddler, if the button is clicked several times.
\define testCreate()
<$action-createtiddler $basetitle={{$:/language/DefaultNewTiddlerTitle}} $overwrite="yes"/>
\end
<$button actions=<<testCreate>> >
Create Tiddler
</$button>
- Clicking this button, will also open the Right sidebar: Recent tab
This example will uses a base-title and a template: ActionCreateTiddlerWidget Template
It will create: "base", "base 1", "base 2" and so on
\define testCreate()
<$action-createtiddler $basetitle="base" $template="ActionCreateTiddlerWidget Template"/>
\end
<$button actions=<<testCreate>> >
Create Tiddler
</$button>
- Clicking this button will also open the Right sidebar: Recent tab
This example uses a base-title "base" and a template: ActionCreateTiddlerWidget Template.
There will be new fields "aa" and "bb" which are added to the new tiddlers.
\define testCreate()
<$action-createtiddler $basetitle="base" $template="ActionCreateTiddlerWidget Template" aa="new field aa" bb="new field bb" />
\end
<$button actions=<<testCreate>> >
Create Tiddler
</$button>
- Clicking this button will also open the Right sidebar: Recent tab
The action-deletefield widget is an action widget that deletes specified fields of a tiddler. ActionWidgets are used within triggering widgets such as the ButtonWidget.
The action-deletefield widget is invisible. Any content within it is ignored.
Attribute | Description |
---|---|
$tiddler | The title of the tiddler whose fields are to be modified (if not provided defaults to the current tiddler) |
$field | Optional name of a field to delete |
{any attributes not starting with $} | Each attribute name specifies a field to be deleted. The attribute value is ignored and need not be specified |
Here is an example of a button that deletes the caption and tags fields of the current tiddler:
<$button>
<$action-deletefield caption tags/>
Delete "caption" and "tags"
</$button>
That renders as:
Here is an example of a button that deletes the modified date and tags fields of the tiddler HelloThere:
<$button>
<$action-deletefield $tiddler="HelloThere" modified tags/>
Delete "modified" and "tags" from ~HelloThere
</$button>
That renders as:
Here is an example of a button that uses the optional $field attribute to delete the text field of the tiddler HelloThere:
<$button>
<$action-deletefield $tiddler="HelloThere" $field="text"/>
Delete text from ~HelloThere
</$button>
That renders as:
The action-deletetiddler widget is an action widget that deletes tiddlers. ActionWidgets are used within triggering widgets such as the ButtonWidget.
There are several differences compared to the WidgetMessage: tm-delete-tiddler:
The action-deletetiddler widget is invisible. Any content within it is ignored.
Attribute | Description |
---|---|
$tiddler | Optional title of the tiddler to be deleted |
$filter | Optional filter identifying tiddlers to be deleted |
Here is an example of a button that deletes the tiddler HelloThere:
<$button>
<$action-deletetiddler $tiddler="HelloThere"/>
Delete "~HelloThere"
</$button>
That renders as:
Here is an example of a button that deletes all tiddlers tagged TableOfContents:
<$button>
<$action-deletetiddler $filter="[tag[TableOfContents]]"/>
Delete tiddlers tagged "~TableOfContents"
</$button>
That renders as:
The action-listops widget is an action widget that manipulates user lists in any field or data index. ActionWidgets are used within triggering widgets such as the ButtonWidget.
The action-listops widget is invisible. Any content within it is ignored.
Attribute | Description |
---|---|
$tiddler | The title of the tiddler whose lists are to be modified (if not provided defaults to the current tiddler) |
$field | The name of a field to be manipulated as a list (defaults to 'list') |
$index | Optional index of a property in a data tiddler index to be manipulated as a list |
$filter | An optional filter expression, the output of which will be saved to the field/index being manipulated |
$subfilter | An optional subfilter expression, which takes the list being manipulated as input, and saves the modified list back to the field/index being manipulated |
$tags | An optional subfilter expression, which takes the 'tags' field of the target tiddler as input, and saves the modified list of tags back to the 'tags' field |
Standalone use of the $subfilter
attribute can be replaced by using a (more complicated) $filter
attribute value.
For example, the items "abc" and "123" can be appended to the field myfield
using the $subfilter
attribute:
<$action-listops $field="myfield" $subfilter="abc 123"/>
The same can be achieved using the $filter
attribute and prepending the Filter Run [all[current]get[myfield]enlist-input[]]
to the Filter Expression:
<$action-listops $field="myfield" $filter="[all[current]get[myfield]enlist-input[]] abc 123"/>
The short form is more convenient, but the long form is useful for live-debugging complicated $subfilter
values using the filter tab of $:/AdvancedSearch. By using $:/AdvancedSearch, the Filter Expression can be tested before using action-listops to modify actual tiddler fields. For this use case, the all[current]
portion of the expression needs to be changed to select the proper test tiddler.
Tagging is implemented using a tiddler's 'tags' field, so appending the tags "abc" and "123" using the $tags
attribute like this:
<$action-listops $tags="abc 123"/>
is mostly equivalent to using $subfilter
along with "tags" for the value of $field
:
<$action-listops $field="tags" $subfilter="abc 123"/>
The ActionSetFieldWidget replaces a field's value using $field
/$value
attributes. A single ActionSetFieldWidget can be used to set any number of fields by using attributes not starting with $.
The ActionListopsWidget replaces or modifies a single field's value. The new value is generated using filters.
The following two examples are functionally equivalent:
<$action-setfield $field="myfield" $value="abc 123"/>
<$action-listops $field="myfield" $filter="abc 123"/>
In general, ActionSetFieldWidget is better for setting multiple fields at once and for replacing a field's value. The ActionListopsWidget is better for modifying a field based on the field's existing value and for using a Filter Expression to derive the value.
A number of extended filter operators are necessary for the manipulation of lists. These operators have been designed primarily for use in subfilter expressions whereby the modified current list is returned in place of the current list.
Listops Operators | ||
---|---|---|
Operator | Purpose | |
allafter | discard all items except those after the marker | |
allbefore | discard all items except those before the marker | |
append | append a range of items from an array to the list | |
cycle | toggle in the input, the titles specified in the first operand in a cyclical manner | |
insertbefore | insert an item T into a list immediately before an item B |
|
move | move marker N places in the list | |
prepend | prepend a range of items from an array to the list | |
putafter | move N trailing items after the marker | |
putbefore | move N trailing items before the marker | |
putfirst | move N trailing items to the head of the list | |
putlast | move N leading items to the tail of the list | |
remove | remove a list of titles specified in the operand from the input | |
replace | replace marker with N trailing items | |
sortby | sort the current list in the order of the list referenced in the operand | |
toggle | toggle the title specified in the operand in the input | |
unique | remove all duplicate items from the current list |
In this example we shall populate and then clear a list in an ordinary field (myfield) of this tiddler (the default.)
<$button>
<$action-listops $field="myfield" $subfilter="efg hlm pqr"/>
Populate 'myfield'
</$button>
<$button>
<$action-listops $field="myfield" $subfilter="abc xyz"/>
Append More Items
</$button>
<$button>
<$action-listops $field="myfield" $subfilter="-abc -hlm"/>
Remove Items
</$button>
<$button>
<$action-listops $field="myfield" $filter="[[]]"/>
Clear 'myfield'
</$button>
<$list filter="[list[!!myfield]]">
</$list>
That renders as:
In this example we shall append and remove items from a list in an ordinary field (myfield) of this tiddler (the default) and sort the resultant list. We shall then remove some of the appended items and sort the resulting list in reverse order.
<$button>
<$action-listops $field="myfield" $subfilter="-efg ijk xyz [[this is a title]] +[sort[]]"/>
Mangle List
</$button>
<$button>
<$action-listops $field="myfield" $subfilter="-xyz -[[this is a title]] +[!sort[]]"/>
Unmangle List
</$button>
<$list filter="[list[!!myfield]]">
</$list>
That renders as:
In this example we shall append a few tags to the 'tags' field of this tiddler (the default.) We shall then remove some of the appended tags.
<$button>
<$action-listops $tags="+[append{Days of the Week!!short}] $:/tag1 $:/tag2 $:/tag3"/>
Populate 'tags'
</$button>
<$button>
<$action-listops $tags="+[!remove:2{!!tags}]"/>
Remove Last Two Tags
</$button>
<$button>
<$action-listops $tags="+[!prefix[$:/]]"/>
Remove System Tags
</$button>
<$button>
<$action-listops $tags="-Mon -Tue"/>
Remove Mon and Tue
</$button>
<$button>
<$action-listops $tags="+[prefix[$:/]] ActionWidgets Widgets"/>
Remove User Tags
</$button>
<$button>
<$action-listops $tags="+[[]] ActionWidgets Widgets"/>
Clear Tags
</$button>
<$list filter="[list[!!tags]]">
</$list>
That renders as:
New in: 5.1.23 The action-log widget is an action widget that can be used to output debugging information to the JavaScript console supported by most browsers. This can be useful because otherwise it is difficult to observe what is going on within a sequence of actions.
ActionWidgets are used within triggering widgets such as the ButtonWidget.
The action-log widget is invisible. Any content within it is ignored.
When the actions are invoked, the names and values of all attributes are logged to the JavaScript console. In addition there are optional attributes that can be used:
Optional Attribute | Description |
---|---|
$$filter | All variables matching this filter will also be logged. |
$$message | A message to display as the title of the information logged. Useful when several action-log widgets are used in sequence. |
$$all | Set to "yes" to log all variables in a collapsed table. Note that if there is nothing specified to log, all variables are always logged instead. |
Here is an example of logging two variables:
<$action-log myVar=<<myVar>> otherVar=<<otherVar>>/>
To log all variables:
<$action-log />
To log two variables as well as all core variables (which start with tv-
):
<$action-log myVar=<<myVar>> other={{!!status}} $$filter="[prefix[tv-]]"/>
The action-navigate widget is an action widget that sends a tm-navigate message back up the widget tree. ActionWidgets are used within triggering widgets such as the ButtonWidget.
The action-navigate widget is invisible. Any content within it is ignored.
Attribute | Description |
---|---|
$to | The title of the target tiddler for the navigation (if not provided defaults to the current tiddler |
$scroll | Optional parameter determining whether the navigation will also cause a scroll to the target tiddler (see below) |
The optional $scroll
attribute can be set to "yes" to force scrolling to occur to bring the target tiddler into view. If set to "no" then scrolling does not occur. If the $scroll
attribute is omitted then scrolling occurs unless either:
Note that if navigating to multiple tiddlers at once you should use the same $scroll
setting for all of them.
Here is an example of button that navigates to two different tiddlers at once:
<$button>
<$action-navigate $to="ButtonWidget"/>
<$action-navigate $to="ActionWidgets"/>
Click me!
</$button>
That renders as:
The action-popup widget is an action widget that triggers the display of a popup defined via a state tiddler, or clears all displayed popups. ActionWidgets are used within triggering widgets such as the ButtonWidget.
The action-popup widget is invisible. Any content within it is ignored.
Attribute | Description |
---|---|
$state | The title of the state tiddler for the popup |
$coords | Optional coordinates for the handle to which popup is positioned (in the format (x,y,w,h) ) |
$floating | New in: 5.2.0 Optional. Defaults to no . Set to yes to create a popup that must be closed explicitly. |
New in: 5.1.23 If the $coords attribute is missing or empty then all popups are cancelled.
Here is an example of button that triggers the "more" button in the sidebar "Tools" tab. You may need to scroll to see the popup
<$button>
<$action-setfield $tiddler="$:/state/tab/sidebar--595412856" $value="$:/core/ui/SideBar/Tools"/>
<$action-popup $state="$:/state/popup/more-2053862905" $coords="(0,20,0,0)"/>
Click me!
</$button>
That renders as:
The action-sendmessage widget is an action widget that sends a message back up the widget tree. ActionWidgets are used within triggering widgets such as the ButtonWidget.
The action-sendmessage widget is invisible. Any content within it is ignored.
Attribute | Description |
---|---|
$message | The message to send (eg, WidgetMessage: tm-new-tiddler) |
$param | Optional parameter string whose meaning is dependent on the message being sent |
$name | Optional name of additional parameter |
$value | Value for optional parameter whose name is specified in $name |
$names | New in: 5.2.1 Optional filter evaluating to a list of additional parameter names |
$values | New in: 5.2.1 Optional filter evaluating to a list of parameter values corresponding to the parameters names specified in $names |
{any attributes not starting with $} | Multiple additional, optional named parameters that are attached to the message |
Here is an example of button that displays both a notification and a wizard, and creates a new tiddler with tags and text:
<$button>
<$action-sendmessage $message="tm-modal" $param="SampleWizard"/>
<$action-sendmessage $message="tm-notify" $param="SampleNotification"/>
<$action-sendmessage $message="tm-new-tiddler" title="This is newly created tiddler" tags="OneTag [[Another Tag]]" text=<<now "Today is DDth, MMM YYYY">>/>
Click me!
</$button>
That renders as:
The action-setfield widget is an action widget that assigns values to the fields of a tiddler. ActionWidgets are used within triggering widgets such as the ButtonWidget.
The action-setfield widget is invisible. Any content within it is ignored.
Attribute | Description |
---|---|
$tiddler | The title of the tiddler whose fields are to be modified (if not provided defaults to the current tiddler) |
$field | Optional name of a field to be assigned the $value attribute |
$index | Optional index of a property in a data tiddler to be assigned the $value attribute |
$value | The value to be assigned to the field or index identified by the $field or $index attribute. If neither is specified then the value is assigned to the text field. If no value is specified, $field or $index will be deleted. |
$timestamp | Specifies whether the timestamp(s) of the target tiddler will be updated (modified and modifier, plus created and creator for newly created tiddlers). Can be "yes" (the default) or "no" |
{any attributes not starting with $} | Each attribute name specifies a field to be modified with the attribute value providing the value to assign to the field |
Here is an example of a pair of buttons that open the control panel directly to specified tabs. They work by using action-setfield to set the state tiddler for the control panel tabs.
<$button>
<$action-setfield $tiddler="$:/state/tab-1749438307" text="$:/core/ui/ControlPanel/Appearance"/>
<$action-navigate $to="$:/ControlPanel"/>
Go to Control Panel "Appearance" tab
</$button>
<$button>
<$action-setfield $tiddler="$:/state/tab-1749438307" text="$:/core/ui/ControlPanel/Settings"/>
<$action-navigate $to="$:/ControlPanel"/>
Go to Control Panel "Settings" tab
</$button>
That renders as:
Here is an example of a button that assigns tags and fields to the tiddler HelloThere, and then navigates to it and opens the tiddler info panel on the "Fields" tab:
<$button>
<$action-setfield $tiddler="HelloThere" tags="NewTag [[Another New Tag]]" color="red"/>
<$action-setfield $tiddler="$:/state/popup/tiddler-info--1779055697" text="(568,1443,33,39)"/>
<$action-setfield $tiddler="$:/state/tab--1890574033" text="$:/core/ui/TiddlerInfo/Fields"/>
<$action-navigate $to="HelloThere"/>
Modify ~HelloThere
</$button>
That renders as:
Here is an example of a button that assigns tags and fields to the tiddler HelloThere, and then initiates editing it:
<$button>
<$action-setfield $tiddler="HelloThere" tags="MoreTag [[Further More Tags]]" color="green"/>
<$action-sendmessage $message="tm-edit-tiddler" $param="HelloThere"/>
Edit ~HelloThere
</$button>
That renders as:
Here is an example of a button that opens the control panel directly to the "Appearance" tabs:
<$button>
<$action-setfield $tiddler="$:/state/tab-1749438307" $field="text" $value="$:/core/ui/ControlPanel/Appearance"/>
<$action-navigate $to="$:/ControlPanel"/>
Go to Control Panel "Appearance" tab
</$button>
That renders as:
The action-setmultiplefields widget is an action widget that assigns multiple fields to a tiddler where the names and values of the fields are specified as separate filters. ActionWidgets are used within triggering widgets such as the ButtonWidget.
The action-setmultiplefields widget is invisible. Any content within it is ignored.
Attribute | Description |
---|---|
$tiddler | Optional title of the tiddler to modify (defaults to the current tiddler) |
$fields | Optional filter evaluating to the names of a list of fields to assign. Either $fields or $indexes must be specified |
$indexes | Optional filter evaluating to the names of a list of indexes to assign. Either $fields or $indexes must be specified |
$values | Filter evaluating to the values to be assigned to the fields or indexes |
$timestamp | Specifies whether the timestamp(s) of the target tiddler will be updated (modified and modifier, plus created and creator for newly created tiddlers). Can be "yes" (the default) or "no" |
Here is an example of button that uses the data in Days of the Week to assign fields day-Monday
, day-Tuesday
etc. to the tiddler "HelloThere":
<$button>
<$action-setmultiplefields $tiddler="HelloThere" $fields="[list[Days of the Week]addprefix[day-]]" $values="[list[Days of the Week]]"/>
Click me!
</$button>
That renders as:
The variable actionTiddler
is used in subtly different ways by different widgets:
New in: 5.2.0 The default behaviour of action widgets has some peculiarities that often cause confusion. There is now an improved mode that simplifies how things work, but due to BackwardsCompatibility constraints, it must be explicitly engaged in order to take advantage of it.
The peculiarities relate to the way that the results of previous action widgets are available to subsequent action widgets. By default, action widgets are refreshed before each execution which ensure that they reflect the results of previous actions. However, ordinary widgets are not updated in the same way.
In the following contrived example, a button triggers a series of actions that should result in the string foo
being assigned to the text field of the tiddler ActionTestTiddler. However, it fails to produce the expected result because the <$set>
widget is not refreshed with the new value of ActionTestTiddler after the execution of the first <$action-setfield>
widget.
\define actions()
<$action-setfield $tiddler="ActionTestTiddler" $field="text" $value="FOO"/>
<$set name="newvalue" value={{{ [{ActionTestTiddler}lowercase[]] }}}>
<$action-setfield $tiddler="ActionTestTiddler" $field="text" $value=<<newvalue>>/>
</$set>
\end
Current value of ActionTestTiddler: {{ActionTestTiddler}}
<$button actions=<<actions>>>
Click me
</$button>
That renders as:
Current value of ActionTestTiddler:
The new behaviour avoids these problems by refreshing all widgets before execution, not just action widgets. It is engaged by running the actions in a scope that includes the variable tv-action-refresh-policy
set to the value always
. (The default value for tv-action-refresh-policy
is once
).
The assignment can be done within an action string, or via a local variable declaration containing the widget triggering the action.
The example above works as expected with the addition of tv-action-refresh-policy
:
\define tv-action-refresh-policy() always
\define actions()
<$action-setfield $tiddler="ActionTestTiddler" $field="text" $value="FOO"/>
<$set name="newvalue" value={{{ [{ActionTestTiddler}lowercase[]] }}}>
<$action-setfield $tiddler="ActionTestTiddler" $field="text" $value=<<newvalue>>/>
</$set>
\end
Current value of ActionTestTiddler: {{ActionTestTiddler}}
<$button actions=<<actions>>>
Click me
</$button>
That renders as:
Current value of ActionTestTiddler:
Action widgets are a special type of widget that have no visual appearance but perform an action when triggered (such as sending a message, navigating to a tiddler, or changing the value of a tiddler). Action widgets are used in association with other widgets that trigger those actions (for example, the ButtonWidget).
The following action widgets are provided:
There are two ways to use action widgets:
actions
) on the triggering widget (this is the preferred way)The action widgets are passed as a string to the actions
attribute of the triggering widget. Usually, it is more convenient to use a macro to assign the action widgets to a variable. For example, here is a button that triggers two actions of sending different messages:
\define my-actions()
<$action-sendmessage $message="tm-home"/>
<$action-sendmessage $message="tm-full-screen"/>
\end
<$button actions=<<my-actions>>>
Click me!
</$button>
The action widgets need not be immediate children of their triggering widget, but they must be descendents of it. The actions are performed in sequence. Here is the above example rewritten to use embedding:
<$button>
<$action-sendmessage $message="tm-home"/>
<$action-sendmessage $message="tm-full-screen"/>
Click me!
</$button>
New in: 5.2.0 The default behaviour of action widgets has some peculiarities that often cause confusion. There is now an improved mode that simplifies how things work, but due to BackwardsCompatibility constraints, it must be explicitly engaged in order to take advantage of it.
The peculiarities relate to the way that the results of previous action widgets are available to subsequent action widgets. By default, action widgets are refreshed before each execution which ensure that they reflect the results of previous actions. However, ordinary widgets are not updated in the same way.
In the following contrived example, a button triggers a series of actions that should result in the string foo
being assigned to the text field of the tiddler ActionTestTiddler. However, it fails to produce the expected result because the <$set>
widget is not refreshed with the new value of ActionTestTiddler after the execution of the first <$action-setfield>
widget.
\define actions()
<$action-setfield $tiddler="ActionTestTiddler" $field="text" $value="FOO"/>
<$set name="newvalue" value={{{ [{ActionTestTiddler}lowercase[]] }}}>
<$action-setfield $tiddler="ActionTestTiddler" $field="text" $value=<<newvalue>>/>
</$set>
\end
Current value of ActionTestTiddler: {{ActionTestTiddler}}
<$button actions=<<actions>>>
Click me
</$button>
That renders as:
Current value of ActionTestTiddler:
The new behaviour avoids these problems by refreshing all widgets before execution, not just action widgets. It is engaged by running the actions in a scope that includes the variable tv-action-refresh-policy
set to the value always
. (The default value for tv-action-refresh-policy
is once
).
The assignment can be done within an action string, or via a local variable declaration containing the widget triggering the action.
The example above works as expected with the addition of tv-action-refresh-policy
:
\define tv-action-refresh-policy() always
\define actions()
<$action-setfield $tiddler="ActionTestTiddler" $field="text" $value="FOO"/>
<$set name="newvalue" value={{{ [{ActionTestTiddler}lowercase[]] }}}>
<$action-setfield $tiddler="ActionTestTiddler" $field="text" $value=<<newvalue>>/>
</$set>
\end
Current value of ActionTestTiddler: {{ActionTestTiddler}}
<$button actions=<<actions>>>
Click me
</$button>
That renders as:
Current value of ActionTestTiddler:
purpose | treating each input title as a number, add to each the numeric value of the operand |
---|---|
input | a selection of titles |
parameter | N = a number |
output | the input as numbers, but with N added to each one |
New in: 5.1.20 See Mathematics Operators for an overview.
The standard mechanisms in TiddlyWiki for creating Table-of-Contents are macros known collectively as "toc" macros (click on link to learn more about macros). They use Tagging
as their means of creating relationships, so be sure to review the Tagging topic tiddler if tagging is a new concept for you.
A customisable table of contents can be added to the sidebar with the following steps:
<div class="tc-table-of-contents">
<<toc-selective-expandable 'TableOfContents'>>
</div>
Add entries to the table of contents by creating tiddlers tagged TableOfContents. An easy way is to choose new here from the tiddler toolbar of the TableOfContents tiddler. (if you don't see the "new here" button, click on the down arrow to see more menu options.)
To create child tiddlers (tiddlers that come below other tiddlers), tag them with the name of the parent tiddler.
Here's a macro that provides a Twitter Follow button for a particular username:
\define twitterFollowButton(username)
<iframe allowtransparency="true" frameborder="0" scrolling="no" src="//platform.twitter.com/widgets/follow_button.html?screen_name=$username$" style="width:300px; height:20px;"></iframe>
\end
The only change from the version published at https://dev.twitter.com/docs/follow-button is that new lines have been removed.
Note that the src URL is given without a protocol (ie "http" or "https"). It's done this way so that it works on sites whether they are hosted on a HTTP or HTTPS domain. If you want the Twitter button to work while using a TiddlyWiki offline on a "file://" URL, then you'll need to manually add the protocol. For example:
<iframe allowtransparency="true" frameborder="0" scrolling="no" src="https://platform.twitter.com/widgets/follow_button.html?screen_name=jermolene" style="width:300px; height:20px;"></iframe>
purpose | extend each input title with a prefix |
---|---|
input | a selection of titles |
parameter | S = a string of characters |
output | the input, but with S added to the start of each title |
purpose | extend each input title with a suffix |
---|---|
input | a selection of titles |
parameter | S = a string of characters |
output | the input, but with S added to the end of each title |
As the structures within your TiddlyWiki documents get more complex it can be hard to keep the titles of tiddlers consistent. For example, should terms be defined in the plural or the singular? Camel case or separate words?
Recording a formal titling policy can help to reduce confusion. For example, the titling policies for this wiki are recorded in the Documentation Style Guide.
A useful convention is to use the prefix $:/_
for any system tiddlers that you create to ensure that they are near the top of the system tiddler listing in the sidebar
purpose | find which input title follows a specified one |
---|---|
input | a selection of titles |
parameter | T = one of those titles |
output | the title that immediately follows T in the input |
If T
is not present in the input, or is the last title there, then the output is empty.
These examples make use of the Days of the Week tiddler. The Thursday tiddler shows a further example.
[list[Days of the Week]after[Monday]]
[list[Days of the Week]after[Sunday]]
Alerts are displayed as yellow boxes overlaying the main TiddlyWiki window. Each one corresponds to a tiddler with the tag $:/tags/Alert. Clicking the delete icon on an alert deletes the corresponding tiddler.
Here's a demo .
Alert tiddlers should have the following fields:
Field | Description |
---|---|
title | By default, alert titles have the prefix $:/temp/alerts/ |
text | The text of the alert message |
modified | Date of the alert (used for ordering the alerts on screen) |
component | Component name associated with the alert |
tags | Must include $:/tags/Alert |
purpose | find all titles of a fundamental category |
---|---|
input | ignored, unless the parameter is empty |
parameter | zero or more categories |
output | the titles that belong to all the specified categories |
The parameter specifies zero or more fundamental categories using the following syntax:
Category | Members | Sorted |
---|---|---|
current | just the current tiddler | – |
missing | all non-existent tiddlers to which there is at least one hard link | no |
orphans | all tiddlers to which there are no hard links | by title |
shadows | all the shadow tiddlers that exist, including any that have been overridden with non-shadow tiddlers | no |
tags | all the tags in use on non-shadow tiddlers | no |
tiddlers | all the non-shadow tiddlers that exist | no |
If the parameter specifies more than one category, they are processed from left to right. The overall output is initially empty, and each category's output is dominantly appended to it in turn. Unrecognised categories contribute nothing to the output.
As a special case, if the parameter is empty, the output is simply a copy of the input. This can be useful when the parameter is soft.
The is
operator is similar, but its scope is restricted to its input.
[all[shadows]]
[all[shadows+tiddlers]]
[all[tiddlers+shadows]]
[all[orphans+missing+current]]
[all[current]]
[all[current]tag[Operator Examples]]
[all[current]tag[Recipes]]
Monday Thursday +[all[]]
purpose | discard all items except those after the marker |
---|---|
input | a list of items |
suffix | specifying a suffix ('include') will include the marker in the output |
parameter | marker = the list item to be used as a marker |
output | all items after the marker |
These examples make use of the Days of the Week tiddler.
[list[Days of the Week]] +[allafter[Wednesday]]
[list[Days of the Week]] +[allafter:include[Wednesday]]
purpose | discard all items except those before the marker |
---|---|
input | a list of items |
suffix | specifying a suffix ('include') will include the marker in the output |
parameter | marker = the list item to be used as a marker |
output | all items before the marker |
These examples make use of the Days of the Week tiddler.
[list[Days of the Week]allbefore[Wednesday]]
[list[Days of the Week]allbefore:include[Wednesday]]
A B C D E +[allbefore:include[C]count[]]
Current tiddlers:
Here are the details of the alpha releases of TiddlyWiki5. See TiddlyWiki5 Versioning for details of how releases are named.
Released 6th December 2013 at 17:53
See GitHub for detailed change history of this release
$:/theme
isn't defined or refers to a missing tiddler, then fallback through Snow White to Vanilla. This means that empty.html
now defaults to Snow White$:/tags/PageControls
tiddlers from being reordered5.0.x-beta
and the final release will be 5.1.x
New in: 5.1.23 You can have multiple alternative page layouts and switch between them. To see a list of available layouts and switch between them, use the keyboard shortcut ctrl-shift-L.
Creating an alternative layout goes beyond adding or removing features from the default interface and allows you to create an entirely new layout from scratch.
To create an alternative page layout and have the ability to switch to it, you need to create an alternative page template tiddler with the SystemTag: $:/tags/Layout.
This alternative page template can either be a tweaked and modified version of the default page template, or something entirely different. The layout switching mechanism requires that your page template tiddler has the fields name
and description
, which are used in the listing in the switching user interface.
The Amazon Web Services Plugin provides several tools for working with Amazon Web Services:
In TiddlyWiki anchor links can help us link to target points and distinct sections within rendered tiddlers. They can help the reader navigate longer tiddler content.
For example this link, Bottom, should take you to the bottom of this tiddler. The "Back to the top" link below should return you back to the top of this tiddler.
There are only 2 steps to making anchor links.
That's it.
Step 1: Create an 'anchor' (link target)
<a id="#Bottom_of_tiddler"></a>
id
attribute to any HTML5 tag and place a single #
before the 'address' value. Here are some suggestions of tags you can use.Step 2: Create a link to the target anchor
<a href="##Bottom_of_tiddler">Bottom</a>
<a href>
link using exactly the same 'address' value as the target but with double ##
characters preceding it.The above example can be adapted to work for many situations in TiddlyWiki, such as the table of contents at the top of this tiddler.
Is it really that simple?
Yes, it's that simple. BUT... in TiddlyWiki there are some small differences from standard HTML5 anchor links and some specific TiddlyWiki limitations.
Step 1: Creating the target anchor
#
character in front of the target address value that follows the id
attribute. (Notice the single #
character used in the #Bottom_of_tiddler in Example 1.)id
attribute, navigation will take place to the first instance found that satisfies the above criteria. To avoid this, you can use the qualify macro in both the id
and the href
attributes in a similar style to the example given below: Avoiding duplicate IDs when transcluding.Step 2: Creating the link to the target
href
value should start with two #
characters, one more than the id
value of the target anchor.Step 3: Navigating to the target
Normally you can click on the link and TiddlyWiki will scroll the window so the target anchor is at the top of the window, but there are several limitations:
id
attribute says that its value should not contain any whitespace. Currently (Dec 2020) an id
value with whitespace can sometimes work. However, it may not work in all browsers and is not guaranteed to work in the future.<h2 id="#heading-01"> My Target Heading</h2>
<a href="##heading-01">Link to My Target Heading</a>
This looks like:
<section id="#unique001">
!! My Target section
A `<section>` HTML tag is generally used to define sections in an HTML document, such as chapters, headers, footers, or any other sections of the document.
</section>
Clicking this anchor link goes to: <a href="##unique001">Link to My Target Section</a>
This looks like:
A <section>
HTML tag is generally used to define sections in an HTML document, such as chapters, headers, footers, or any other sections of the document.
Clicking this anchor link goes to: Link to My Target Section
Some suggestions for the HTML element you choose for marking a position using the id
attribute:
Element | Sample code | Observations |
---|---|---|
anchor | <a id="#part001-of-TiddlerName"></a> | Should work perfectly everywhere |
heading | <h2 id="#a-new-heading">A New Heading</h2> | Headings can have id attributes as well |
section | <section id="#sect001-of-TiddlerName">This is a new section</section> | If you use the section element it should probably have an id of its own |
span | <span id="#007">Marker 007 is here!</span> | span elements can be used to insert an id mid-paragraph |
Sample code | Observations | |
---|---|---|
Recommended | <a id="#part001-of-TiddlerName"></a> | Include the tiddler name for easy unique id s |
Avoid: whitespace | <h2 id="#0 0 1">A New Heading</h2> | Whitespace is not guaranteed to work in all browsers |
Avoid: % | <section id="#sect001%20of%20TiddlerName">This is a new section</section> | URI encoding (turning space into %20 and so on) may not work in some browsers |
Avoid: duplicate IDs | <span id="#007">Marker 007 is here!</span> | id values should be unique within entire wiki |
Avoid: duplicate IDs | <a id="#007"></a>A different marker 007 | If id values are duplicated, one will be ignored |
id
and anchor link to this header has been made as follows:<a href=<<qualify "##qualify-example">>>Avoiding duplicate IDs when transcluding</a>
<h2 id=<<qualify "#qualify-example">>>Avoiding duplicate IDs when transcluding</h2>
href
and id
values use the macro invocation syntax for attributes, using the qualify Macro to create a unique id
value.id
and the anchor link must be in the same tiddler.=
and the <<
.>
characters after the target name, two >>
to close the <<qualify
macro, and one >
to close the <a
tag.If you don't want the link to look like an external link, give the <a>
element's class
attribute the value tc-tiddlylink and if you want the link to also be italic & bold, give the additional classes tc-tiddlylink-missing tc-tiddlylink-shadow like below:
<a class="tc-tiddlylink" href="##Introduction:Anchor-Links-using-HTML">Back to the top</a> or just back to <a class="tc-tiddlylink tc-tiddlylink-missing tc-tiddlylink-shadow" href=<<qualify ##Hints>>>Hints</a>.
Back to the top or just back to Style Hints.
If you want to include an id
attribute to a link in your sidebar Table of Contents, you can include it in your listed tiddler's caption
field similar to the way shown below:
<span id=#some-value>Your caption</span>
purpose | append a range of items from an array to the list |
---|---|
input | a list of items |
suffix | an integer N, defaulting to all |
parameter | list = the array of items to be appended to the tail of the list |
output | a list with items appended from the head of the operand array |
! output | a list with items appended from the tail of the operand array |
These examples make use of the Days of the Week tiddler.
[list[Days of the Week]append[Tomorrow]]
[list[Days of the Week]append[Yesterday Today Tomorrow]]
[list[Days of the Week]append:4{Days of the Week!!short}]
Here are some recent articles written about TiddlyWiki. Submit new articles via GitHub, Twitter or by posting in the TiddlyWiki Groups.
A collection of articles covering integration with Fargo, Font Awesome and Google Calendar, and tips for managing task lists.
http://blog.jeffreykishner.com/tiddlywiki/
I have become a regular user of TiddlyWiki and have become so accustomed to using Font Awesome icons in Fargo that I wanted to incorporate the icons into my wikis as well.
Interesting article giving the perspective of someone who has been away from TiddlyWiki for a few years:
Way back in the mists of time (actually, January 2009) I wrote about a really cool tool called TiddlyWiki, a “non-linear personal web notebook”. Fast forward to today and I just had an out of body experience: Completely by accident I found a TiddlyWiki that I started when I wrote that piece and it still works!
Finding code that works flawlessly after just two or three years is magical enough but after seven years?! And given that TiddlyWiki is written as a single page Web application and considering how different browsers are now than they were in 2009, the fact that the old version of TiddlyWiki still works is not short of miraculous.
Detailed description of setting up TiddlyWiki on Node.js on OS X.
http://undefinedvalue.com/2015/04/02/setting-personal-tiddlywiki-server-os-x
For a new job, I decided to set up a personal wiki to keep notes. I wanted to keep it simple, meeting these requirements:
- All the data is in a Dropbox folder (so it can be automatically synced between machines)
- It must support Markdown syntax
After looking at the options, I settled on TiddlyWiki. I've used "classic TiddlyWiki" before, and liked its simplicity, but I was always a little annoyed with the weird steps you have to go through to save changes. The new version of TiddlyWiki includes support for running it as a real HTTP server, so you can use it just like an online wiki.
But it took me a couple of hours to figure out how to set that up. The TiddlyWiki documentation is not clear ("not clear" is a euphemistic way of saying "terrible"). So, I've written up these instructions in the hope it will spare somebody else all the frustration I had.
Dutch blog post about TiddlyWiki
https://breinbout.wordpress.com/2014/11/26/tiddlywiki/
I'm allergic to websites that are highly dependent on JavaScript. I think that JavaScript has many useful applications to add functionality to a site, but content needs to be visible if JavaScript is switched off. I use the NoScript extension for Firefox and surf with pleasure over the Internet without spontaneous things happen that I do not give permission. I love JavaScript on a short leash. More crazier maybe I'm so excited about TiddlyWiki.
(Translation from Dutch by Google Translate)
A quick guide to using TiddlyWiki (written in German)
http://michaelsonntag.net/notizen-mit-tiddlywiki-systemuebergreifend-nutzen
Those using multiple different computer platforms (if only PC and Android) knows for certain: You would like to sync notes across computers and thereby be independent of any apps or services. I am concerned at any rate so and so I am constantly looking for the perfect solution.
With TiddlyWiki I found it mostly. As the name suggests, it TiddlyWiki is a Wikisystem. In contrast to all other wikis, TiddlyWiki is a single HTML file that runs in the browser and thus can be used on all modern operating systems. And because there is only one file, it can be very easily via the well-known cloud services (Dropbox, Google Drive, ownCloud) or synchronized with FTP or used on a USB stick.
(Translation from German by Google Translate)
Reaction to TiddlyWiki5 from the translator of the German edition of TiddlyWikiClassic.
http://blog.netplanet.org/2014/01/03/tiddlywiki-5-im-betatest/
There is little software that can still inspire me so even after years, as on the first day. This includes TiddlyWiki, the "pocket-wiki". The latter is because the Wiki completely fits into an HTML file, and this HTML file brings everything - JavaScript program logic, CSS appearance and the entire Wiki content as stored records. So a TiddlyWiki file is then sometimes happy times some megabytes in size, but just has the unbeatable advantage that it works just as fast file created locally in a variety of browsers.
(Translation from German by Google Translate)
purpose | calculate the arcsine value (in radians) of a list of numbers |
---|---|
input | a selection of titles |
output | the arcsine (in radians) of the input numbers |
New in: 5.1.21 See Mathematics Operators for an overview.
purpose | calculate the arctangent value (in radians) of a list of numbers |
---|---|
input | a selection of titles |
output | the arctangent (in radians) of the input numbers |
New in: 5.1.21 See Mathematics Operators for an overview.
purpose | returns the angle in the plane (in radians) between the positive x-axis and the ray from (0,0) to the point (x,y), for [Y ]atan2[X ] |
---|---|
input | a selection of titles = coordinate Y (Y ) |
parameter | X = coordinate X |
output | the angle in radians (in [ - π , π ] ) between the positive x-axis and the ray from (0,0) to the point (x,y) |
New in: 5.1.21 See Mathematics Operators for an overview.
Learn more at: Attribute selectors - CSS or CSS-Specification
Audio files can be incorporated into TiddlyWiki in a very similar way to images.
Small audio files can be embedded directly within TiddlyWiki. Embedding isn't suitable for large files (over a few hundred kilobytes) because it increases the size of the TiddlyWiki file.
For example, the tiddler TiddlyWiki.mp3 contains an MP3 recording of the word "TiddlyWiki". If you visit that tiddler, you should see an audio player that will play back the recording.
You can also transclude audio files. For example:
{{TiddlyWiki.mp3}}
That renders as:
External audio tiddlers use the _canonical_uri field to point to an external audio file/stream, and have their text field blocked. This reduces their size considerably, but still allows for playback.
For example, the tiddler Caruso - Ave Maria points to an online audio recording hosted on http://archive.org:
{{Caruso - Ave Maria}}
That renders as:
If there is a SaverModule available that supports it, TiddlyWiki will automatically trigger a save of the current document on clicking ok or delete when editing a tiddler.
You should see a yellow notification at the top right of the window to confirm that an automatic save has taken place.
Automatic saving can be enabled or disabled through the Settings tab of the control panel . Behind the scenes, it is controlled through the configuration tiddler $:/config/AutoSave, which must have the value yes to enable automatic saving.
purpose | treating each input title as a number, compute their arithmetic mean |
---|---|
input | a selection of titles |
output | the arithmetic mean of the input as numbers |
New in: 5.2.0 See Mathematics Operators for an overview.
=1 =3 =4 =5 +[average[]]
Note that if there is no input the operator returns NaN
[tag[NotATiddler]get[price]] +[average[]]
purpose | find the titles that link to each input title |
---|---|
input | a selection of titles |
parameter | none |
output | any non-system titles that contain hard links to the input titles |
Each input title is processed in turn. The corresponding tiddler's list of backlinks is generated, sorted alphabetically by title, and then dominantly appended to the operator's overall output.
[[HelloThere]backlinks[]]
[tag[TableOfContents]backlinks[]]
[all[current]backlinks[]]
From Beaker Browser website:
Beaker is a Peer-to-Peer Web Browser, made for users to run applications independently of hosts. Using P2P Hypermedia, Beaker separates frontend apps from backend services, so that users are completely in control of their software and data. Read more.
Beaker is a fork of the open source Chromium browser (which is the core engine powering Google's Chrome browser).
Beaker adds the ability to host sites within the browser, and browse to those sites via the dat://
protocol. The extraordinary thing is that if you are running Beaker then you can also browse to sites hosted by other users, without needing any server in between.
Further, you can opt to host a site belonging to somebody else, forming part of a Bittorrent-like swarm of peers serving the content to other browsers. You can also fork a site, making your own copy that you can change as you need.
The main disadvantage is that mainstream browsers cannot use dat://
sites.
Most of the magic is accomplished by the underlying Dat protocol.
New in: 5.1.14 TiddlyWiki incorporates a special saver module permitting changes to be saved directly from Beaker browser. See Saving on Beaker Browser for instructions.
purpose | find which input title precedes a specified one |
---|---|
input | a selection of titles |
parameter | T = one of those titles |
output | the title that immediately precedes T in the input |
If T
is not present in the input, or is the first title there, then the output is empty.
These examples make use of the Days of the Week tiddler. The Thursday tiddler shows a further example.
[list[Days of the Week]before[Saturday]]
[list[Days of the Week]before[Monday]]
Here are the details of the beta releases of TiddlyWiki5. See TiddlyWiki5 Versioning for details of how releases are named.
Released 17th September 2014 at 21:10
See GitHub for detailed change history of this release
This is a minor release prior to the full release of TiddlyWiki on September 20th. The documentation has been cleaned up and improved (with more improvements to come).
The layout of files on tiddlywiki.com has been adjusted to make it more logical. See the ticket for a discussion. You can see the source files that make up tiddlywiki.com at https://github.com/Jermolene/jermolene.github.com
list-links
macro (further improvements are planned).markdown
and .md
filestimeline
macro to support a subfilter.jpeg
file extensions@Jermolene would like to thank the contributors to this release who have generously given their time to help improve TiddlyWiki:
Some WikiText is recognised only while the parser is in block mode.
Common characteristics of such block mode WikiText:
WikiText | Punctuation |
---|---|
Block Quotes in WikiText | Multi-line block quotes are enclosed by lines containing only the text <<< ; single line block quotes are also possible. |
Code Blocks in WikiText | Enclosed by lines containing only the text ``` |
Definitions in WikiText | Each term is on its own line and each definition is on its own line. |
Hard Linebreaks in WikiText | Enclosed by lines containing only the text """ . |
Headings in WikiText | Entire line starting with ! . |
Horizontal Rules in WikiText | A line containing only the text --- . |
Lists in WikiText | Each list item is on its own line. |
Paragraphs in WikiText | Any text other than the start punctuation of one of the other block mode WikiText will start a paragraph. Even the start punctuation of inline mode WikiText will start a paragraph. The parser includes all following lines into the paragraph until it encounters a blank line. |
Styles and Classes in WikiText | Enclosed by lines starting with @@ . |
Tables in WikiText | Each table row is a line starting and ending with | . |
Typed Blocks in WikiText | Enclosed by lines starting with $$ . |
The above WikiText types are only recognised in block mode. However, the text enclosed by most of them will be parsed in inline mode (Block Quotes in WikiText and Styles and Classes in WikiText are the two exceptions in which the parser will continue in block mode). While in inline mode the parser may encounter something which moves it to block mode (see WikiText parser mode transitions).
At the end of the terminating line, the parser will return to block mode.
.If the punctuation for the above types of WikiText is encountered while the parser is in inline mode, it will be ignored and output as-is.
Paragraphs are the most common WikiText. It is important to know they do not end until a blank line is encountered. Once a paragraph starts the parser will be in inline mode. Until that blank line is encountered other block mode syntax will be ignored:
This is a paragraph. Only __//inline mode//__ punctuation is recognised here. Block mode punctuation will be <b>ignored</b> until the paragraph ends (i.e. a blank line is encountered). For example: * List item punctuation is ignored * So is this horizontal rule: --- |tables|are|ignored| ! headings are ignored <<< multi-line block quotes are ignored <<<
That renders as:
This is a paragraph. Only inline mode punctuation is recognised here. Block mode punctuation will be ignored until the paragraph ends (i.e. a blank line is encountered). For example: * List item punctuation is ignored * So is this horizontal rule: — |tables|are|ignored| ! headings are ignored <<< multi-line block quotes are ignored <<<
To get the parser to recognise the above block mode WikiText, a blank line needs to be inserted after the "For example:" line. The blank line will be treated as the end of the paragraph and the parser will start recognising block mode punctuation again. Like this:
This is a paragraph. Only __//inline mode//__ punctuation is recognised here. Block mode punctuation will be <b>ignored</b> until the paragraph ends (i.e. a blank line is encountered). For example, here is a blank line: * due to above blank line, * list items work * the following horizontal rule also works: --- |!tables|!work| |cell 1| cell 2| ! Headings work <<< multi-line block quotes work <<< ; Term : Definition of that term Another paragraph can start here, but it will not end until blank line
That renders as:
This is a paragraph. Only inline mode punctuation is recognised here. Block mode punctuation will be ignored until the paragraph ends (i.e. a blank line is encountered). For example, here is a blank line:
- due to above blank line,
- list items work
- the following horizontal rule also works:
tables work cell 1 cell 2 Headings work
multi-line block quotes work
- Term
- Definition of that term
Another paragraph can start here, but it will not end until blank line
All the block mode examples above except for the paragraph are written one line after the other without blanks between. Those types of WikiText don't require the extra blank line to terminate.
There are two ways to produce HTML block quotes in TiddlyWiki5, one for content spread across multiple lines, and one for single line content.
The syntax for multi-line block quotes () is:
<<<
This is a block quoted paragraph
written in English
<<<
That renders as:
This is a block quoted paragraph written in English
... and the underlying HTML is:
<blockquote class="tc-quote"><p>This is a block quoted paragraph written in English </p></blockquote>
A citation can be added to the quote like this:
<<<
Computers are like a bicycle for our minds
<<< Steve Jobs
That renders as:
Computers are like a bicycle for our minds
Steve Jobs
... and the underlying HTML is:
<blockquote class="tc-quote"><p>Computers are like a bicycle for our minds </p><cite>Steve Jobs</cite></blockquote>
CSS classes can be added to a block quote:
<<<.myClass.another-class
Operating systems are like a brick wall for our minds
<<< Nobody
That renders as:
Operating systems are like a brick wall for our minds
Nobody
... and the underlying HTML is:
<blockquote class="tc-quote myClass another-class"><p>Operating systems are like a brick wall for our minds </p><cite>Nobody</cite></blockquote>
The core includes the class tc-big-quote
that renders block quotes with outsize double quotes:
<<<.tc-big-quote
A dramatic quote
<<< Somebody Important
That renders as:
A dramatic quote
Somebody Important
... and the underlying HTML is:
<blockquote class="tc-quote tc-big-quote"><p>A dramatic quote </p><cite>Somebody Important</cite></blockquote>
The single-line syntax for block quotes is actually an extension of the syntax for Lists in WikiText. For example:
> Quoted text
> Another line of quoted text
That renders as:
Quoted textAnother line of quoted text
... and the underlying HTML is:
<blockquote><div>Quoted text</div><div>Another line of quoted text</div></blockquote>
You can also nest quotes like this:
> A top quote
>> A subquote
> Another top quote
Which renders as:
A top quoteA subquoteAnother top quote
You can also mix block quotes with other list items. For example:
* List One
** List Two
**> A quote
**> Another quote
* List Three
That renders as:
A quoteAnother quote
... and the underlying HTML is:
<ul><li>List One<ul><li>List Two<blockquote><div>A quote</div><div>Another quote</div></blockquote></li></ul></li><li>List Three</li></ul>
The Blog edition of TiddlyWiki contains tools to help publish static HTML blogs written in TiddlyWiki. It is currently designed for use under Node.js.
While documentation is being prepared, see https://github.com/Jermolene-blog/blog for an example of use.
TiddlyWiki is designed to work with HTML5-compatible browsers.
The following table summarises the browser versions that are known to work with TiddlyWiki
Browser | Status |
---|---|
Internet Explorer | Version 10 and above |
Chrome | All recent versions |
Firefox | All recent versions |
Firefox for Android | All recent versions |
Safari | Version 6 and above |
The BrowserStorage Plugin enables TiddlyWiki to save tiddlers in browser local storage. This means that changes are stored within the browser, and automatically re-applied any time the base wiki is reloaded.
Browser local storage is not a panacea for TiddlyWiki:
Please use this plugin with caution. There are a number of unresolved issues and open questions.
The BrowserStorage Plugin can be installed from the plugin library.
The browse widget displays an HTML file browser button that allows the user to choose one or more files to import. It sends a WidgetMessage: tm-import-tiddlers carrying a JSON representation of the tiddlers imported from the files up through its parents. This message is usually handled by the NavigatorWidget which adds the tiddlers to the store and updates the story to display them.
The content of the <$browse>
widget is ignored.
Attribute | Description |
---|---|
multiple | Set to "multiple" to select multiple file upload |
deserializer | New in: 5.1.15 Optional name of deserializer to be used (by default the deserializer is derived from the file extension or type) |
tooltip | Optional tooltip text |
accept | New in: 5.1.23 Optional comma delimited list of file accepted extensions and/or MIME types |
message | Optional override of widget message to be generated. The files will be passed in the JavaScript object event.target.files |
param | Optional parameter to be passed with the custom message |
On iPhone/iPad choosing the multiple option will remove the ability to take photographs/videos directly into TiddlyWiki.
e.g.
<$browse>
renders as:
BT (née British Telecom) is the UK's largest telecommunications company. In 2007, Osmosoft was acquired by BT. JeremyRuston subsequently left BT in 2011.
Build the specified build targets for the current wiki. If no build targets are specified then all available targets will be built.
--build <target> [<target> ...]
Build targets are defined in the tiddlywiki.info
file of a wiki folder.
See tiddlywiki.info Files for details of defining build targets.
TiddlyWiki5 can be used to build older 2.x.x versions of TiddlyWikiClassic from their constituent components. Doing so involves these features:
tiddlywiki/classictools
plugin, containing a deserializer module which allows tiddlers to be loaded from TiddlyWiki 2.x.x .recipe
filesstripcomments
format for the ViewWidget, which strips single line JavaScript comments starting //#
stripTitlePrefix='yes'
attribute of the FieldsWidget, which removes prefixes wrapped in curly braces from the title
attribute{tiddler}HelloThere
would be transformed to HelloThere
TiddlyWikiClassic is built from the command line by running TiddlyWiki on Node.js. A typical usage would be:
node ../../tiddlywiki.js \
--verbose \
--load <path_to_recipe_file> \
--rendertiddler $:/core/templates/tiddlywiki2.template.html <path_to_write_index_file> text/plain \
|| exit 1
purpose | discard the last N input titles |
---|---|
input | a selection of titles |
parameter | N = an integer, defaulting to 1 |
output | all but the last N input titles |
New in: 5.2.2 The butlast
operator returns the input list unchanged if N
is 0. This is consistent with the behaviour of the rest Operator.
These examples make use of the Days of the Week tiddler.
[list[Days of the Week]butlast[]]
[list[Days of the Week]butlast[0]]
[list[Days of the Week]butlast[2]]
A B C D E F G H I J K L M +[butlast[7]]
The button widget displays an HTML <button>
element that can perform a combination of optional actions when clicked:
actions
attributeThe integrated actions are provided as a shortcut for invoking common actions. The same functionality is available via ActionWidgets, with the exception of the support for highlighting selected popups.
The content of the <$button>
widget is displayed within the button.
Attribute | Description |
---|---|
actions | A string containing ActionWidgets to be triggered when the key combination is detected. New in: 5.1.23 the modifier variable lists the modifier keys that are pressed when the action is invoked. The possible modifiers are ctrl, ctrl-alt, ctrl-shift, alt, alt-shift, shift and ctrl-alt-shift |
to | The title of the tiddler to navigate to |
message | The name of the widget message to send when the button is clicked |
param | The optional parameter to the message |
set | A TextReference to which a new value will be assigned |
setTitle | A title to which a new value will be assigned, without TextReference. Gets preferred over set |
setField | A field name to which the new value will be assigned, if the attribute setTitle is present. Defaults to the text field |
setIndex | An index to which the new value will be assigned, if the attribute setTitle is present |
setTo | The new value to assign to the TextReference identified in the set attribute or the text field / the field specified through setField / the index specified through setIndex of the title given through setTitle |
selectedClass | An optional additional CSS class to be assigned if the popup is triggered or the tiddler specified in set already has the value specified in setTo |
default | Default value if set tiddler is missing for testing against setTo to determine selectedClass |
popup | Title of a state tiddler for a popup that is toggled when the button is clicked. See PopupMechanism for details |
popupTitle | Title of a state tiddler for a popup that is toggled when the button is clicked. In difference to the popup attribute, no TextReference is used. See PopupMechanism for details |
aria-label | Optional Accessibility label |
tooltip | Optional tooltip |
class | An optional CSS class name to be assigned to the HTML element |
style | An optional CSS style attribute to be assigned to the HTML element |
tag | An optional html tag to use instead of the default "button" |
dragTiddler | An optional tiddler title making the button draggable and identifying the payload tiddler. See DraggableWidget for details |
dragFilter | An optional filter making the button draggable and identifying the list of payload tiddlers. See DraggableWidget for details |
tabindex | Sets the tabindex attribute of the button to the given value |
disabled | New in: 5.1.23 Optional, disables the button if set to "yes". Defaults to "no" |
Note: In almost all other cases where a TextReference is used as a widget attribute, it will be placed between curly brackets, to transclude the value currently stored there. However, when we use a TextReference as the value of a button widget's set
attribute, we are referencing the storage location itself, rather than the value stored there, so we do not use curly brackets there. Example: we could code a button widget that sets the caption
field of TiddlerA to be the same as that of TiddlerB as:
<$button set="TiddlerA!!caption" setTo={{TiddlerB!!caption}} >
Press me!
</$button>
Tip: Set class to tc-btn-invisible tc-tiddlylink
to have a button look like an internal link.
New in: 5.2.1
purpose | modify input titles by evaluating in turn a list of filters - as returned by the filter expression for this run - for each input title. |
input | all titles from previous filter runs |
output | the input titles as modified by the filters returned by this filter run |
The filter expression for this filter run is evaluated to return a list of filters. Each input title is then evaluated against each of the filters in turn, and the input title is replaced with the first result of the first filter that returns a non-empty list. If none of the filters return a result for an input title, it is replaced with an empty string.
The following variables are available within the filter run:
currentTiddler
- the input title..currentTiddler
- the value of the variable currentTiddler
outside the filter run.The :cascade
filter run prefix is used by the TiddlyWiki core to choose the colour for each tiddler as used in the tag pill generated by the tag macro.
:cascade[all[shadows+tiddlers]tag[$:/tags/TiddlerColourFilter]!is[draft]get[text]]
The filter expression inside the above :cascade
filter run returns a list of filters from the text fields of tiddlers tagged as shown below:
[has[color]then{!!color}]
[tag[TableOfContents]then[#1e90ff]] [tag[Working with TiddlyWiki]then[darkorchid]]
[[$:/config/DefaultTiddlerColour]has[text]get[text]trim[]]
For each input title, each of these filters is now applied to in turn until the first filter that returns a non-empty list. The first result from this non-empty list replaces that input title and is used as the colour for that tiddler.
[all[shadows+tiddlers]] :cascade[all[shadows+tiddlers]tag[$:/tags/TiddlerColourFilter]!is[draft]get[text]] +[!is[blank]limit[10]]
This example illustrates step-by-step how the :cascade
filter run works.
A filter expression whose output returns a list of filters is required. Typically such a filter expression will construct the list of filters by querying some field in a set of tiddlers (likely via tag). To keep this example self-contained, 3 filters are stored in the filter1, filter2 and filter3 fields of this tiddler. Text references and instances of the append operator are used to combine the fields into a list of filters.
The filter [{!!filter1}append{!!filter2}append{!!filter3}]
, generates this list of filters:
[prefix[ca]then[ca]]
[suffix[at]then[at]]
other
For this example, cat can bat bug
will be used as the input titles. Each input title will be evaluated by :cascade
against each of the above filters in turn. To help understand what :cascade
sees internally, the following table uses the Map Filter Run Prefix to show the result of each individual filter.
cat can bat bug :map[prefix[ca]then[ca]]
| cat can bat bug :map[suffix[at]then[at]]
| cat can bat bug :map[[other]]
|
Click "Try it" on the above 3 examples. The first non-blank value from each row as read from left to right will be returned when :cascade
is used. Click "Try it" below to see the final result:
cat can bat bug :cascade[{!!filter1}append{!!filter2}append{!!filter3}]
Cascades are a key mechanism used to construct and customise TiddlyWiki's user interface.
Cascades provide a means to select one of multiple values based on flexible, extensible criteria. They can be thought of as a list of conditions that are evaluated in turn until one of them matches.
Each cascade is defined by a special tag which identifies the tiddlers containing the conditions to be matched. The Order of Tagged Tiddlers determines the order in which the conditions are processed, and provides the means for arranging new rules at specific points in the cascade.
The conditions are defined by a Filter Expression in the text field. The filters are evaluated with the list of input titles set to the title of the tiddler to be considered. The currentTiddler
variable is also set to the title of the tiddler to be considered.
If the filter returns no result then that result will be ignored and the cascade proceeds to test the next condition. If the filter expression does return at least one result then it serves as the result of the entire cascade.
The Cascade Filter Run Prefix provides the implementation of the underlying logic.
The Story Tiddler Template Cascade contains the logic for determining a tiddler should be displayed as an editable draft or in view mode. By default, it consists of two tiddlers containing the following list of rules:
[is[draft]then{$:/config/ui/EditTemplate}]
– if it is a draft tiddler, use the template title given in the tiddler $:/config/ui/EditTemplate[{$:/config/ui/ViewTemplate}]
– otherwise, use the template title given in the tiddler $:/config/ui/ViewTemplateThe TiddlyWiki core uses cascades to choose the following elements:
Story Tiddler Template Cascade | The template used to display a particular tiddler in the story river. By default, the edit template is chosen for draft tiddlers, and the view template for others |
Tiddler Icon Cascade | The optional icon associated with a particular tiddler (displayed alongside the title) |
Tiddler Colour Cascade | The optional colour associated with a particular tiddler (used to colour the tiddler icon and if the tiddler is used as a tag also provides the colour for the tag pill) |
View Template Title Cascade | The template used to display the title of a particular tiddler (used by the default view template to display the tiddler title) |
View Template Body Cascade | The template used to display the view mode body of a particular tiddler (used by the default view template to display the tiddler body) |
Edit Template Body Cascade | The template used to display the edit mode body of a particular tiddler (used by the default edit template to display the tiddler body editor) |
Field Editor Cascade | The template used to display the edit mode of a tiddler field (used by the default edit template to display the field editor) |
You can see the current settings for each cascade in $:/ControlPanel under the Info -> Advanced -> Cascades tab.
CSS is a standard plain-text format used for defining the presentational style of the various elements on a web page.
purpose | rounds a list of numbers up to the next largest integer |
---|---|
input | a selection of titles |
output | rounds each of the input numbers up to the next largest integer |
New in: 5.1.20 See Mathematics Operators for an overview.
The changecount macro returns the number of times the current tiddler has been created, stored or deleted during the current TiddlyWiki session.
If a tiddler is deleted and subsequently recreated, its changecount
will go up by two.
(none)
<<changecount>>
The value will increase if you edit this tiddler and store it again, even without making any changes to its content.
To access the changecount
of a different tiddler, use a $tiddler
widget:
<$tiddler tiddler="Draft of 'New Tiddler'">
<<changecount>>
</$tiddler>
The value shown will increase whenever you create, store or delete New Tiddler.
This release resolves a number of inconsistencies with the way that filters are handled. The changes mean that existing filters may need to be updated - particularly those that must deal with missing or shadow tiddlers.
Most filter operators act by choosing some or all of their source titles to pass through or re-order. Those that add new entries that are not drawn from the source list are referred to as selectors. Prior to 5.0.9-beta, a few filter operators were inconsistent in whether they filtered from the source list or selected new entries into it.
The specific changes are:
The sources for the all operator can be combined with the +
character. For example, [all[shadows+tiddlers]]
returns all shadow tiddlers and all ordinary tiddlers.
Previously, it was common to have [is[shadow]]
at the start of a filter string to select all the shadow tiddlers. In 5.0.9 and above, this will not return all the shadow tiddlers, but instead just those ordinary tiddlers that are also shadow tiddlers (by virtue of having overridden one). The resolution is to use the new all operator. For example, consider this filter from 5.0.8:
[is[shadow]!has[draft.of]tag[$:/tags/AdvancedSearch]] [!is[shadow]!has[draft.of]tag[$:/tags/AdvancedSearch]] +[tag[$:/tags/AdvancedSearch]]
In 5.0.9, that filter has been changed to:
[all[shadows+tiddlers]tag[$:/tags/AdvancedSearch]!has[draft.of]]
Note how the all operator allows operations to be performed on tiddlers from combinations of sources.
[is[current]]
One result of the changes is that [is[current]]
now strictly filters from the source tiddlers; so, if the current tiddler is a missing tiddler not in the source list, then [is[current]]
will return an empty list.
The solution is generally to use [all[current]]
instead. It doesn't read as well, but has the required behaviour of returning just the current tiddler, regardless of whether it is in the source tiddlers.
There are minor changes to the way that the title and field operators work.
The title operator is a selector: it returns the specified title regardless of whether it is in the current source. title is used as the default operator if none is specified
The field operator is a filter: it only returns a subset of the source tiddlers. field is used as the default operator if the supplied operator is not defined (the supplied operator is passed as the suffix to the field operator, so [description[Missing]]
is equivalent to [field:description[Missing]]
).
purpose | generates string characters from their numeric character codes |
---|---|
input | ignored |
parameter | C = numeric character code |
output | a string formed from concatenating the characters specified by the numeric codes given in the operand(s) |
New in: 5.2.0
This operator returns a string formed from concatenating the characters specified by the numeric codes given in one or more operands. It is useful for generating special characters such as tab (charcode[9]
) or new line (charcode[13],[10]
).
The checkbox widget displays an HTML <input type="checkbox">
element that is dynamically bound to either:
The content of the <$checkbox>
widget is displayed within an HTML <label>
element immediately after the checkbox itself. This means that clicking on the content will toggle the checkbox.
Attribute | Description |
---|---|
tiddler | Title of the tiddler to manipulate (defaults to the current tiddler) |
tag | The name of the tag to which the checkbox is bound |
invertTag | When set to yes, flips the tag binding logic so that the absence of the tag causes the checkbox to be checked |
field | The name of the field to which the checkbox is bound |
index | New in: 5.1.14 The index of the tiddler, a DataTiddler, to which the checkbox is bound |
checked | The value of the field corresponding to the checkbox being checked |
unchecked | The value of the field corresponding to the checkbox being unchecked |
default | The default value to use if the field is not defined |
class | The class that will be assigned to the label element |
actions | New in: 5.1.14 A string containing ActionWidgets to be triggered when the status of the checkbox changes (whether it is checked or unchecked) |
uncheckactions | New in: 5.1.16 A string containing ActionWidgets to be triggered when the checkbox is unchecked |
checkactions | New in: 5.1.20 A string containing ActionWidgets to be triggered when the checkbox is checked |
disabled | New in: 5.1.23 Optional, disables the checkbox if set to "yes". Defaults to "no" |
Using the checkbox widget in tag mode requires the tag attribute to specify the name of the tag. The tiddler attribute specifies the tiddler to target, defaulting to the current tiddler if not present.
This example creates a checkbox that flips the done tag on the current tiddler:
<$checkbox tag="done"> Is it done?</$checkbox>
That renders as:
Using the checkbox widget in field mode requires the field attribute to specify the name of the field. The checked and unchecked attributes specify the values to be assigned to the field to correspond to its checked and unchecked states respectively. The default attribute is used as a fallback value if the field is not defined.
This example creates a checkbox that is checked if the field status is equal to open and unchecked if the field is equal to closed. If the field is undefined then it defaults to closed, meaning that the checkbox will be unchecked if the status field is missing.
<$checkbox field="status" checked="open" unchecked="closed" default="closed"> Is it open?</$checkbox><br>''status:'' {{!!status}}
That renders as:
status:
To use the checkbox widget in index mode set the index attribute to the index of a DataTiddler. The checked and unchecked attributes specify the values to be assigned to the index and correspond to its checked and unchecked states respectively. The default attribute is used as a fallback value if the index is undefined.
The example below creates a checkbox that is checked if the index by the name of this tiddler in the tiddler ExampleData is equal to selected and unchecked if the index is an empty string. If the index is undefined then it defaults to an empty string, meaning the checkbox will be unchecked if the index is missing.
<$checkbox tiddler="ExampleData" index=<<currentTiddler>> checked="selected" unchecked="" default=""> Selected?</$checkbox>
That renders as:
You can use triple backticks ```
to mark code blocks ():
``` This will be monospaced ```
Renders as:
This will be monospaced
To be interpreted correctly, the three backticks need to be at the start of the line and immediately followed by a line-break.
Be aware that any preceding paragraph content should be properly terminated with a double line break, too. So, this example is wrong:
This is an ordinary paragraph ``` This will be monospaced ```
The correct version is:
This is an ordinary paragraph ``` This will be monospaced ```
Note that some keyboard layouts treat the backtick as a dead key, making it hard to type. The trick is to type three backticks followed by a space. Alternatively, type all six backticks in one go, then a space, and then move the cursor back three characters to type or paste the content.
The codeblock widget renders text in <pre>
and <code>
blocks, causing it to be
displayed monospace. A language may optionally be specified using the
language attribute, however syntax highlighting will only be used if the
Highlight Plugin is installed.
The content of the <$codeblock>
widget is ignored.
Attribute | Description |
---|---|
code | Contents of the block to render as code |
language | Programming language for syntax highlighting |
The language
attribute accepts either:
text/html
or image/svg+xml
)Here is an example embedding the contents of a tiddler as a code block.
<$codeblock code={{$:/editions/tw5.com/macro-examples/say-hi}} />
That renders as:
\define sayhi(name:"Bugs Bunny" address:"Rabbit Hole Hill")
Hi, I'm $name$ and I live in $address$.
\end
A codeblock may also specify a language.
<$codeblock code="SELECT * FROM users WHERE deleted = false" language="sql" />
That renders as:
SELECT * FROM users WHERE deleted = false
The CodeMirror plugin adds a sophisticated web-based editor to TiddlyWiki.
See https://tiddlywiki.com/plugins/tiddlywiki/codemirror for a demo.
The colour (or color) macro returns the CSS value of one the colours in the current palette.
If no such entry exists in the current palette, the vanilla palette is used instead. If no such entry exists in the vanilla palette, the system looks for a configuration tiddler with the title $:/config/DefaultColourMappings/<colour-name>
and transcludes the colour from the text field. This enables to plugins to ship defaults for colours that are not present in the core palettes.
page-background
<<colour code-border>>
<<colour foreground>>
<<colour page-background>>
<<colour sidebar-tab-background>>
<<colour tag-foreground>>