jekyll-bunny
A Jekyll plugin that provides a {% bunny %} Liquid tag for embedding Bunny Stream-hosted videos with a responsive iframe wrapper.
Installation
Add to your Gemfile:
gem "jekyll-bunny", "~> 0.1"
Add to your _config.yml:
plugins:
- jekyll-bunny
Then run:
bundle install
Usage
The tag requires both your Library ID and Video ID:
{% bunny LIBRARY_ID VIDEO_ID %}
With optional parameters:
{% bunny LIBRARY_ID VIDEO_ID autoplay=false loop=true muted=false showSpeed=true %}
The tag outputs a responsive 16:9 iframe wrapper:
<div class="bunny-embed" style="position:relative;padding-bottom:56.25%;height:0;overflow:hidden;">
<iframe
src="https://player.mediadelivery.net/embed/LIBRARY_ID/VIDEO_ID"
frameborder="0"
allow="accelerometer; gyroscope; autoplay; encrypted-media; picture-in-picture"
allowfullscreen
style="position:absolute;top:0;left:0;width:100%;height:100%;"
loading="lazy">
</iframe>
</div>
Finding Your Library ID and Video ID
Both values are available in your Bunny Stream dashboard. The embed URL format is:
https://player.mediadelivery.net/embed/{LIBRARY_ID}/{VIDEO_ID}
You can also copy the embed code from the video details page in the Bunny Stream dashboard.
Supported Parameters
| Parameter | Values | Description |
|---|---|---|
autoplay |
true, false |
Autoplay on load (may be blocked by browsers) |
loop |
true, false |
Loop playback |
muted |
true, false |
Start muted |
preload |
true, false |
Preload video files |
playsinline |
true, false |
Play inline on mobile |
t |
30s, 1h20m45s, hh:mm:ss, or seconds |
Start playback at this time |
captions |
caption short-code | Default caption language (e.g., en) |
chromecast |
true, false |
Enable Chromecast support |
disableAirplay |
true, false |
Disable AirPlay |
disableIosPlayer |
true, false |
Disable native iOS player |
showHeatmap |
true, false |
Show engagement heatmap on progress bar |
showSpeed |
true, false |
Show playback speed control |
rememberPosition |
true, false |
Remember last playback position |
compactControls |
true, false |
Enable compact player UI |
responsive |
true, false |
Responsive player sizing |
Styling
The plugin outputs an unstyled .bunny-embed wrapper div. Add bottom margin or other spacing in your site's CSS:
.bunny-embed {
margin-bottom: 2rem;
}
License
MIT — see LICENSE.txt.