Hi guys, I'm quite new to web development but I discovered TiddlyWiki 5 recently and found this amazing program to be the ideal mechanism to keep track of my personal data all in one place instead of the myriad of different programs (e.g. Excel, Todolist, OneNote, Word, etc.) I used before.
To that end, I've been customizing the UI and the CSS to my needs in the last few days. This has been a great learning experience so far but I seem to have hit a hurdle. It concerns adding images and vector icons to links (both internal and external) and I have two use cases to apply: 1. Manual on demand I would like to be able to flag individual links with any image/icon I want independently of their type (and for the image itself to be part of the link as well). For example: While for external links this is not really an issue for me, since I merely want a single image for all of them and can therefore modify the a.tw-tiddlylink-external class, I'm not so sure how to go about with internal ones that can vary on case by case basis as I don't know how to associated them with a custom class using WikiText. I tried to reconstruct them using normal HTML <a> tags such as in (with contact-icon being the icon CSS class): <a class='tw-tiddlylink contact-icon' href='#My Tiddler'>The link</a> <a class='tw-tiddlylink contact-icon' href='My Tiddler'>The link</a> <a class='tw-tiddlylink tw-tiddlylink-resolves contact-icon' href='#My Tiddler'>The link</a> <a class='tw-tiddlylink tw-tiddlylink-resolves contact-icon' href='My Tiddler'>The link</a> but the resulting links are not valid. I suspect this might have to do with the missing Javascript events that replace the href portion in TW5, but I'm not sure how to go about recreating them. 2. Automatically While having the case above would certainly be enough for my purposes, the ideal complement to it would be to set some of these automatically if I wanted. I have a series of special tags (with purple colour and a specific different icon each) that indicate the category of a tiddler (e.g. note, idea, definition, person, etc.). One tiddler only has one category tag at most. For instance: I would like for a resolved internal link to be able to: 1. Scan the target tiddler tags. 2. Retrieve the category tag by colour or less ideally by a static white list (there shouldn't be more than one, but if so, pick the first one). 3. Fetch the associated icon of the chosen category tag (these are vector graphics from font-awesome). 4. Apply it to the left of the link automatically when rendering without the need for the user to specify anything. I understand that this might be trickier to implement, so I'm definitely not too fuss about it (i.e. more than happy to set the icons by hand). Is this feasible? Thanks, Frederico Jeronimo -- You received this message because you are subscribed to the Google Groups "TiddlyWiki" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/tiddlywiki. For more options, visit https://groups.google.com/d/optout.
