Update the download block of the docker images.
diff --git a/content/downloads/_index.md b/content/downloads/_index.md
index 6222fe3..1c58204 100755
--- a/content/downloads/_index.md
+++ b/content/downloads/_index.md
@@ -26,6 +26,8 @@
- SkyWalking OAP Server, https://hub.docker.com/r/apache/skywalking-oap-server
- SkyWalking UI, https://hub.docker.com/r/apache/skywalking-ui
+{{< dockerhub-block >}}
+
## Changelog
You can also read the [changelogs](https://github.com/apache/skywalking/blob/master/CHANGES.md) for all versions.
diff --git a/layouts/shortcodes/dockerhub-block.html b/layouts/shortcodes/dockerhub-block.html
new file mode 100644
index 0000000..7a8c54b
--- /dev/null
+++ b/layouts/shortcodes/dockerhub-block.html
@@ -0,0 +1,38 @@
+<div class="card-wrapper">
+ <!-- SkyWalking OAP-->
+ <div class="card item">
+ <div class="card-body">
+ <div class="title-box">
+ <span class="icon">D</span>
+ <h5 class="card-title">SkyWalking OAP Server</h5>
+ </div>
+ <p class="card-text">
+ This image would start up SkyWalking OAP server only.
+ </p>
+ <div class="doc-box">
+ <div class="btn-group">
+ <a class="btn btn-sm dropdown-toggle" href="https://hub.docker.com/r/apache/skywalking-oap-server">Docker Image</a>
+ </div>
+ </div>
+ <p>
+ Note, choose <b>*-es6 tags</b> when use ElasticSearch 6, <b>*-es7</b> tags when use ElasticSearch 7.
+ </p>
+ </div>
+ </div>
+ <div class="card item">
+ <div class="card-body">
+ <div class="title-box">
+ <span class="icon">D</span>
+ <h5 class="card-title">SkyWalking UI Image</h5>
+ </div>
+ <p class="card-text">
+ This image would start up SkyWalking UI only.
+ </p>
+ <div class="doc-box">
+ <div class="btn-group">
+ <a class="btn btn-sm dropdown-toggle" href="https://hub.docker.com/r/apache/skywalking-oap-server">Docker Image</a>
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
\ No newline at end of file
