SIA Web Design Library

Embed: Video

No notes defined.

<div class='c-embed c-embed--video'>
    <div class="o-embed 
                    o-embed--16by9
        ">
        <iframe class="o-embed-item" src="https://www.youtube.com/embed/1hHMwLxN6EM" allowfullscreen=""></iframe>
    </div>
</div>
 
<div class='{{ get_component_class( 'embed', display ) }}'>
    <div class="o-embed 
        {% if ratio %}
            o-embed--{{ ratio }}
        {% elseif type == 'map' %}
            o-embed--1by1
        {% else %}
            o-embed--16by9
        {% endif %}">
        {% if type == 'map' %}
            <iframe class="o-embed-item" frameborder="0" loading="lazy" src="https://www.google.com/maps/embed/v1/place?q={{ addressQueryParam }}&key={{ apiKey }}"></iframe>
        {% else %}
            <iframe class="o-embed-item" src="{{ content|strip_debug_comments }}" allowfullscreen=""></iframe>
        {% endif %}
    </div>
</div>
 
{
  "display": {
    "modifiers": [
      "video"
    ]
  },
  "content": "https://www.youtube.com/embed/1hHMwLxN6EM"
}