diff --git a/docs/.vuepress/components/Route.vue b/docs/.vuepress/components/Route.vue
index c0ad5fefcc..a83a40db54 100644
--- a/docs/.vuepress/components/Route.vue
+++ b/docs/.vuepress/components/Route.vue
@@ -7,7 +7,7 @@
     作者: <a v-for="uid in author.split(' ')" :href="`https://github.com/${uid}`" target="_blank"> @{{ uid }} </a>
   </p>
   <p class="example">
-    举例: <a :href="'https://rsshub.app'+ example " target="_blank">https://rsshub.app{{example}}</a>
+    <span>举例:</span> <a :href="demoUrl" target="_blank">{{demoUrl}}</a> <img :src="'https://img.shields.io/website?label=status&style=flat-square&url=' + encodeURIComponent(encodeURI(demoUrl))">
   </p>
   <p class="path">
     路由: <code>{{ path }}</code>
@@ -76,6 +76,11 @@ export default {
     });
         return md.render(item);
     },
+  },
+  computed: {
+      demoUrl: function () {
+          return 'https://rsshub.app'+ this.example
+      }
   }
 }
 </script>
diff --git a/docs/.vuepress/styles/index.styl b/docs/.vuepress/styles/index.styl
index fe808c7ab9..1640a6aaad 100644
--- a/docs/.vuepress/styles/index.styl
+++ b/docs/.vuepress/styles/index.styl
@@ -52,10 +52,18 @@ li.params p {
   margin: 1rem 0 2rem;
 }
 
+.routeBlock .example > * {
+    vertical-align: middle;
+}
+
+.routeBlock .example img {
+    margin-left: 5px;
+}
+
 #app .page .badge.tip {
   background-color: #FFB74D;
 }
 
 #app .page .badge.warn {
   background-color: #ff774d;
-}
\ No newline at end of file
+}