layouts/shortcodes/downloads-block.html

<div class="container download-wrapper">
  <h1 class="text-center">Download</h1>
  <p class="article-description mt-4">
    Use the links below to download Apache SkyWalking releases from one of our mirrors. Don’t forget to verify the files
    downloaded. Please note that only source code releases are official Apache releases, binary distributions are just
    for end user convenience.
  </p>
  <div class="text-center btn-wrapper mb-4">
    {{range .Site.Data.releases}}
    {{if .buttonText}}
    <a href="#{{.buttonText}}" class="link-type">
      <button class="sky-btn">{{.buttonText}}</button>
    </a>
    {{else}}
    {{$type := replace .type " " "" }}
    <a href="#{{$type}}" class="link-type">
      <button class="sky-btn">{{.type}}</button>
    </a>
    {{end}}
    {{end}}
    <a href="#DockerImages" class="link-type">
      <button class="sky-btn">Docker images</button>
    </a>
  </div>


  {{ range .Site.Data.releases }}
  <div class="card-wrapper">
    {{if .buttonText}}
    <h2 class="deco-title" id="{{.buttonText}}">{{.type}}</h2>
    {{else}}
    {{$type := replace .type " " "" }}
    <h2 class="deco-title" id="{{$type}}">{{.type}}</h2>
    {{end}}

    <div class="item-wrapper">
      {{range .list}}
      {{$id := replace .name " " "" }}
      <div class="card item">
        <div class="card-body">
          {{if .icon}}
          <img width="36" height="36" src="/images/project/{{.icon}}.svg" alt="{{.icon}}">
          {{end}}
          <div class="card-text">
            <div class="title-box">
              <h5 class="card-title">{{.name}}</h5>
              <a aria-hidden="true" href="#{{$id}}" id="{{$id}}" style="visibility: hidden;">
                <i class="iconfont icon-link"></i>
              </a>
              {{ $name := .name }}
            </div>
            <p>{{.description}}</p>
          </div>
          <div class="doc-box">
            <div class="flex-center">
              {{if .sourceText}}
              <span class="source-text">{{.sourceText}}</span>
              {{else}}
              <div class="btn-group">
                <button type="button" class="btn btn-sm dropdown-toggle" data-toggle="dropdown"
                        aria-haspopup="true" aria-expanded="false">
                  Source
                </button>
                <div class="dropdown-menu scroll-bar">
                  <div>
                    {{ range .source }}
                    <h6 class="dropdown-header">{{.version}}<span> | {{.date}}</span></h6>
                    {{ $version := .version }}
                    <div class="dropdown-item">
                      {{range .downloadLink}}
                      [<a href="{{.link}}" data-label="[{{$name}}]-[Source]-[{{$version}}]-[{{.name}}]"
                          rel="noopener noreferrer" target="_blank">{{.name}}</a>]
                      {{end}}
                    </div>
                    {{end}}
                  </div>
                </div>
              </div>
              {{end}}
            </div>

            {{ if .distribution}}
            <div class="btn-group">
              <button type="button" class="btn btn-sm dropdown-toggle" data-toggle="dropdown" aria-haspopup="true"
                      aria-expanded="false">
                Distribution
              </button>
              <div class="dropdown-menu scroll-bar">
                <div>
                  {{ range .distribution }}
                  <h6 class="dropdown-header">{{.version}}<span> | {{.date}}</span></h6>
                  {{ $version := .version }}
                  <div class="dropdown-item">
                    {{range .downloadLink}}
                    [<a href="{{.link}}" data-label="[{{$name}}]-[Distribution]-[{{$version}}]-[{{.name}}]"
                        rel="noopener noreferrer" target="_blank">{{.name}}</a>]
                    {{end}}
                  </div>
                  {{end}}
                </div>

              </div>
            </div>
            {{end}}
          </div>

        </div>
      </div>
      {{end}}
    </div>
  </div>
  {{end}}

</div>

<div class="container container-archived">
    <p>Older releases are not recommended for new users, because they are not maintained, but you still can find them(source codes and binaries) if you have specific reasons.
    </p>
    <p>Find all SkyWalking releases in the <a href="https://archive.apache.org/dist/skywalking/">Archive repository</a>.
    </p>
    <p>
      <a href="https://archive.apache.org/dist/incubator/skywalking/">Archive incubating repository</a>
      hosts older releases when SkyWalking was an incubator project.
    </p>
</div>

<div class="container-full">
  <div class="container">
    <div class="card-wrapper images-wrapper">
      <h2 class="deco-title" id="DockerImages">Docker Images for convenience</h2>
      <div class="item-wrapper">
        {{ range .Site.Data.dockerImages }}
        {{$imgId := replace .name " " "" }}
        <div class="card item">
          <div class="card-body">
            <div class="title-box">
              <h5 class="card-title">{{.name}}</h5>
              <a aria-hidden="true" href="#{{$imgId}}Image" id="{{$imgId}}Image" style="visibility: hidden;">
                <i class="iconfont icon-link"></i>
              </a>
            </div>
            <p class="card-text">{{.description}}</p>
            <div class="doc-box">
              <div class="btn-group">
                <a class="btn btn-sm" href="{{.link}}">Docker Image</a>
              </div>
            </div>
          </div>
        </div>
        {{end}}
      </div>
    </div>
  </div>
</div>