mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2024-11-02 16:16:18 +00:00
48 lines
1.8 KiB
Plaintext
48 lines
1.8 KiB
Plaintext
caption: Images
|
|
created: 20131205160221762
|
|
fr-title: Les images dans WikiText
|
|
modified: 20150601074111435
|
|
tags: WikiText [[Working with TiddlyWiki]]
|
|
title: Images in WikiText
|
|
type: text/vnd.tiddlywiki
|
|
|
|
! Intégration d'image
|
|
|
|
Les images peuvent être affichées avec WikiText avec la syntaxe suivante, selon que l'image soit déjà incluse dans un tiddler ou pointe vers une source externe :
|
|
|
|
```
|
|
[img[Sainte Anastasie.png]]
|
|
ou [img[https://tiddlywiki.com/favicon.ico]]
|
|
```
|
|
|
|
[img[Sainte Anastasie.png]]
|
|
ou [img[https://tiddlywiki.com/favicon.ico]]
|
|
|
|
Si la source de l'image correspond au titre d'un tiddler, alors le tiddler est affiché directement. Autrement elle est interprétée comme une URL et la balise HTML `<img>` est générée muni de l'attribut `src` contenant l'URL.
|
|
|
|
Une info-bulle, visible au survol par la souris, peut être spécifiée, ainsi que les attributs `width` (largeur), `height` (hauteur) et la `class` :
|
|
|
|
```
|
|
[img width=80 class="tc-image" [Sculpture époque médiévale - France - Gard - Sainte Anastasie|Sainte Anastasie.png]]
|
|
```
|
|
[img width=80 class="tc-image" [Sculpture époque médiévale - France - Gard - Sainte Anastasie|Sainte Anastasie.png]]
|
|
|
|
Noter aussi que les attributs peuvent être spécifiés par des transclusions ou des références à des variables:
|
|
|
|
```
|
|
[img width={{!!mywidth}} class=<<image-classes>> [Sainte Anastasie.png]]
|
|
```
|
|
|
|
> La syntaxe d'image est un raccourci d'appel à la fonctionnalité ImageWidget.
|
|
|
|
! Affichage des images par transclusion
|
|
|
|
Vous pouvez aussi afficher l'image incluse dans un tiddler en transcluant ce tiddler. L'inconvénient de cette méthode est qu'il n'y a alors pas de moyen directe pour contrôler la taille de l'image.
|
|
|
|
```
|
|
{{Sainte Anastasie.png}}
|
|
```
|
|
|
|
Affichera :
|
|
|
|
{{Sainte Anastasie.png}} |