黒雪姫 ```
<$wikify name="myExampleDataURI" text="""<<datauri "myExample">>""" >
<iframe src="myExampleDataURI" sandbox="allow-scripts">
</$wikify>
```
Used triple quotes, because you used the macro with double quotes, even if single ones would be fine.
黒雪姫 This is mostly needed because you cannot "double render macro" unless it is used inside WikiText markup. The Wikify widget is filling that gap.
黒雪姫 TiddlyWiki is truly the best tool and especially interactive tutorials! Seeing you speak like that also makes me feel excited! So I am very happy that this works! I wish everything to be breeze now for you! Tutorials are really important! I am so glad that TiddlyWiki makes them much easier to make and contain.
黒雪姫 I think it is done exactly how you expect. So by using ** at the start. Make sure there is a new line before starting any WikiText (otherwise it gets interpretted literally due to missing p tag). Also make sure there are no spaces at the front. I don't know if this answers the question because I don't fully understand it. I hope you can find more information in these 2 tiddlers here: https://tiddlywiki.com/#Lists%20in%20WikiText:%5B%5BLists%20in%20WikiText%5D%5D%20Transclusion%20TranscludeWidget
黒雪姫 Ah, sorry. I re-read the question 10 times more and realized I was wrong. I think you can simply use the CodeBlockWidget <$codeblock> and nest it in a list pretty okay. Example:
* To do today
*# Eat
* To get someone else to do
*# This
*# That
*## <$codeblock code={{$:/editions/tw5.com/macro-examples/say-hi}} />
*# Do some moreLink for CodeBlockWidget for more information: https://tiddlywiki.com/#CodeBlockWidget
javascript. that gets displayed as is. I assume there isn't a way around it, is it? because I want syntax highlighting in the tiddler as well
黒雪姫 Make sure you have installed this plugin or else it won't work.
Highlight.js: syntax highlighting
$:/plugins/tiddlywiki/highlight
ok, I need to explain better what I mean. I will use your code for the example.
I have a tiddler called "Get Active Users". the contents of the tiddler are
SELECT * FROM users WHERE deleted = falseThe above code snippet starts with 3 tildes followed by sql.
I want to keep it that way, because this gives me syntax highlighting when I look at the tiddler by itself.
of course, this means that when I include it with <$codeblock code={{Get Active Users}} language="sql", the part with ```sql``` is also included.
it's not such a big deal. I'm just curious if there's a solution for it.
黒雪姫 then in that case, all you need to do is to transclude it with block mode
黒雪姫 Sorry, I will use pictures to make it easier. https://i.imgur.com/k4GYrKE.png This is what I got. This is the code: https://i.imgur.com/JF59MyF.png
<ul>
<li>To do today</li>
<li>
<ol>
<li>Eat</li>
</ol>
</li>
<li>To get someone else to do</li>
<li>
<ol>
<li>This</li>
<li>That</li>
<li>
<ol>
<li><$transclude tiddler="Test1" mode="inline"/></li>
</ol>
</li>
<li>Do some more</li>
</ol>
</li>
</ul>黒雪姫 I didn't have syntah highlight because I was missing the plugin. Installed here: https://i.imgur.com/FeZCmhW.png
黒雪姫 I also find it easier with HTML, it makes working with widgets more natural.
黒雪姫 Also I think you shouldn't include the WikiText for code block inside your code tiddlers, if you want them to have a syntax highlighting in there. It kinda defeats the transclusion capabilities because it "pollutes" the code and you will ideally want the code to be inside a tiddler so that you can re-use it. As it goes with the Philosophy of tiddlers. So if you want highlight, I think the "more TiddlyWiki way" is to build your own custom view template and hide the default body. I made a really quick (and hopefully "simple" enough) to implement for your own needs.
How it looks like: https://i.imgur.com/mP05F5U.png
This is how the underlaying code and tiddlers look like: https://i.imgur.com/HxSveUw.png
Here is a download link to the json file that bundles the same tiddlers, which you can easily import to play with or test at https://tiddlywiki.com/plugins/tiddlywiki/highlight/
Json Tiddlers Example Bundle (sorryed used a slow site): https://transfer.sh/eaj7y/tiddlers.json
Disclaimer: I know this can be further improved and made easier to extend by wrapping the code in macros and using list widgets to automatically generate different language tags and their appropriate language code and I would do that, but that would further complicate the matters, so I left this out to make it as easy as possible to understand what's going on. I do highly recommend macros and widgets to be used instead of manual copy/pasting and remembering where the template is and how to edit it. That said, I also included 2 examples so that it is clear how can it be extended, with out without Macros.
and a question regarding the philosophy. I want to create a tiddler for each piece of syntax from a programming language. for example "Import module".
but, tiddler names are unique and I want to do this for several programming languages.
does it make sense to put the language name in the tiddler name "Haskell: Import module" or should I use a different approach?
黒雪姫 The Philosophy of Tiddlers is just this: https://tiddlywiki.com/#Philosophy%20of%20Tiddlers
After all, there aren't really more "philosophies" and everything is in your control to your needs and decisions. Basically, what I said is just one of many other possible ways that you may like more. If your information isn't to be re-used, using the Code Blocks in WikiText is just fine. In my opinion the most work you'll have to do in TiddlyWiki is to design it to your needs and what you would like to do. After all, you can always excise text into tiddlers.
Also yes, it does make sense if you put the language in the tiddler name "Haskell:" after all, they must be unique. You can even select these by using "[prefix[Haskell:]]" filter and maybe not even use a tag. The possibilities are endless pretty much. However, you have to think which way is easiest for you and you like it the most.
The StyleSheet tiddler is a tiddler with a random name that I gave it. The important thing in it is the special tag that it has $:/tags/Stylesheet this is treated by TiddlyWiki to inject the content of that tiddler in the CSS space (even if that tiddler is not currently rendered).
Basically it allows me to add CSS globally. Thanks to that $:/tags/Stylesheet tag.
黒雪姫 I found a mistake in my "StyleSheet" tiddler. Basically the "<style>" tag isn't needed if it has the stylesheet tag. Here I fixed this and added "support" how it would look like if you used "Haskell:"
Fixed stylesheet tiddler + added support for "Haskell: " https://i.imgur.com/DVFDE4D.png
This is how it looks: https://i.imgur.com/EXFY8dW.png
You can see that in the Haskell example, I didn't even use tags. So really, this is just to adopt your own set of conventions based from what TiddlyWiki provides. Customize and design things so that you like them! That's it. There isn't really the "best way", only the way you want. Just be aware of the other possibilities, that's all.
黒雪姫 Brief description of the StyleSheet tiddler. Just in case. Basically it is CSS code. It uses basic CSS to target specific html elements from TiddlyWiki to apply my own style to them. For example what I wanted to do with that is to hide the main body. That's what the Stylesheet does. It hides the default text body that gets rendered. This is because I use a view template to show it rendered through the code widget. So I need this to hide the default text or else it will appear twice.
Other than knowing how the html structure is and writing the CSS rule there isn't anything interesting. I know that tiddlers have a data-tags attribute and I know that CSS has attribute selector plus this is also explained here: https://tiddlywiki.com/#How%20to%20apply%20custom%20styles
Probably the more interesting is the one that I just added. It uses TiddlyWiki list widget, which is really powerful to dynamically generate CSS code. Basically it takes all Haskell: tiddlers and has them already with rules. I typically use escapecss so I need an inline filter because I wanted to add escapecss[] to help with weird titles. So I use the "safe for CSS" title of a tiddler and another attribute that I know that tidders have in their HTML structure and CSS attribute selector to add the style I want, which is to hide the body text.
黒雪姫 Mistake I did: if you have a tiddler that's tagged with $:/tags/Stylesheet you don't need to use <style> html tag
黒雪姫 Plus it also allows you to use WikiText power to generate CSS rules
黒雪姫 Bonus: If I wanted to add more programming languages I have to only edit filter="[prefix[Haskell: ]]" to filter="[prefix[Haskell: ]] [prefix[Javascript: ]]" This makes 2 independed filters combined together.
黒雪姫 However, I also have to add Javascript into the View Template
黒雪姫 There are more ways than one.
黒雪姫 tl;dr version: If you don't plan to reuse code fragments. Feel free to use WikiText for code blocks. If you do plan on reusing code fragments and that also depends where (if linebreaks are allowed or not) you may have to decide if you are okay with having the WikiText for code block part of the code tiddler or not. Again depends on the usage and needs
"TiddlyWiki aspires to provide an algebra for tiddlers, a concise way of expressing and exploring the relationships between items of information. "
黒雪姫 Exactly! I like this quote too. Sadly, I can recommend you to learn things incrementially. In fact, even I learn more and more things just from stumbling across them on the site. Reminds me of those times when you look up for something in the vim help and you discover some other feature. I guess TiddlyWiki can really be compared as the "emacs" of "note-taking apps" (TiddlyWiki is something much more than that!)
As far as learning goes. Filters create lists of tiddlers, so play with them at the $:/AdvancedSearch Filter tab or inside $list widget. I think you should first learn $list widget because it is really powerful and macros are nothing but to substitute text (alternative to copy/pasting but with basic parameters) macros aren't anything fancy. Widgets and how to use them is the main power of TiddlyWiki and to chain widgets with HTML tags to get what you want. Also to know how transclusion works. I think these are one of the first things and there is still a lot to them. I also think that the non-linear nature of tiddlywiki helps a little, because there is just a lot to learn. So tackle a little and slowly over time.
My best advice to learning more is just viewing examples and other TiddlyWikis and dissect them to see how other people accomplished something and then read the documentation about it on tiddlywiki.com
The TiddlyWiki toolchain on dynalist has a lot of plugins and example wikis which may be of help too!
黒雪姫 I believe that with all that power and flexibility, it is really important to think of a main structure of your notes and go on from there. I think this is hinted at this Tiddler over here: https://tiddlywiki.com/#Adopt%20a%20Titles%20Policy
One of my initial problems that I had when I was a beginner (coming from note-taking applications) is the fact that there were no folders or something to navigate to. This helped me to realize that I actually don't need that and in reality I need a stable structure instead and policy how to give titles. I can get lost notes by using the search and the rest from my structure. Now that I have familiarity with TiddlyWiki I even bring this further by creating home tiddlers which have custom search fields that are like master repositories of my structure simply because I like it that way and no other reason!
黒雪姫 I also start with manual links and if I can <<list-links "...">> macro. In fact that one is probably my favorite macro because it is so easy to get a quick list, the second one would probably be the tabs <<tabs "[[My Filter]] [[or simple title list]]">>macro which have different basic tiddlers with lists in them. Capturing then organizing is very good to do! I think TiddlyWiki encourages that anyway, you are supposed to read and work with your tiddlers and edit later if needed. Capture first and organize later is something that I do, because at least for me to get it written down is most important. A personal notebook can be messy, what matters is to find it when you need it. Which isn't so hard, especially with Search.
Maybe learning more about filters first and start by using them in some simple built in macros like <<list-links "...">> and combine them with <<tabs "...">> could help you really feel the power of TiddlyWiki. I personality think that filter syntax is so flexible, but once you know how to use it. It can bring connections between your tiddlers and more dynamic things.