diff --git a/layouts/partials/article/article.html b/layouts/partials/article/article.html
index f3f7e90..c5ad53c 100644
--- a/layouts/partials/article/article.html
+++ b/layouts/partials/article/article.html
@@ -1,8 +1,18 @@
 <article class="{{ if .Params.image }}has-image {{ end }}main-article">
     {{ partial "article/components/header" . }}
 
+    {{ if .Params.audio }}
+        {{ if or ( eq .Params.audio.p "before" ) ( not .Params.audio.p ) }}
+            {{ partial "article/components/audio" . }}
+        {{ end }}
+    {{ end }}
+
     {{ partial "article/components/content" . }}
 
+    {{ if or ( eq .Params.audio.p "after")  ( eq .Params.audio.p "fixed" )  }}
+        {{ partial "article/components/audio" . }}
+    {{ end }}
+
     {{ partial "article/components/footer" . }}
 
     {{ if or .Params.math .Site.Params.article.math }}
diff --git a/layouts/partials/article/components/audio.html b/layouts/partials/article/components/audio.html
new file mode 100644
index 0000000..d521201
--- /dev/null
+++ b/layouts/partials/article/components/audio.html
@@ -0,0 +1,24 @@
+<div style="margin: 20px;">
+<meting-js style="margin: 10px;"
+    name="{{ .Params.audio.name }}"
+    artist="{{ .Params.audio.artist }}"
+    url="{{ .Params.audio.url }}" 
+    {{ if .Params.audio.cover }}
+        cover="{{ .Params.audio.cover }}"
+    {{ else }}
+        cover="/images/logo.png"
+    {{ end }}
+    fixed="{{ eq .Params.audio.p "fixed" }}"
+	server="{{ .Params.audio.server }}" 
+	type="{{ .Params.audio.type }}" 
+	id="{{ .Params.audio.id }}"
+	autoplay="true"
+	loop="all"
+	order="list"
+	preload="auto"
+	list-folded="true"
+    list-max-height="500px"
+    theme="#999999"
+	lrc-type="1">
+</meting-js>		
+</div>
\ No newline at end of file
diff --git a/layouts/partials/article/components/header.html b/layouts/partials/article/components/header.html
index 7582ec2..f6e0a73 100644
--- a/layouts/partials/article/components/header.html
+++ b/layouts/partials/article/components/header.html
@@ -32,4 +32,11 @@
     {{ end }}
 
     {{ partialCached "article/components/details" . .RelPermalink }}
+
+    {{ if .Params.audio }}
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css">
+        <script src="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js"></script>
+        <!-- require MetingJS -->
+        <script src="https://cdn.jsdelivr.net/npm/meting@2.0.1/dist/Meting.min.js"></script>
+    {{ end }}
 </header>
\ No newline at end of file
diff --git a/layouts/shortcodes/tencent.html b/layouts/shortcodes/tencent.html
new file mode 100644
index 0000000..fb0afa5
--- /dev/null
+++ b/layouts/shortcodes/tencent.html
@@ -0,0 +1,13 @@
+
+{{ $vid := (.Get 0) }}
+
+<div style="position: relative; width: 100%; height: 0; padding-bottom: 56.25%;">
+    <iframe src="http://v.qq.com/iframe/player.html?vid={{ $vid }}&auto=0"
+    scrolling="no"
+            frameborder="no"
+            framespacing="0"
+            allowfullscreen="true"
+            style="position: absolute; width: 100%; height: 100%; padding: 20px;"
+            >
+    </iframe>
+</div>
\ No newline at end of file