Thanks a lot for your help Eric, it's very much appreciated... I might come back later with more questions but for the time being there only one thing I'd like to understand: How does the filtering work here exactly ? I'd like to be able to arrange links the way I want.
<<list-links filter:"[tag[NavBar]!has[draft.of]sort[position]]">> Le vendredi 19 juin 2020 16:00:25 UTC+3, Eric Shulman a écrit : > > On Friday, June 19, 2020 at 5:19:56 AM UTC-7, dubtoms wrote: >> >> I'm new to TW and amazed by what you can do with it but I'm a bit >> overwhelmed by the documentation so I figured I would ask this silly >> question here : >> > > There are no "silly" questions... only silly answers! > > >> I want to add a basic menu bar similar to the one found on this wiki for >> example <https://tritarget.org/> to my own tw to make it more easy to >> navigate some categories for external viewers. >> I understand there are some plugins including "menu bar" which allow this >> and more but the example listed above does not seem to use any unless I am >> wrong. >> > > You are not wrong. The wiki example you cite (https://tritarget.org/) > uses the native HTML <nav>...</nav> syntax, so no TW plugins are needed. > > >> I tried creating a tiddler tagged with $:/tags/TopLeftBar and >> copy/paste some code found in the same exemple but it does not seem to work: >> >>> >>> <nav class="top-nav-bar tc-adjust-top-of-scroll"> >>> <<list-links filter:"[tag[NavBar]!has[draft.of]sort[position]]">> >>> </nav> >>> >> >> Am I missing something obvious? >> > > 1) In order to indicate which Tiddler links should appear, you need to go > to each of those tiddlers and add a tag, "NavBar". > > 2) You need to copy the following CSS and paste it into a tiddler tagged > with $:/tags/Stylesheet... > > 2a) To style the NavBar links so they appear horizontally on a blue > background: > .tc-topbar-left { top: 0; left: 0; width: 100%; background-color: #446e9b; > border-color: #345578; border-width: 0 0 1px; } > .tc-topbar-left ul { list-style: none; } > .tc-topbar-left li { display: inline; margin: 0; padding: 0 20px; } > .tc-topbar-left li a { color: #ddd; } > .tc-topbar-left li a:hover { color: #fff; } > (found at > https://tritarget.org/#%24%3A%2Fplugins%2Fsukima%2Ftritarget%2Fstyles) > > 2b) To set the height of the nav element: > .top-nav-bar { height: 40px; } > (found at https://tritarget.org/#%24%3A%2Fstyles%2Fsite) > > If you add the tags in step (1) and define the CSS in steps (2a) and (2b), > you should see the results you want. > > Let me know how it goes... > > enjoy, > -e > > -- 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 view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/ab5db2c8-b04d-4d7b-a7da-c65ca47e7189o%40googlegroups.com.
