go.dev/themes/default/layouts/learn/section.html

{{define "main"}}
<section class="Learn-title">
  <div class="Container">
    <h1>Getting Started</h1>
  </div>
</section>
<section class="Learn-gettingStarted">
  <div class="Container">
    <ul class="Learn-quickstarts">
      {{range first 3 $.Site.Data.learn.quickstart.links}}
      <li class="Learn-quickstart">
        <a href="{{.url}}">
          <div class="Learn-quickstartThumbnail">
            {{if .thumbnail}}
              <img src="{{.thumbnail}}" alt="{{.title}} thumbnail.">
            {{end}}
          </div>
          <p class="Learn-quickstartTitle">
            {{.title}}
          </p>
        </a>
      </li>
      {{end}}
    </ul>
    <p class="Learn-actions">
      <a class="Learn-viewMoreButton" href="#">View More &gt;</a>
    </p>
  </div>
</section>
<section class="Learn-guided">
  <div class="Container">
    <div class="Learn-subHeader">
      <h2>Guided Learning Journeys</h2>
      <p class="Learn-viewMore">
        <a href="#">View More &gt;</a>
      </p>
    </div>
    <ul class="Learn-tileList">
      {{range first 4 $.Site.Data.learn.guidedLearning.links}}
      <li class="Learn-tile">
        <a href="{{.url}}">
          <div class="Learn-tileThumbnail">
            {{if .thumbnail}}
            <img alt="{{.title}} thumbnail." src="{{.thumbnail}}">
            {{end}}
          </div>
          <p class="Learn-tileTitle">
            {{.title}}
          </p>
        </a>
      </li>
      {{end}}
    </ul>
  </div>
</section>
<section class="Learn-online">
  <div class="Container">
    <div class="Learn-subHeader">
      <h2>Online Courses</h2>
      <p class="Learn-viewMore">
        <a href="#">View More &gt;</a>
      </p>
    </div>
    <ul class="Learn-tileList">
      {{range first 4 $.Site.Data.learn.courses.links}}
      <li class="Learn-tile">
        <a href="{{.url}}">
          <div class="Learn-tileThumbnail">
            {{if .thumbnail}}
            <img alt="{{.title}} thumbnail." src="{{.thumbnail}}">
            {{end}}
          </div>
          <p class="Learn-tileTitle">
            {{.title}}
          </p>
        </a>
      </li>
      {{end}}
    </ul>
  </div>
</section>
<section class="Learn-books">
  <div class="Container">
    <div class="Learn-subHeader">
      <h2>Featured Books</h2>
      <p class="Learn-viewMore">
        <a href="#">View More &gt;</a>
      </p>
    </div>
    <ul class="Learn-tileList">
      {{range first 5 $.Site.Data.learn.books.links}}
      <li class="Learn-tile">
        <a href="{{.url}}">
          <div class="Learn-tileThumbnail Learn-tileThumbnail--book">
            {{if .thumbnail}}
            <img alt="{{.title}} thumbnail." src="{{.thumbnail}}">
            {{end}}
          </div>
          <p class="Learn-tileTitle">
            {{.title}}
          </p>
        </a>
      </li>
      {{end}}
    </ul>
  </div>
</section>
{{end}}