# Shortcodes Documentation - danix.xyz
-The danix.xyz theme provides four essential shortcodes for extending and enhancing your content. All shortcodes support multilingual content through Hugo's i18n framework, ensuring seamless language switching across your site.
+The danix.xyz theme provides essential shortcodes for extending and enhancing your content. All shortcodes support multilingual content through Hugo's i18n framework, ensuring seamless language switching across your site.
## Gravatar
**Note:** Gallery content should be written in standard markdown image syntax ``. The shortcode automatically applies responsive grid styling, handles image sizing, and ensures accessibility.
+## Video
+
+Embed responsive HTML5 video player with support for WebM, MP4, and other web video formats. Videos can be stored in page bundles or served from external URLs.
+
+### Syntax
+
+```
+{{< video src="video.webm" width="100%" height="600" controls >}}
+```
+
+### Parameters
+
+| Parameter | Required | Description |
+|-----------|----------|-------------|
+| src | Yes | Path or URL to the video file (supports .webm, .mp4, .ogv) |
+| width | No | Video width (default: 100%, can be px or % values) |
+| height | No | Video height (default: auto) |
+| class | No | Custom CSS classes for styling |
+| autoplay | No | Set to "true" to autoplay (default: false) |
+| loop | No | Set to "true" for looping playback (default: false) |
+| muted | No | Set to "true" to mute by default (default: false) |
+
+### Example
+
+Basic usage with page bundle video:
+```
+{{< video src="demo.webm" >}}
+```
+
+With custom dimensions:
+```
+{{< video src="tutorial.webm" width="800" height="600" >}}
+```
+
+Autoplay and loop:
+```
+{{< video src="background.webm" width="100%" autoplay="true" loop="true" muted="true" >}}
+```
+
+External video URL:
+```
+{{< video src="https://example.com/video.mp4" width="100%" >}}
+```
+
+### Page Bundle Videos
+
+Videos stored in the same directory as your article's `index.md` are automatically resolved:
+
+```
+content/en/articles/my-article/
+├── index.md
+└── demo.webm ← Reference as src="demo.webm"
+```
+
+The template automatically generates the correct URL: `/articles/my-article/demo.webm`
+
+### Browser Compatibility
+
+- **WebM (.webm)**: Chrome, Firefox, Edge
+- **MP4 (.mp4)**: All modern browsers (H.264 codec)
+- **Ogg Theora (.ogv)**: Firefox, Chrome
+
## Contact Form
Embed a fully functional contact form with client-side validation, AJAX submission, and multilingual support. The form handles user submissions and displays loading states and error/success messages automatically.
?>
```
+## Quote
+
+Display blockquote with optional attribution. Perfect for testimonials, quotes, and highlighted text.
+
+### Syntax
+
+```
+{{< quote source="Author Name" src="https://example.com" >}}
+Your quote text here
+{{< /quote >}}
+```
+
+### Parameters
+
+| Parameter | Required | Description |
+|-----------|----------|-------------|
+| source | No | Author or source attribution |
+| src | No | URL to link the source (requires source parameter) |
+
+### Example
+
+Basic quote:
+```
+{{< quote source="Maya Angelou" >}}
+There is no greater agony than bearing an untold story inside you.
+{{< /quote >}}
+```
+
+With source link:
+```
+{{< quote source="Steve Jobs" src="https://en.wikipedia.org/wiki/Steve_Jobs" >}}
+The only way to do great work is to love what you do.
+{{< /quote >}}
+```
+
+## Actions
+
+Display a styled action button, typically used for downloads or calls-to-action.
+
+### Syntax
+
+```
+{{< actions url="https://example.com/file.zip" desc="Download File" >}}
+```
+
+### Parameters
+
+| Parameter | Required | Description |
+|-----------|----------|-------------|
+| url | Yes | URL the button links to |
+| desc | No | Button label text (default: "Download") |
+| outclass | No | CSS classes for the wrapper div |
+| inclass | No | CSS classes for the anchor link element |
+
+### Example
+
+Basic download button:
+```
+{{< actions url="https://github.com/user/project/archive.zip" desc="Download ZIP" >}}
+```
+
+With custom styling:
+```
+{{< actions url="https://example.com/guide.pdf" desc="Download PDF Guide" outclass="my-6" inclass="primary" >}}
+```
+
## Future Shortcodes
The following shortcodes are planned for future releases:
-- **Video**: Privacy-friendly YouTube and Vimeo embeds with custom thumbnail support
- **Callout**: Highlighted information boxes for notes, warnings, and tips
- **Tabs**: Tabbed content sections for organizing related information
- **Code**: Enhanced code blocks with syntax highlighting and line numbers
- **Audio**: Audio player for podcast episodes and sound files
+- **YouTube/Vimeo**: Privacy-friendly embedded video players
## Accessibility Notes
