mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2025-08-11 00:03:48 +00:00
Code Issues Releases Wiki Activity

[DOCS] Improve External Images Docs

Browse Source
This commit is contained in:
Mario Pietsch 2025-02-17 16:49:06 +01:00
parent cd89415461
commit 0f9f7ffa43
1 changed files with 28 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
editions/tw5.com/tiddlers/concepts/ExternalImages.tid
View File

@ -1,5 +1,5 @@
created: 20140610213500000 created: 20140610213500000
modified: 20241030132047048 modified: 20250217154855572
tags: Concepts Features tags: Concepts Features
title: ExternalImages title: ExternalImages
type: text/vnd.tiddlywiki type: text/vnd.tiddlywiki
@ -23,22 +23,28 @@ To manually create an external image just create the tiddler with the appropriat
The following steps are used to create a static HTML file version of a wiki accompanied by an ''images'' folder containing the referenced external images: The following steps are used to create a static HTML file version of a wiki accompanied by an ''images'' folder containing the referenced external images:
# Create image tiddlers in your TiddlyWikiFolders in the usual way # Create image tiddlers in your TiddlyWikiFolders in the usual way
# Save the images as separate files (by convention, in a subfolder named ''images'') # Save the images as separate files (by convention, in a subfolder named ''/images'')
# Externalise the image tiddlers by giving them a ''_canonical_uri'' field # Externalise the image tiddlers by giving them a ''_canonical_uri'' field
# Save the main HTML file # Save the main HTML file
Note the image files must be saved before they are externalised. Externalising them destroys the ''text'' field within the in-memory copy of the wiki store, meaning that attempts to save them will fail. Note the image files must be saved before they are externalised. Externalising them destroys the ''text'' field within the in-memory copy of the wiki store, meaning that attempts to save them will fail.
For an example see the ''externalimages'' build target of the demo ''tw5.com'' wiki: !! External Image Configuration
For an example create an ''externalimages'' build target in a ''tiddlywiki.info'' file:
``` ```
--save [is[image]] images "build": {
--setfield [is[image]] _canonical_uri $:/core/templates/canonical-uri-external-image text/plain "externalimages": [
--setfield [is[image]] text "" text/plain --save [is[image]] images
--render $:/core/save/all externalimages.html text/plain --setfield [is[image]] _canonical_uri $:/core/templates/canonical-uri-external-image text/plain
--setfield [is[image]] text "" text/plain
--render $:/core/save/all externalimages.html text/plain
]
}
``` ```
!! Saving Separate Image Files !! Externalising Image Tiddlers
The following `--save` command (see [[SaveCommand]]) can be used to save the images of a wiki into an ''images'' subfolder: The following `--save` command (see [[SaveCommand]]) can be used to save the images of a wiki into an ''images'' subfolder:
@ -46,8 +52,6 @@ The following `--save` command (see [[SaveCommand]]) can be used to save the ima
--save [is[image]] images --save [is[image]] images
``` ```
!! Externalising Image Tiddlers
Two `--setfield` commands are used: the first sets the ''_canonical_uri'' field to a URI derived from the title of the tiddler, and the second clears the text field. Two `--setfield` commands are used: the first sets the ''_canonical_uri'' field to a URI derived from the title of the tiddler, and the second clears the text field.
``` ```
@ -65,6 +69,20 @@ The template tiddler [[$:/core/templates/canonical-uri-external-image]] contains
Note that these operations modify the tiddlers in the wiki store and so may affect the operation of subsequent commands. Note that these operations modify the tiddlers in the wiki store and so may affect the operation of subsequent commands.
!! Node.js Command to Build External Images
The following command will create external images in the `myWiki/output` folder.
```
tiddlywiki myWiki --build externalimages
```
On Windows the following command will create external images that are part of the [[tw5.com edition|https://github.com/TiddlyWiki/TiddlyWiki5/blob/master/editions/tw5.com/tiddlywiki.info#L26]]. The files will be created in the output directory.
```
tiddlywiki .\editions\tw5.com --build index
```
! Using External Images ! Using External Images
You can't edit an external image directly in the browser except by changing the URI field to point to a different image. You can't edit an external image directly in the browser except by changing the URI field to point to a different image.