[Help] Creating highlight Wikitext Syntax?

[Justin_H]

So, I’ve wanted to create my own wikitext for awhile, and one of the reasons is to make some syntax for highlighting certain text, using the <mark> tag as the base.

I was thinking something along the lines of !!Highlighted Text!!

How could I go about doing this?

[TiddlyTitch]

@Justin_H

So, I’ve wanted to create my own wikitext

The place to start is @pmario’s Custom Markup

Custom Markup

TT

[Justin_H]

Thanks TiddlyTweeter, currently reading through this to wrap my head around it.

I was hoping to just clone and modify one of the $:/core/modules/parsers/wikiparser/rules but it doesn’t seem like that’ll work, atleast from what I’m reading.

Edit: so, as I understand it (and I don’t know if I do) this plugin adds more symbols to allow adding wikitext? (I may have that wrong, forgive me if I do )

my aim is to use my own symbols, like how they use corner and slash, rather than having to use the tick or other symbols, so that I can having something that looks as close to the core wikitext as I can.

Hopefully I’ll find the answers while reading through this haha

[Justin_H]

OK - I should really test things more thuroughly before posting, I was actually successful in cloning and modifying my own $:/core/modules/parsers/wikiparser/rules and did not realize until doing a save a reload.

I’m still going to read through the Custom-Markup plugin in hopes of learning more about how this all works, but for anyone interested in doing what I did, here is my highlight.js!

$__core_modules_parsers_wikiparser_rules_emphasis_highlight.js.json (1.2 KB)

[TW_Tones]

@Justin_H I think @TiddlyTitch has given you a general answer and pointed you to a powerful solution in part because you have not being very specific, or have you?.

If my below notes are insufficient, Can I suggest you give some more details as to what you want to achieve? I am familiar with Custom Markup and a number of other approaches that may be answers to the questions you have not yet asked.

There are already half a dozen ways to “highlighting certain text” and many are highly customisable out of the box without any rocket science. I don’t think you need to make new wiki markup.

• Further to this I have done a lot of work with leveraging CSS and/or html including “arbitrary html tag’s” within tiddlers.
• One option it to just use <mark> my high lighted text</mark> which works out of the box !!<mark>This is highlighter heading</mark>
  • I have a tool to support this wrapping, just ask.
• Another is define a CSS class and apply it to existing wiki markup

<style>
.m {
  background-color: yellow;
  color: black;
}
</style>

!!.m Test this heading

You can then move the style info to a stylesheet, so it becomes global.

[Justin_H]

@TW_Tones

@Justin_H I think @TiddlyTweeter has given you a general answer and pointed you to a powerful solution in part because you have not being very specific, or have you?.

I probably haven’t haha I’m not great at explaining my intentions or thoughts.

@TW_Tones

If my below notes are insufficient, Can I suggest you give some more details as to what you want to achieve? I am familiar with Custom Markup and a number of other approaches that may be answers to the questions you have not yet asked.

My goal was to create my own WikiText syntax that looked as if it were straight out of the core of tiddlywiki, both to learn more about the inner workings of tiddlywiki, and for my own personal use-case.

to clarify, my goal is to use two unused symbol characters to create my own custom inline wikitext syntax to apply <mark> to a selected amount of text.

to do so, I cloned and modified $:/core/modules/parsers/wikiparser/rules/emphasis/italic.js

and replaced /\/\//mg; with /&&/mg; inside the tiddler, allowing me to add highlighting using the following: &&Highlighted Text&&

I did not realize that in order to load the new Javascript I had to reload my TiddlyWiki, and was under the assumption it was because there was some extra step i had somehow missed, however that was partly the case.

[TW_Tones]

Sure, if it is primarily a design and learning exercise go for it. But keep in mind;

• A lot of people have gone down this path, the best yet is the custom markup solution
• There are plenty of alternatives to actual wiki markup changes
• In the near future this is going to change and the extensively increase by orders of magnitude with “Parametrised transclusions” and more.

If you do find;

@Justin_H

two unused symbol characters

Do share them here - In custom markup it was necessary to go to unicode characters with supporting editor tool bar buttons to support their entry.

Enjoy

[Justin_H]

@TW_Tones

In the near future this is going to change and the extensively increase by orders of magnitude with “Parametrised transclusions” and more.

hm, could you elaborate on this? I’m still learning the names for various things in TiddlyWiki, and Parametrised transclusions isn’t something I’m familiar with.

@TW_Tones

Do share them here

I chose to use 2 ampersand(&) symbols because a combination of the two wasn’t something I’ve seen in usage in TiddlyWiki already. Hopefully I don’t break anything though

[TW_Tones]

Yes I cant see it used for now if && is used but I have some faded memory.

“Parametrised transclusions” are currently in GitHub and has other related issues/discussions and pull requests

If you look at Hidden Setting: Search Minimum Length you can reduce it to 2 thus find $$ @@ and not find &&

