Alrighty, after some tinkering, here's what I've finally come up with: !!<span style="font-weight: bold; color: #FF0000;">Some Descriptive Title or Text of Your Choosing</span> <hr> <$linkcatcher to="$:/themes/tiddlywiki/vanilla/settings/backgroundimage"> <div style="border: 2px solid silver; border-radius: 10px; height: 355px; overflow: auto;"><$list filter="[tag[Background]sort[title]]"> <$macrocall $name="linkimg" tiddler=<<currentTiddler>> image=<<currentTiddler>> tooltip=<<currentTiddler>> width="115"/> </$list> </div> <hr> <$link to=""> <$button>Blank Background</$button> </$link> </$linkcatcher>
For any new*(er and less experienced than myself)* TW users, here's a general breakdown of how to incorporate it into your own TiddlyWiki, and how it actually works: 1. Create a tiddler for your background image. As per the excellent instructions provided by *Birthe C* (Thank You again, kind Sir :) ) - (If using my example verbatim, also tag the tiddler with "*Background* ") - Select "*JPEG image (image/jpeg)*" as the type. - Create the field "*_canonical_uri*" and put your external link URL in this field. - Save the tiddler. - Now you are able to select your image in *$:/ControlPanel/Theme Tweaks - Page background image* and it will also be available to my added SideBar section. 2. Install Tobias Beer's Link Images Macro <http://tobibeer.github.io/tb5/#Link%20Images>. Very fine creation, and performs most nicely :) 3. Reload your TW for the macro to be recognized and initialized. 4. Create the Background Chooser *(for want of a more creative name :Þ)* - Create a tiddler and name it as you will. - *(If you want it to also appear in the SideBar, tag it with "$:/tags/SideBar")* - Paste the code from the code box above into it. - Save the tiddler. Now, any background image that is linked to from the _canonical_uri field of a tiddler like the one above should appear within the Background Chooser :) Here is my explanation of what is going on with this *(please forgive me if I get some terms wrong or don't explain the concepts correctly - and feel free to add to or correct it :) )*: !!<span style="font-weight: bold; color: #FF0000;">Some Descriptive Title or Text of Your Choosing</span> <hr> This is just a descriptive title for the SideBar section that I wanted to add, with a horizontal rule below it - Feel free to edit or remove it, as per your wishes. This next part begins some edited code that I borrowed from the Hello There Tiddler <http://tiddlywiki.com/#HelloThere> on the main TiddlyWiki.com page: <$linkcatcher to="$:/themes/tiddlywiki/vanilla/settings/backgroundimage"> First, the LinkCatcherWidget <http://tiddlywiki.com/#LinkCatcherWidget> is called and will (eventually) pass the outcome of all the other work being done here to *$:/themes/tiddlywiki/vanilla/settings/backgroundimage*, which is the tiddler responsible for displaying the background of the TW. <div style="border: 2px solid silver; border-radius: 10px; height: 355px; overflow: auto;"> Next, we're creating an auto-scrolling div that's 355 pixels high (the height of three rows of background images, whose widths are set at 115 pixels by the linking macro) (this works out just right for me on a 1920 x 1024 display, with my SideBar resized to 435 pixels wide - You'll have to adjust the numbers to obtain the 'perfect' layout for your screen resolution and TW), and has a 2-pixel solid silver border, with a rounded ratio of 10 pixels. <$list filter="[tag[Background]sort[title]]"> This creates a list of all the tiddlers which have the tag of "*Background*", and sorts them alphabetically by their titles. <$macrocall $name="linkimg" tiddler=<<currentTiddler>> image=< <currentTiddler>> tooltip=<<currentTiddler>> width="115"/> This calls the linkimg macro which grabs the contents of the current tiddler (which is the output of the list from above), resizes each of the backgrounds to a width of 115 pixels, and displays them. </$list> Close the $list. </div> Close the div. <hr> Just another horizontal rule to separate the button below from the above section (keep or delete at your discretion). <$link to=""> <$button>Blank Background</$button> </$link> This button, when clicked, sends a null value ("") back to *$:/themes/tiddlywiki/vanilla/settings/backgroundimage*, thereby clearing or blanking the background. </$linkcatcher> Finally, the LinkCatcherWidget passes the value of our selected background image to $:/themes/tiddlywiki/vanilla/settings/backgroundimage and completes the process :) NB: I prefixed the titles of the tiddlers containing my background images with "*$:/BG_*" so that 1) they would not appear in and clutter up the Recent File list of the SideBar and; 2) so that they are easy to find/edit from the Advanced Search. Please don't ask me too many questions, as I *just barely* grasp what's being done - Tons of trial-and-error and copy/pasting went into this, but I believe I did learn a little from the experience, and hopefully can carry some of that knowledge forward :) -- 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 https://groups.google.com/group/tiddlywiki. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/4f065da1-ebf2-4198-8fed-683f7a1c46c6%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
