Page Kit
x
1
2
3
4
5
6
7
8
9
10
<div class="c-secondary-hero">
  <div class="c-secondary-hero__container">
    <div class="c-secondary-hero__content">
      <h1>Get the free computing and digital making magazine by educators for educators</h1>
      <p>One hundred pages of in-depth discussion, project ideas, lesson plans, news, and reviews</p>
      <a data-event-category="Signpost: Learn" data-event-label="Hero: parents' guide button" data-event-action="click" class="rpf-button" href="https://www.raspberrypi.org/">Subscribe</a>
    </div>
    <img alt="Alt Text" height="600" width="600" srcset="https://static.raspberrypi.org/wallpaper/balloon.jpg 2x" src="https://static.raspberrypi.org/wallpaper/waterfall.jpg" />
  </div>
</div>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
c(
  'site/secondary_hero',
  title:,
  copy:
    ActiveSupport::SafeBuffer.new(copy),
  image: {
    alt: 'Alt Text',
    height: 600,
    width: 600,
    src: random_image_src,
    srcset: {
      "#{random_image_src}": '2x'
    }
  },
  link: {
    href:,
    label:,
    attrs: {
      data: {
        event_category: 'Signpost: Learn',
        event_label: "Hero: parents' guide button",
        event_action: 'click'
      }
    }
  }
)

No notes provided.

Param Description Input

The title to display in the hero

HTML copy to display in the hero

The URL to link to

The label to display on the button