Insertion d'images


{{attach file="ma_photo.jpg" desc="ma_description"...}}


image photo3.jpg (34.3kB)
image photo2.jpg (12.3kB)
image photo1.jpg (0.1MB)
image photo2.jpg (12.3kB)



Alignement des images par rapport au texte

Dans les exemples suivants, l'image est insérée au début du paragraphe de texte.

Image à gauche

Ajouter le paramètre class="left"
par exemple
{{attach file="photo3.jpg" desc="image photo3.jpg (34.3kB)" size="medium" class="left"}}
donne
image photo3.jpg (34.3kB)
"Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur?

Image à droite

Ajouter le paramètre class="right"
par exemple
{{attach file="photo3.jpg" desc="image photo3.jpg (34.3kB)" size="medium" class="right"}}
donne
image photo3.jpg (34.3kB)
"Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur?

Image centrée

Ajouter le paramètre class="center"
par exemple
{{attach file="photo3.jpg" desc="image photo3.jpg (34.3kB)" size="medium" class="center"}}
donne
image photo3.jpg (34.3kB)
"Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur?

Une image, différentes tailles d'affichage

Ajouter le paramètre size="small"
par exemple
{{attach file="photo3.jpg" desc="image photo3.jpg (34.3kB)" size="small" class="center" caption="taille small"}}

donne
image photo3.jpg (34.3kB)
taille small
Ajouter le paramètre size="Medium"
par exemple
{{attach file="photo3.jpg" desc="image photo3.jpg (34.3kB)" size="medium" class="center" caption="taille medium"}}

donne
image photo3.jpg (34.3kB)
taille medium
Ajouter le paramètre size="Big"
par exemple
{{attach file="photo3.jpg" desc="image photo3.jpg (34.3kB)" size="big" class="center" caption="taille big"}}

donne
image photo3.jpg (34.3kB)
taille big
Ajouter le paramètre size="Original"
par exemple
{{attach file="photo3.jpg" desc="image photo3.jpg (34.3kB)" size="original" class="center" caption="taille original"}}

donne
image photo3.jpg (34.3kB)
taille original

Affichage d'une légende

Ajouter le paramètre legend="..."
par exemple
{{attach file="ExempleColonnes_photo3.jpg" desc="image ExempleColonnes_image2.jpg (0.3MB)" size="medium" class="left" legend="le texte de la légende"}}

donne
image ExempleColonnes_image2.jpg (0.3MB)
le texte de la légende



Différents effets

(passez votre cuseur sur les images pour tester)

image ExempleColonnes_image2.jpg (0.3MB)
Bord blanc = class=whiteborder

image ExempleColonnes_photo3.jpg (34.3kB)
Ombre portée = class=lightshadow

image ExempleColonnes_photo3.jpg (34.3kB)
Agrandissement au survol = class=zoom