Afficher une image cliquable

[ElArbi]

Bonjour je souhaiterais afficher une image (png par exemple) avec un
lien du genre href i.e. quand on click dessus on est renvoyer vers un
site comme : http://groups.google.com/group/tiddlywikif.

[Sylvain Comte]

Bonjour,

normalement, la syntaxe est la suivante :

[img[adresse du fichier image][lien vers la destination]]


cordialement,

Sylvain

sur Sylvain Fruits Mixés dernièrement : Quiz spécial "parlez-vous le geek ?"

2011/2/7 ElArbi <abous...@gmail.com>

Bonjour je souhaiterais afficher une image (png par exemple) avec un
lien du genre href i.e. quand on click dessus on est renvoyer vers un
site comme : http://groups.google.com/group/tiddlywikif.

--
Vous recevez ce message, car vous êtes abonné au groupe Google Groupes TiddlyWikiFR.
Pour envoyer un message à ce groupe, adressez un e-mail à tiddly...@googlegroups.com.
Pour vous désabonner de ce groupe, envoyez un e-mail à l'adresse tiddlywikifr...@googlegroups.com.
Pour plus d'options, consultez la page de ce groupe : http://groups.google.com/group/tiddlywikifr?hl=fr

[El Arbi Aboussoror]

Ca marche sauf que quand je veux justifier l'image à droite elle est dupliquée à gauche aussi !

J'ai appliquer la méthode décrite ici:
http://tiddlywiki.org/wiki/How_do_I_right-justify_some_text_in_a_tiddler%3F

J'ai donc un tiddler styleSheet avec:
.justifyright {
 text-align: right;
}

et puis dans mon title tiddler j'ai mis:
{{justifyright{
[img[irit.png][http://www.irit.fr]]
}}}

le empty.html est en pj.

2011/2/7 Sylvain Comte <sylvai...@gmail.com>

--
El Arbi Aboussoror

[Sylvain Comte]

as-tu essayé?
[>img[irit.png][http://www.irit.fr]]
qui ajoute float:right à ton image. Ce n'est pas justifié, mais ça va la coller à droite...

Sylvain

sur Sylvain Fruits Mixés dernièrement : Quiz spécial "parlez-vous le geek ?"

2011/2/7 El Arbi Aboussoror <abous...@gmail.com>

[El Arbi Aboussoror]

Même résultat: ca m'affiche 2 fois l'image, une à droite et une à gauche !?

2011/2/7 Sylvain Comte <sylvai...@gmail.com>

--
El Arbi Aboussoror

[Sylvain Comte]

au temps pour moi, je n'avais pas vu que tu bricolais le SiteTitle. Le problème c'est que la mise en page par défaut utilise deux fois SiteTitle, une fois dans un "headerForeground" et une fois dans un "headerBackground" ou un truc comme ça pour faire une ombre au titre.
C'est un truc qui m'énerve dans le empty.html par défaut.

En première approche, tu peux remplacer le tiddler PageTemplate par ça
<!--{{{-->
<div class='header' macro='gradient vert [[ColorPalette::PrimaryLight]] [[ColorPalette::PrimaryMid]]'>
<span class='siteTitle' refresh='content' tiddler='SiteTitle'></span>&nbsp;
<span class='siteSubtitle' refresh='content' tiddler='SiteSubtitle'></span>
</div>
<div id='mainMenu' refresh='content' tiddler='MainMenu'></div>
<div id='sidebar'>
<div id='sidebarOptions' refresh='content' tiddler='SideBarOptions'></div>
<div id='sidebarTabs' refresh='content' force='true' tiddler='SideBarTabs'></div>
</div>
<div id='displayArea'>
<div id='messageArea'></div>
<div id='tiddlerDisplay'></div>
</div>
<!--}}}-->

Après, il faudra sans doute bricoler un peu ta styleSheet pour ajouter des marges ou diminuer la taille du header, mais c'est l'idée.
Tu peux peut-être aussi utiliser la propriété background-image dans ta styleSheet pour la class .header auquel cas tu n'as pas à toucher pageTemplate

Sylvain

[ocalTW]

Bonsoir

La solution que j'utilise est moins intrusive et reprend l'une des
réponses à une question postée sur le groupe TiddlyWiki en anglais [1]

Dans le StyleSheet ajouter les 3 lignes suivantes :
.headerShadow .right { position: absolute; top: 0; }
.headerShadow .right { right: 0; }
.headerForeground .right { display: none; }

Dans le SiteTitle ajouter
{{right{[img[irit.png]]}}}

Un petit truc à savoir : dans le cas où l'on met 2 {{right{...}}} avec
des images différentes, les 2 images se superposent.

[1]
http://groups.google.com/group/TiddlyWiki/browse_thread/thread/d9a41654767378a1/104d8a74bfbe8dd2?lnk=gst&q=sitetitle+image#104d8a74bfbe8dd2

-- ocalTW

> *Sylvain*
>
> 2011/2/7 El Arbi Aboussoror <abousso...@gmail.com>

>
> > Même résultat: ca m'affiche 2 fois l'image, une à droite et une à gauche !?
>

> > 2011/2/7 Sylvain Comte <sylvain.co...@gmail.com>

>
> >> as-tu essayé?
> >> [>img[irit.png][http://www.irit.fr]]
> >> qui ajoute float:right à ton image. Ce n'est pas justifié, mais ça va la
> >> coller à droite...
>

> >> Sylvainsur Sylvain Fruits Mixés<http://feedproxy.google.com/SylvainFruitsMixes>dernièrement : Quiz
> >> spécial "parlez-vous le geek ?"<http://feedproxy.google.com/%7Er/SylvainFruitsMixes/%7E3/qGnpRMR9R1s/...>
> >> 2011/2/7 El Arbi Aboussoror <abousso...@gmail.com>

>
> >>> Ca marche sauf que quand je veux justifier l'image à droite elle est
> >>> dupliquée à gauche aussi !
>
> >>> J'ai appliquer la méthode décrite ici:
>

> >>>http://tiddlywiki.org/wiki/How_do_I_right-justify_some_text_in_a_tidd...

>
> >>> J'ai donc un tiddler styleSheet avec:
> >>> .justifyright {
> >>>  text-align: right;
> >>> }
>
> >>> et puis dans mon title tiddler j'ai mis:
> >>> {{justifyright{
> >>> [img[irit.png][http://www.irit.fr]]
> >>> }}}
>
> >>> le empty.html est en pj.
>

> >>> 2011/2/7 Sylvain Comte <sylvain.co...@gmail.com>

>
> >>>>  Bonjour,
>
> >>>> normalement, la syntaxe est la suivante :
>
> >>>> [img[adresse du fichier image][lien vers la destination]]
>
> >>>> cordialement,
>

> >>>> Sylvainsur Sylvain Fruits Mixés<http://feedproxy.google.com/SylvainFruitsMixes>dernièrement : Quiz
> >>>> spécial "parlez-vous le geek ?"<http://feedproxy.google.com/%7Er/SylvainFruitsMixes/%7E3/qGnpRMR9R1s/...>
>
> >>>> 2011/2/7 ElArbi <abousso...@gmail.com>