VPS者

- Introduction: http://vpser.xyz/docs/getting-started/introduction/
- Create a Site: http://vpser.xyz/docs/getting-started/create-a-site/
- Configuration: http://vpser.xyz/docs/getting-started/configuration/
- Organisation: http://vpser.xyz/docs/content/organisation/
- Pages: http://vpser.xyz/docs/content/pages/
- Menus: http://vpser.xyz/docs/content/menus/
- Blog: http://vpser.xyz/docs/content/blog/
- Multi-Language: http://vpser.xyz/docs/content/multilingual/
- Shortcodes: http://vpser.xyz/docs/content/shortcodes/
- Asciinema: http://vpser.xyz/docs/content/shortcodes/asciinema/
- Buttons: http://vpser.xyz/docs/content/shortcodes/buttons/
- Columns: http://vpser.xyz/docs/content/shortcodes/columns/
- Details: http://vpser.xyz/docs/content/shortcodes/details/
- Images: http://vpser.xyz/docs/content/shortcodes/experimental/images/
- Hints: http://vpser.xyz/docs/content/shortcodes/hints/
- Mermaid: http://vpser.xyz/docs/content/shortcodes/mermaid/
- Steps: http://vpser.xyz/docs/content/shortcodes/steps/
- Tabs: http://vpser.xyz/docs/content/shortcodes/tabs/
- KaTeX: http://vpser.xyz/docs/content/shortcodes/katex/
- Styles: http://vpser.xyz/docs/customization/styles/
- Inject Partials: http://vpser.xyz/docs/customization/inject-partials/

# Images

Enhanced image display with click-to-expand behavior.

## Syntax

```tpl
{{</* image src="photo.jpg" alt="Description" title="Caption" loading="lazy" */>}}
```

## Example

{{< image src="placeholder.svg" alt="Placeholder image" title="Click to expand" loading="lazy" width="50%" >}}

## Parameters

`src`
: Path to the image. Supports page resources, site resources, and URLs.

`alt`
: Alternate text for accessibility.

`title`
: Caption displayed below the image.

`width`
: Set image width, height is calculated automatically

`loading`
: Loading strategy: `lazy`, `eager`, or `auto`.

`class`
: Additional CSS classes on the `<img>` element.