example.qmd

---
title: "Unsplash Example"
---

## One Time Unsplash

The following image will not be persisted on disk and will exist only in the rendered output (it will be refreshed every render):

{{< unsplash >}}

## Persisted Unsplash

{{< unsplash images/edgartown.jpg height=250px width=300px float=right >}}

The following image will be stored in an `images` folder adjacent to the document containing the shortcode. The filename will be used to determine if the image has already been downloaded. If the image has already been downloaded, it will not be downloaded again.

In addition, the filename is used as a keyword hint when finding a random image (.e.g a file named `cat.jpeg` will provide an image which matches the keyword `cat`).

## Keyword splash

You can also explicitly provide keywords which will be used for a transient unsplash image, or will override the filename keyword hint.

{{< unsplash keywords="vineyard,lighthouse" class=column-screen-inset-shaded >}}

## Complete Splash

You can provide an image size, which will be used both to request a suitable image, and also to size the image in the rendered output. In addition, note that a class is being provided which floats the image in the margin (`column-margin`).

{{< unsplash images/tisbury.jpg keywords=tiny height=200px width=200px  class="column-margin" >}}