If we found a reliable extra symbol it would make since to use it in a specific way.

• Double characters are a compromise as you have used.
• See my example above with the “.m” this can be placed after various wikitext symbols however there is no line or span wikitext symbol that does not already have a function.
• If we had an additional wikitext character like & it would be good if it did nothing but allow the application of a class as per my .m example eg
  • This text &.m is highlighted here
  • But then this would typically be used at the beginning of the line and be valid until the end of the line or \n
  • This highlights the need to have line, block and inline markup.

Many of these issues have being considered in the custom markup by @pmario

[TW_Tones]

I should mention

<style>
.m {
  background-color: yellow;
  color: black;
}
</style>

This is some text @@.m with marked text@@ currently works out of the box.

[Justin_H]

@TW_Tones

<style>
.m {
  background-color: yellow;
  color: black;
}
</style>

This is some text @@.m with marked text@@ currently works out of the box.

This, and just <mark>text</mark> were the two methods I was using the most, prior to looking into making my own wikitext, funnily enough.

[fastfreddy]

Another project which may be of interest for inspiration: My 'playground' — a demo TiddlyWiki (TW v5.1.22) and My 'playground' — a demo TiddlyWiki (TW v5.1.22)

[pmario]

@Justin_H

and replaced /\/\//mg; with /&&/mg; inside the tiddler, allowing me to add highlighting using the following: &&Highlighted Text&&

hihi, .. The comment in your js file says you wanted to use !! as the delimiters … Which probably “crashed” with the !! heading usage

That’s one of the problems with “custom markup”. Finding new “start / end markers”, that can be used without clashing with existing syntax. …

Or without clashing with symbols that can be part of user content. Eg: §§ is a valid term in legal texts. … So it can’t be used as a custom marker ..

We had long discussions about the different possibilities. Especially “nesting” different markers is challenging.

The custom-markup plugin should give users the possibility to define an unlimited number of “start and end” markers using wikitext. For that reason I had to define some sensible defaults for those markers.

[Justin_H]

@pmario

hihi, … The comment in your js file says you wanted to use !! as the delimiters … Which probably “crashed” with the !! heading usage

That it did haha s’ the reason i swapped to &&.

i’ll have to consider using section symbols (§) for future projects, I used to use them when working with mods for a game I played, and remember a mild frustration of not having a key with it on it, but with TW I can get around that by creating my own shortcut.

@pmario

We had long discussions about the different possibilities. Especially “nesting” different markers is challenging.

Was mixing symbols discussed? something along the lines of ?!text!?, for example? I’m curious of the responses to something like that.

@pmario

The custom-markup plugin should give users the possibility to define an unlimited number of “start and end” markers using wikitext. For that reason I had to define some sensible defaults for those markers.

It does look very capable, but I’ve still got a ways before I can use it on reflex, and not have to look up the elements .

[pmario]

@Justin_H

Was mixing symbols discussed? something along the lines of ?!text!?, for example? I’m curious of the responses to something like that.

The problem is that a combination like this can be used in standard text to indicate confusion ?! … So the writer isn’t sure what’s going on.

@Justin_H

It does look very capable, but I’ve still got a ways before I can use it on reflex, and not have to look up the elements .

It’s actually more complex than that. .. It is already possible that users define their own domain specific language (DSL). Which needs its own documentation. Because if that docs is missing you need to look up both – your own DSL and the plugin rules.

The edition has a lot of test-xxx example tiddlers and probably all of them need to be converted to documentation.

[TiddlyTitch]

@pmario

look up both – your own DSL and the plugin rules.

Right. It just goes with the territory to do that.

I would say documentation is important—but that can get complex if you parse in some complex way.

A comment, TT

[TiddlyTitch]

@pmario

define their own domain specific language (DSL).

I think your Custom Markup is one of the most interesting tools in TW!

!! — I wish it was more widely used — !!

It is a generic approach that enables a user to do most anything in markup.

TT

[twMat]

As pmario notes, using !! ... !!is probably a bad idea since it conflicts with the wikitext for <h2>

With that said, I posted this request long ago, which I still think is a good idea:

@@background:yellow; content@@ works but there is no default option without parameters.

I propose @@content@@ as a quick way to get the typical faint(!) yellow background on the content.

A main point is that the already existing @@marker is appropriate exactly because it deals with applying styles. So there should be a “default”, and I think highlighting is an excellent use of this to enhance basic wikitext formatting.

Please chime in there if you agree.

[pmario]

@twMat

With that said, I posted this request long ago, which I still think is a good idea:

I think, it’s still valid and the issue is actionable. So I did bump the issue at GH

[pmario]

@Justin_H … Have a closer look at: <mark>: The Mark Text element - HTML | MDN

especially:

• Don’t use <mark> for syntax highlighting purposes; instead, use the <span> element with appropriate CSS applied to it.

So the @@styled inline element@@ would be the better choice. … I’m preparing a PR at the moment, so it will get a default CSS setting that will have a yellow background