hacks-guide-minimal-mistake.../test/_posts/2017-01-23-layout-header-video.md

60 lines
1.4 KiB
Markdown
Raw Normal View History

2017-01-24 16:09:38 +01:00
---
title: "Layout: Header Video"
header:
video:
id: XsxDH4HcOWA
provider: youtube
categories:
- Layout
- Uncategorized
tags:
- video
- layout
---
This post should display a **header with a responsive video**, if the theme supports it.
## Settings
| Parameter | Required | Description |
|---------- |--------- | ----------- |
| `id` | **Required** | ID of the video |
| `provider` | **Required** | Hosting provider of the video, either `youtube` or `vimeo` |
### YouTube
To embed the following YouTube video at url `https://www.youtube.com/watch?v=XsxDH4HcOWA` (long version) or `https://youtu.be/XsxDH4HcOWA` (short version) into a post or page's main content you'd use:
```liquid
{% raw %}{% include video id="XsxDH4HcOWA" provider="youtube" %}{% endraw %}
```
{% include video id="XsxDH4HcOWA" provider="youtube" %}
To embed it as a video header you'd use the following YAML Front Matter
```yaml
header:
video:
id: XsxDH4HcOWA
provider: youtube
```
### Vimeo
2018-01-09 20:28:43 +01:00
To embed the following Vimeo video at url `https://vimeo.com/212731897` into a post or page's main content you'd use:
2017-01-24 16:09:38 +01:00
```liquid
2018-01-09 20:28:43 +01:00
{% raw %}{% include video id="212731897" provider="vimeo" %}{% endraw %}
2017-01-24 16:09:38 +01:00
```
2018-01-09 20:28:43 +01:00
{% include video id="212731897" provider="vimeo" %}
2017-01-24 16:09:38 +01:00
To embed it as a video header you'd use the following YAML Front Matter
```yaml
header:
video:
2018-01-09 20:28:43 +01:00
id: 212731897
2017-01-24 16:09:38 +01:00
provider: vimeo
```