Page Kit
x
1
2
3
4
5
6
7
8
9
10
11
<div class="c-video-block">
  <div class="c-video">
    <div class="c-video__content">
      <a class="c-video__cover" data-youtube-id="YKseSCYwoc4" data-title="Jay, sharing his love of robotics in his local community, UK" data-event-category="Community story" data-event-label="Play video" data-event-action="click" role="button" href="https://youtu.be/YKseSCYwoc4">
        <img alt="Alt Text" height="400" width="800" srcset="https://static.raspberrypi.org/wallpaper/fisherman.jpg 2x" src="https://static.raspberrypi.org/wallpaper/lasers.jpg" />
      </a>  </div>
    <div class="c-video__cta">
      <a class="rpf-button--tertiary rpf-button" data-event-category="Community story" data-event-label="Read transcript" data-event-action="click" href="/videos/test_video_slug">Read transcript</a>
    </div>
  </div>
</div>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
c(
  'site/video_block'
) do |component|
  component.with_video do
    component.render(Site::VideoComponent.new(
                       {
                         title: 'Jay, sharing his love of robotics in his local community, UK',
                         image: {
                           alt: 'Alt Text',
                           height: 400,
                           width: 800,
                           src: random_image_src,
                           srcset: {
                             "#{random_image_src}": '2x'
                           }
                         },
                         slug: 'test_video_slug',
                         youtube_id:
                       }
                     ))
  end
end

No notes provided.

No params configured.