lorem-unsplash ~ image aléatoire

Pour insérer des images factices dans vos maquettes de site

🆙 lorem_unsplash : affiche une image aleatoire

Cliquer pour lire la documentation

Syntaxe : {up lorem-unsplash=#image | width=xx | height=xx }
rechercher n° image sur https://picsum.photos/images
@author: Lomart @version: UP-1.5 @license: GNU/GPLv3 @tags: Editor
  • lorem_unsplash: n° de l'image sur https://picsum.photos/images
  • height (h,hauteur) = 200: hauteur image téléchargée
  • width (l,largeur,w) = 200: largeur image téléchargée
  • random: force la récupération aléatoire
  • grayscale: pour rendu en niveaux de gris
  • blur: rendu flou
  • gravity: recadrage : north, east, south, west, center

Style CSS

  • id: identifiant
  • class: classe(s) (obsolète)
  • style: classes et styles

Version minimale

{up lorem-unsplash}

Une image de 200x200px est affichée

width & height est la taille demandée en pixels

{up lorem-unsplash | width=800 | height=150 | style=width:50%; border:2px dotted red}

Ici, on récupère une image de 150x800px qui sera affichée à 50% de la largeur du bloc parent.

Choisir l'image et la recadrer

Il est possible de choisir l'image à utiliser sur le site : picsum.photos

On indique le numéro de la photo comme argument principal du shortcode. Il peut être de fournir une indication pour le recadrage à l'aide de l'option gravity

{up lorem-unsplash=0 | width=100 | height=200 | gravity=east}
par défaut
gravity=north
gravity=east
gravity=south
gravity=west
gravity=center

Avec des options

Niveau de gris

{up lorem-unsplash | grayscale}

flou

{up lorem-unsplash | blur}

aléatoire

{up lorem-unsplash | random}

force le chargement d'une nouvelle image lors d'un rafraichissement de la page

Cette action nécessite de qu'Internet soit disponible sur votre poste.

Pour info, cette page utilise 13 action(s) :
upactionslist (1) lorem-unsplash (11) jcontent-info (1)
Détails