PBE Games on DriveThruRPG

Showing posts with label tiddlywiki. Show all posts
Showing posts with label tiddlywiki. Show all posts

Thursday, February 11, 2010

Using TiddlyWiki - Part 2

In the last article in this series, we talked about obtaining and setting up TiddlyWiki for basic use. In this article I'm going to focus on using it effectively. I'm not going to go into vast detail here, first because TiddlyWiki isn't that complicated (though there are quite a few plugins available that add features), and second because I believe in the KISS principle. Let's start with the basics, creating content.

Adding Content

Adding content to TiddlyWiki is as simple as hitting the new tiddler link on the right sidebar and typing text. You'll probably want to read a bit about markup and tagging before you really dive in, but you don't have to. The only requirement for a tiddler is that it have a name. See how hard that was?

Basic Markup

The last article already talked about how to edit a tiddler. TiddlyWiki markup is a way to add headers, lists, text formatting, links and images to your tiddler. Here are some of the most commonly used markup elements:

Basic Text - Just type. Any text without markup is treated as plain text. The edit box automatically word wraps. Use the enter key to denote the end of a paragraph.

Headers - Headers are denoted by one or more ! characters at the beginning of a line, followed by the header text. More ! are less important headers. A typical header:

! Section 1
!! Section 1.1 
!! Section 1.2
!!! Section 1.2.1

Lists - List entries begin with one or more * characters for bullet lists or one or more # characters for numbered lists. Multiple markers increase the indent level. Each list entry should start at the beginning of a line. Example:

* Bullet
** Nested bullet
** Another nested bullet
# Numbered
## Nested numbered
# Numbered again

Text formatting - Most inline text formatting is done with two marks on either side of the text receiving the formatting.
  • Bold - double single-quotes around the text.
  • Italic - double forward slashes around the text.
  • Bold Italic - double single-quotes around double forward slashes around the text.
  • Underline - double under-bar characters around the text.
