Dirty Trix [3]: Searchable, hidden, "tag cloud"

Sometimes you may want to add information or notes or other pieces of text to a tiddler that ideally you don’t want to have displayed/printed with that tiddler. Usually, you’d turn to using a field or sometimes even tag. But both have their limitations. Most fields (apart from title, text and tags) are not part of TiddlyWiki’s standard search mechanism. And you don’t want to create tags just for little notes – too wasteful and it would clutter up the tag space.

Fortunately, there is another way.

Elsewhere (outside of TiddlyWiki) you must have seen sites that use a “tag cloud”. What if you could take that idea but instead of using actual tags, create an area inside your tiddler that isn’t actually visible but still responds to search like it was part of the regular tiddler content: like the title says, a “Searchable, hidden tag cloud”.

First, decide what you want to call your cloud and simply use it as a custom HTML element. For this simple exercise, let’s call it  <my-cloud>

<my-cloud>
Extra stuff and things about legless sheep that were not mentioned in the main topic.
</my-cloud>

You don’t need to define your custom  <my-cloud>   element somewhere, or ask the W3C to add it to the HTML Standard so that you can use it – just go right ahead and use it.

Next, we need to prevent it from appearing in the tiddler when it is viewed…

In your CSS Stylesheet:

my-cloud {
  display:none;
}

Or, for more targeted and paranoid coverage…

@media screen, print {
  my-cloud {
    display:none !important;
  }
}

I like to place  <my-cloud>  at the end of my tiddler content – it seems less obtrusive down there. You may prefer it at the top, or even in the middle (but that’s a bit weird, don’t you think? Really, you should talk to someone).

Okay, we’re done. Happy hacking!

3 Likes

Nice trick!
It could also be done with <!-- html comments -->, it will also show up in text searches.
Much simpler, as it doesn’t require any setup, and is guaranteed to never be displayed.
At the same time, it cannot be ever be displayed or reliably used in other way than text search (how do you tell your special comments from comments you used to hide stuff, or comments in the core and plugins).
So the custom element provides more flexibility than html comment.

I personally would feel more comfortable with a field, and modify the search filter, if used extensively. The custom element provides a good flexibility if the content should switch wikis though.

1 Like

Yes, simply use comment is enough. Search bar still search things in comments.

Or you can use the block mark, it is also hidden, and searchable, and you can link to it to jump to this section Feat: allow link to section mark by linonetwo · Pull Request #7744 · TiddlyWiki/TiddlyWiki5 · GitHub

1 Like

I didn’t say it but, sometimes, during development, it’s handy to make them visible.

Very nice!

It gets me wondering, though, if it might not be useful for that case to create a simple macro/procedure that renders nothing by default, but if a certain tiddler value is toggled on, then it actually displays something like a tags editor/viewer.

<my-cloud """Bows [[Flows of Angel Hair]] [[Ice Cream Castles]] [[Feather Canyons]]""">> 

A trivial version of this idea:

title: my-cloud
tags: $:/tags/Global
show: no

\procedure my-cloud(names)
<%if [[my-cloud]get[show]match[yes]] %>
<$list filter="[enlist<names>]" ><<tag>> </$list>
<% endif %>
\end

Tiddlers calling this as above would show nothing by default, but if you change my-cloud$show to yes, then they will render a tag-list. This is searchable text, but not available for TW querying.

2 Likes

You’re close to where my version actually ended up. It’s styled many different ways depending on context - easy to do with CSS.

1 Like

Of course. I already make extensive use of HTML comments (right @Scott_Sauyet ?)

Big picture coming…

Documentation output on the left, raw tiddler with HTML comments on the right (nested inside CSS comments – how’s that for dirty trix and chicanery?)

1 Like