Reordering Tiddler UI elements?

[Samir Patel]

Specifically, I am trying to move the the tags-wrapper below the body of any tiddler.

I assumed it would be a simple re-ordering of div tags, but I wasn't able to find them in any of the SystemTags I looked at. I thought it would be in ViewTemplate.

[Mark S.]

Be sure to have a backup.

The UI is formed by tiddlers tagged with $:/tags/ViewTemplate. Find one of them, perhaps

    $:/core/ui/ViewTemplate/body

Click on it's $:/tags/ViewTemplate tag. A list of everything tagged by that tag will appear.

Drag and drop

   $:/core/ui/ViewTemplate/tags

below

    $:/core/ui/ViewTemplate/body

HTH

[Eric Shulman]

On Thursday, May 7, 2020 at 6:46:03 PM UTC-7, Samir Patel wrote:

Specifically, I am trying to move the the tags-wrapper below the body of any tiddler.

I assumed it would be a simple re-ordering of div tags, but I wasn't able to find them in any of the SystemTags I looked at. I thought it would be in ViewTemplate.

METHOD #1:

If you look at $:/core/ui/ViewTemplate, you will see this bit of $list widget syntax:

<$list filter="[all[shadows+tiddlers]tag[$:/tags/ViewTemplate]!has[draft.of]]" variable="listItem"><$transclude tiddler=<<listItem>>/></$list>

In other words, the ViewTemplate display is composed of separate tiddlers, each tagged with $:/tags/ViewTemplate.

You can control the *order* in which those tiddlers are displayed by adding a special fieldname, list-before or list-after, to the desired tiddler.  Thus, for your goal (moving the tags to follow the body), you can edit the $:/core/ui/ViewTemplate/tags tiddler and add a list-after field containing a value of:

$:/core/ui/ViewTemplate/body

METHOD #2:

Alternatively, you can re-order the ViewTemplate tiddlers using drag-and-drop.

Begin by creating a new temporary tiddler (any title), containing:

<<tag $:/tags/ViewTemplate>>

This will display a "tag pill" for $:/tags/ViewTemplate.  Clicking on the tag pill will show a droplist of all titles with that tag.

To adjust the order of the $:/core/ui/ViewTemplate/tags item, simply find that title in the list and click-and-drag that title.  While you are dragging the title, a dashed green box will appear, showing the position at which the title will be placed when dropped. Move the cursor until the green box appears after $:/core/ui/ViewTemplate/body, and release the mouse button to drop the tiddler title there.

Once you are done, you can delete the temporary tiddler you created that shows the "tag pill".

Note that, unlike METHOD #1, which adds a "list-after" field to $:/core/ui/ViewTemplate/tags, METHOD #2 modifies the shadow tiddler, $:/tags/ViewTemplate by adding a field named "list", containing the current order of *all* the titles with the $:/tags/ViewTemplate tag.

In either case, when you are done, there is one modified shadow tiddler, and the effect is the same: the tags will appear below the body content.

enjoy,

-e

Eric Shulman

TiddlyTools.com: "Small Tools for Big Ideas!" (tm)

InsideTiddlyWiki - http://TiddlyTools.com/InsideTW

[Samir Patel]

Holy moly that's so cool! Thanks Mark!