Links - There are two types of links:
  • Internal link - Either the WikiWord name of the tiddler or the tiddler surrounded by double square brackets creates a link to the tiddler.
  • External link - An URL will automatically be translated to a link. If you want to use text and link to a URL, you can do it with double square brackets


    [[Some Text|http://rpgdump.blogspot.com]]
    creates a link called Some Text pointing to my blog.
Images - The basic image links are [img[Image Name]] or [img[Some Text|Image Name]] where:
  • Some Text - the optional tooltip for the image when the mouse is over it.
  • Image Name - the path to the file.
A bit more on images: If you place any images in the same folder as your TiddlyWiki, you can simply refer to them by name (no path required). You can also use a URL if the image is hosted elsewhere.

If you want to delve further into markup (and there's more available), check out the TiddlyWiki wiki, specifically the markup page.

Tags

Tags are labels you can apply to tiddlers as a means of organizing your information. With a little care they can provide very quick reference to both individual and groups of related tiddlers. Tags themselves are also tiddlers, so you can describe what the tag means in its own tiddler.

To tag a tiddler, simply place a label in the tag edit box at the bottom of the edit window. Tags can be single words or multiple words surrounded by double square brackets. My personal convention is to use all lower case letters for tags to avoid name clashes with content tiddlers.

The tags you use should fit the information you're trying to mark up. Using my recent Moria game as an example I have the following tags laid out:
  • Creatures - One tag per general creature type, for example: goblin, orc, troll. These tags get applied to the stat blocks and descriptive text for the creature, along with any  encounters that include them or locations inhabited by them.
  • Locations - One tag per broad location. For outdoor stuff, I use regions, towns or encounter locations. For dungeons, I use level names. This allows me to quickly find the relevant information for any specific locale.
  • Stats - A singular tag used to mark any stat block. It's a handy way to find any specific stat block on the fly.
  • Encounter - One tag per broad location. These match up to the location tags mentioned earlier, but are applied only to encounters. In Moria for example I have eregion encounter, hollin encounter, and moria encounter defined.
  • Other - I have a bunch of other tags, like item to mark important or unique items, rules to mark house rules or special mechanics, and magic to mark any unique magic effects or powers I might need for reference.
Check out PBE Games on DriveThruRPG

Transclusion

What? Yeah it's kind of a silly word. Transclusion is including one document inside another without cut/paste. It's a great feature supported by most wikis including TiddlyWiki. Here's how to do it:
<<tiddler [[Some Tiddler]]>> 
That's it. What this does is automatically put the contents of Some Tiddler inline in the new document. Any updates done to the transcluded tiddler are automatically updated anywhere it appears.

One of the best uses of this is to include stat blocks in an encounter tiddler. Simply transclude each stat block and they'll automatically be appended to the encounter text.

Organization

That pretty much covers the basics of how to use TiddlyWiki. There are a few best practices guidelines to keep in mind if you decide to use this tool.

Consistent Naming - Wikis are picky about exact names and upper and lower case. Be consistent with your naming and it'll help avoid extra work. Here are the conventions I use:
  • Tiddlers - Capitalized as titles, always surrounded in double square brackets when referenced. This is the most readable way I've found to name tiddlers.
  • Prefixes - I prefix all encounter tiddlers with Encounter: and all stat blocks with Stats:. It allows me to quickly spot these crucial elements.
  • Tags - All lower case, single word if possible, but clarity of grouping is more important than using a single word.

Save often and do backups - I have never experienced any problems with a TiddlyWiki, and I've used them for some pretty large projects. Prudence always wins though, and could save you a load of work if something goes wrong.

One thing, one tiddler - Keep this in mind when preparing content. Transclusion makes it easy to concatenate multiple tiddlers into a summary. It's more difficult to divide a huge mess of text into individual pieces. I generally use the following types of tiddlers:
  • Overviews - a top level summary of a major location or group.
  • Locales - individual locations within a region. In dungeons these are room by room. In towns they're business by business or location by location. Outdoors I stick with natural geographic areas.
  • Stat blocks - detailed information on specific creatures, spells or items, one thing per tiddler.
  • Encounters - locale plus opponents (often including transcluded information). Basically everything needed to run the encounter.
Link always - If you're referring to something in your text that you've already defined, link to the other tiddler. I generally do this with the first instance of a linkable word in a tiddler (i.e. the first mention of Goblins in an encounter gets a link to the Goblins summary tiddler). If you haven't defined the target tiddler yet it will show up in the Missing list on the sidebar. The real power of TiddlyWiki is being able to access related information quickly and easily.

OK, by now you're either sold or you're running screaming from the room. Hopefully the former. I hope this pair of articles has provided some insight into using TiddlyWiki for your own campaign notes. I'm happy to answer any questions that I may have left unanswered.

Wednesday, February 10, 2010

Using TiddlyWiki - Part 1

I've mentioned before that I use TiddlyWiki to store my campaign notes and write this blog. I thought it might be useful to write an article covering the basics of how to use it, along with some of the features I make use of in my campaign notes.

First a brief introduction. If you're not familiar with TiddlyWiki, it's essentially an implementation of a full-featured wiki in a single file. That means you can carry it around on a USB stick or email it with ease. The file contains not only the content you create, but all the tools required to edit and update that content. The exceptions to the one file structure are images and external files, which are treated as external links (more on that in a bit).

Obtaining TiddlyWiki

Getting a copy of the empty file is easy. Simply visit the download page here or here and save locally. Once you have the file downloaded you can move it around using the standard tools provided by your operating system (i.e. drag and drop or copy commands). The basic unit of information in TiddlyWiki is a tiddler, which corresponds to an article in standard wiki-speak. Each tiddler is referenced by a name either written as a WikiWord, or, if you like spaces in your titles, [[Surrounded by Double Square Brackets]]. My personal preference is to use spaces and double square brackets, but either method works.

If you're going to make use of TiddlyWiki, it's probably worth bookmarking the TiddlyWiki wiki site. There's a ton of useful information there. Here's the link: http://tiddlywiki.org/wiki/Main_Page

Startup


Now that you have TiddlyWiki in hand, let's do something with it.
  • Create a new folder somewhere in your documents tree, and copy the TiddlyWiki file there. A separate folder isn't necessary, but it'll help keep linked images organized (remember they're not part of the base file).
  • Open the TiddlyWiki file with your web browser. This is probably as simple as double-clicking it, but you may have to use the File/Open menu in your browser. You should see something like the image here.
The important features:
  • Across the top is the backstage bar, tools to deal with plugins and imports. We'll ignore that for now.
  • Below the backstage bar is the title area, defined by two editable tiddlers that allow you to set the name of your wiki.
  • On the left is the MainMenu, an editable sidebar which you can modify to suit your needs.
  • In the center is the main content area. Tiddlers you create/open show up here. Each tiddler has the following features arranged around it:
    • Top right - the tiddler interaction links. These allow you to edit, close or check references on the current tiddler.
    • Right side - the tags box will show any tags that apply to this tiddler. More on tags later.
    • Top left - the tiddler title.
  • On the right is the sidebar, providing access to basic editing and navigation features.
Check out PBE Games on DriveThruRPG

Customize It

Let's do a bit of customization to make this TiddlyWiki ours. Once you're familiar with how things work you can set up a default TiddlyWiki with most of this stuff already done to save time. The default TiddlyWiki configuration automatically opens a tiddler called GettingStarted, and it's a good place to begin. You'll see several links in this tiddler. Note that they're in italics, indicating the content they link to isn't yet defined. These happen to be special shadow tiddlers, meaning the system has a default tiddler it uses if they're not yet defined. Let's change a few things.

Click on SiteTitle to open the empty tiddler, then hit edit, which leaves you with the default tiddler edit window open. It has a main edit box, with a smaller edit box for tags at the bottom (see image). Replace the text with whatever you like. I'm going to use Demo Tiddler. Hit the done button in the tiddler interaction links. Congratulations, you've just edited your first tiddler.

Repeat this process for the SiteSubTitle. I'll use [[RPG dumping ground|http://rpgdump.blogspot.com/]] which is a fancy way of applying a name to a link (more on that later).

Click on the MainMenu link and edit. I'm going to set this up to provide a link to itself, to my content, and label the sections with a couple headers. Here's what I'm going to type (includes some basic markup for headers):

!! Content
[[Introduction]]
[[The Village]]
[[The Dungeon]]
!! Tools
[[GettingStarted]]
[[MainMenu]] 
 
Once you're happy with your edits, hit done in the tiddler interaction links. Note how the left menu has updated. You can click on any of these links to open the associated tiddlers (note that most of them are empty, ready for you to add content).

Click on the DefaultTiddlers link and edit. This tiddler contains a list of tiddlers that are automatically opened when you first open the TiddlyWiki file. The default content is GettingStarted, but I'm going to change this to read:

[[Introduction]] 
 
Last step: Fill in your user name in the box at the bottom of the GettingStarted tiddler. It doesn't really matter if you're the only person writing in this wiki, but it does let you track changes if multiple people use it.

OK, we've done some work, let's insure we save it. Click on the save changes item in the right-hand sidebar or save in the backstage bar at the top of the page. Note that your browser will likely complain bitterly about saving a file locally. I trust the TiddlyWiki site to provide a clean source file, but if you obtain one from elsewhere be careful. To save, check the remember this choice option and hit OK in the warning dialog. TiddlyWiki saved. The final result should look something like this image. The next time you open your TiddlyWiki file, it will look the same, except the empty Introduction tiddler will be open instead of GettingStarted.

The Sidebar

Before I close let me run down the sidebar options quickly. That will let me focus on content next time. Most of these are pretty straightforward, but can be confusing if you're not used to wikis. From the top:
  • Search - This is a simple search box that will find any text you type and automatically open the tiddlers that contain it. Note that searching on something like ''the'' in a big TiddlyWiki can take some time.
  • Close All - Closes all currently open tiddlers. Basically cleanup the display. Tiddlers stay open until you close them so it's possible to have quite a few open.
  • Permaview - Updates your browser URL window with a link to the currently active tiddler.
  • New Tiddler - Opens a fresh tiddler in edit mode, ready for input. You can also create new tiddlers by clicking on any link that names a non-existent tiddler.
  • New Journal - Journals are special tiddlers labeled with the current date and time. Useful if you're writing a diary or session log.
  • Save Changes - Saves the entire TiddlyWiki.
  • Options - Provides access to additional configuration options, including auto-save, backups, and search controls. There's also a link here to AdvancedOptions, which allows you to tweak even more stuff.

Tabbed Window

This section of the sidebar changes dynamically as you add tiddlers to your TiddlyWiki. Here's what the tabs contain:
  • Timeline - A tiddler listing organized by last edit time, newest first. Handy for finding what you just changed.
  • All - An alphabetic listing of every tiddler.
  • Tags - An alphabetic listing of every tag.
  • More - Several tiddler lists that might need attention:
    • Missing - Tiddlers that are linked to, but don't exist.
    • Orphans - Tiddlers that exist but aren't linked to.
    • Shadowed - Tiddlers that have default system values, generally built-in to TiddlyWiki.

OK, that should do it for today. At this point you should have a ready to use TiddlyWiki configured for your own project. In the next article I'll write about:
  • Basic markup - How to do headers, formatted text, lists and links.
  • Tags - How to organize tiddlers with the built in tag system.
  • Transclusion - A handy way to include one tiddler within another.
  • Organization - Some thoughts on organizing your notes.
Stay tuned.

Here's a link to part two.