---
isPage: true
draft: false
title: Embed
description: Add embed like video youtube, typeform, calendly…
icon: code-xml
hero:
  surtitle: Blocks
  title: Block embed
  text: Add embed like video youtube, typeform, calendly…
  ctas:
    - text: Documentation
      url: https://www.hugolify.io/docs/blocks/embed/
      blank: true
    - text: Page code on Github
      url: https://raw.githubusercontent.com/Hugolify/hugolify-example-blocks/refs/heads/main/content/docs/embed.md
      blank: true
      link: true
  ui:
    align: center
    theme: light
blocks:
  - type: embed
    ui:
      grid: small
      offset: start
    embed: <iframe width="560" height="315"
      src="https://www.youtube.com/embed/2ZwhZWL56t0" title="YouTube video
      player" frameborder="0" allow="accelerometer; autoplay; clipboard-write;
      encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
    heading:
      surtitle: Grid small / Offset start / YouTube
      title: Embed from youtube
      text: Mauris lobortis pulvinar lectus at semper.
  - type: embed
    ui:
      grid: small
      offset: center
    embed: <iframe width="560" height="315"
      src="https://www.youtube.com/embed/2ZwhZWL56t0" title="YouTube video
      player" frameborder="0" allow="accelerometer; autoplay; clipboard-write;
      encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
    heading:
      surtitle: Grid small / Offset center / YouTube
      title: Embed from youtube
      text: Mauris lobortis pulvinar lectus at semper.
  - type: embed
    ui:
      grid: small
      offset: end
    embed: <iframe width="560" height="315"
      src="https://www.youtube.com/embed/2ZwhZWL56t0" title="YouTube video
      player" frameborder="0" allow="accelerometer; autoplay; clipboard-write;
      encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
    heading:
      surtitle: Grid small / Offset end / YouTube
      title: Embed from youtube
      text: Mauris lobortis pulvinar lectus at semper.
  - type: embed
    ui:
      grid: medium
      offset: center
      theme: dark
    embed:
      <iframe src="https://player.vimeo.com/video/96326992?h=8fa03bf5b0" width="640" height="360" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>
      <p><a href="https://vimeo.com/96326992">Way Of Life - Landes</a> from <a href="https://vimeo.com/monvilain">MonVilain</a> on <a href="https://vimeo.com">Vimeo</a>.</p>
    heading:
      surtitle: Grid medium / Offset center / Theme dark / Vimeo
      title: Embed from vimeo
      text: Mauris lobortis pulvinar lectus at semper.

  - type: embed
    ui:
      grid: medium
      offset: center
      theme: light
    embed:
      <iframe src="https://player.vimeo.com/video/96326992?h=8fa03bf5b0" width="640" height="360" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>
      <p><a href="https://vimeo.com/96326992">Way Of Life - Landes</a> from <a href="https://vimeo.com/monvilain">MonVilain</a> on <a href="https://vimeo.com">Vimeo</a>.</p>
    heading:
      surtitle: Grid medium / Offset center / Vimeo / Theme light
      title: Embed from vimeo
      text: Mauris lobortis pulvinar lectus at semper.

  - type: embed
    ui:
      grid: medium
      offset: center
      theme: highlight
    embed:
      <iframe src="https://player.vimeo.com/video/96326992?h=8fa03bf5b0" width="640" height="360" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>
      <p><a href="https://vimeo.com/96326992">Way Of Life - Landes</a> from <a href="https://vimeo.com/monvilain">MonVilain</a> on <a href="https://vimeo.com">Vimeo</a>.</p>
    heading:
      surtitle: Grid medium / Offset center / Vimeo / Theme highlight
      title: Embed from vimeo
      text: Mauris lobortis pulvinar lectus at semper.

  - type: embed
    ui:
      grid: medium
      offset: center
      theme: accent
    embed:
      <iframe src="https://player.vimeo.com/video/96326992?h=8fa03bf5b0" width="640" height="360" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>
      <p><a href="https://vimeo.com/96326992">Way Of Life - Landes</a> from <a href="https://vimeo.com/monvilain">MonVilain</a> on <a href="https://vimeo.com">Vimeo</a>.</p>
    heading:
      surtitle: Grid medium / Offset center / Vimeo / Theme accent
      title: Embed from vimeo
      text: Mauris lobortis pulvinar lectus at semper.

  - type: embed
    ui:
      grid: medium
      offset: center
      theme: neutral
    embed:
      <iframe src="https://player.vimeo.com/video/96326992?h=8fa03bf5b0" width="640" height="360" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>
      <p><a href="https://vimeo.com/96326992">Way Of Life - Landes</a> from <a href="https://vimeo.com/monvilain">MonVilain</a> on <a href="https://vimeo.com">Vimeo</a>.</p>
    heading:
      surtitle: Grid medium / Offset center / Vimeo / Theme neutral
      title: Embed from vimeo
      text: Mauris lobortis pulvinar lectus at semper.

  - type: embed
    ui:
      grid: medium
      offset: center
      theme: black
    embed:
      <iframe src="https://player.vimeo.com/video/96326992?h=8fa03bf5b0" width="640" height="360" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>
      <p><a href="https://vimeo.com/96326992">Way Of Life - Landes</a> from <a href="https://vimeo.com/monvilain">MonVilain</a> on <a href="https://vimeo.com">Vimeo</a>.</p>
    heading:
      surtitle: Grid medium / Offset center / Vimeo / Theme black
      title: Embed from vimeo
      text: Mauris lobortis pulvinar lectus at semper.

  - type: embed
    ui:
      grid: medium
      offset: center
      theme: white
    embed:
      <iframe src="https://player.vimeo.com/video/96326992?h=8fa03bf5b0" width="640" height="360" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>
      <p><a href="https://vimeo.com/96326992">Way Of Life - Landes</a> from <a href="https://vimeo.com/monvilain">MonVilain</a> on <a href="https://vimeo.com">Vimeo</a>.</p>
    heading:
      surtitle: Grid medium / Offset center / Vimeo / Theme white
      title: Embed from vimeo
      text: Mauris lobortis pulvinar lectus at semper.
---