diff --git a/GanjooRazor/Pages/AudioClip.cshtml b/GanjooRazor/Pages/AudioClip.cshtml
index 9f7dbe39..4342dff2 100644
--- a/GanjooRazor/Pages/AudioClip.cshtml
+++ b/GanjooRazor/Pages/AudioClip.cshtml
@@ -15,7 +15,7 @@
         گنجور » نمایش خوانش
     </title>
     <link href="~/dist/skin/pink.flag/css/jplayer.pink.flag.min.css" rel="stylesheet" type="text/css" />
-    <link href="~/css/p8.css?version=25" rel="stylesheet" type="text/css" />
+    <link href="~/css/p8.css?version=26" rel="stylesheet" type="text/css" />
     <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
     <link rel="search" type="application/opensearchdescription+xml" title="گنجور" href="https://ganjoor.net/search.xml" />
     <script>
diff --git a/GanjooRazor/Pages/Bp.cshtml b/GanjooRazor/Pages/Bp.cshtml
index 4cee938b..b323ab7c 100644
--- a/GanjooRazor/Pages/Bp.cshtml
+++ b/GanjooRazor/Pages/Bp.cshtml
@@ -11,7 +11,7 @@
     <title>انتخاب قطعهٔ موسیقی مرتبط با شعر از بیپتونز</title>
     <meta name="robots" content="noindex, nofollow" />
     <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
-    <link href="/css/p8.css?version=25" rel="stylesheet" type="text/css" />
+    <link href="/css/p8.css?version=26" rel="stylesheet" type="text/css" />
     <link href="/css/spotify.css" rel="stylesheet" type="text/css" />
 
     <script src="/lib/jquery/dist/jquery.min.js"></script>
diff --git a/GanjooRazor/Pages/Error.cshtml b/GanjooRazor/Pages/Error.cshtml
index 669c51d7..a63239ad 100644
--- a/GanjooRazor/Pages/Error.cshtml
+++ b/GanjooRazor/Pages/Error.cshtml
@@ -14,7 +14,7 @@
         @ViewData["Title"]
     </title>
 
-    <link href="/css/p8.css?version=25" rel="stylesheet" type="text/css" />
+    <link href="/css/p8.css?version=26" rel="stylesheet" type="text/css" />
     <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
     <link rel="search" type="application/opensearchdescription+xml" title="گنجور" href="https://ganjoor.net/search.xml" />
 
diff --git a/GanjooRazor/Pages/Golha.cshtml b/GanjooRazor/Pages/Golha.cshtml
index a3273b0a..ca24b1a7 100644
--- a/GanjooRazor/Pages/Golha.cshtml
+++ b/GanjooRazor/Pages/Golha.cshtml
@@ -10,7 +10,7 @@
     <title>انتخاب قطعه‌ای از برنامهٔ گلها مرتبط با این شعر</title>
     <meta name="robots" content="noindex, nofollow" />
     <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
-    <link href="/css/p8.css?version=25" rel="stylesheet" type="text/css" />
+    <link href="/css/p8.css?version=26" rel="stylesheet" type="text/css" />
     <link href="/css/spotify.css" rel="stylesheet" type="text/css" />
     <script src="/lib/jquery/dist/jquery.min.js"></script>
     <script src="~/js/golha.js"></script>
diff --git a/GanjooRazor/Pages/Index.cshtml b/GanjooRazor/Pages/Index.cshtml
index c793c202..fc7867ca 100644
--- a/GanjooRazor/Pages/Index.cshtml
+++ b/GanjooRazor/Pages/Index.cshtml
@@ -16,7 +16,7 @@
     {
         <meta name="robots" content="noindex, nofollow" />
     }
-    <link href="/css/p8.css?version=25" rel="stylesheet" type="text/css" />
+    <link href="/css/p8.css?version=26" rel="stylesheet" type="text/css" />
     <link href="/css/fab.css" rel="stylesheet" type="text/css" />
     <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
     <link rel="search" type="application/opensearchdescription+xml" title="گنجور" href="https://ganjoor.net/search.xml" />
diff --git a/GanjooRazor/Pages/Login.cshtml b/GanjooRazor/Pages/Login.cshtml
index a0e9fc8c..062fbca0 100644
--- a/GanjooRazor/Pages/Login.cshtml
+++ b/GanjooRazor/Pages/Login.cshtml
@@ -13,7 +13,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="robots" content="noindex, nofollow" />
     <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
-    <link href="/css/p8.css?version=25" rel="stylesheet" type="text/css" />
+    <link href="/css/p8.css?version=26" rel="stylesheet" type="text/css" />
 </head>
 <body>
     <div id="hdr">
diff --git a/GanjooRazor/Pages/Map.cshtml b/GanjooRazor/Pages/Map.cshtml
index cfd2358a..f4968479 100644
--- a/GanjooRazor/Pages/Map.cshtml
+++ b/GanjooRazor/Pages/Map.cshtml
@@ -12,7 +12,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="description" content="شاعران و نویسندگان گنجور روی نقشهٔ جغرافیایی" />
     <meta charset="utf-8" />
-    <link href="/css/p8.css?version=25" rel="stylesheet" type="text/css" />
+    <link href="/css/p8.css?version=26" rel="stylesheet" type="text/css" />
     <link rel="stylesheet" href="/css/leaflet.css" />
     <style>
         .leaflet-container {
diff --git a/GanjooRazor/Pages/Pin.cshtml b/GanjooRazor/Pages/Pin.cshtml
index 8b39c68c..9f1d1c2a 100644
--- a/GanjooRazor/Pages/Pin.cshtml
+++ b/GanjooRazor/Pages/Pin.cshtml
@@ -11,7 +11,7 @@
     <title>پیشنهاد شعر مرتبط با تصویر</title>
     <meta name="robots" content="noindex, nofollow" />
     <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
-    <link href="/css/p8.css?version=25" rel="stylesheet" type="text/css" />
+    <link href="/css/p8.css?version=26" rel="stylesheet" type="text/css" />
     <link href="/css/spotify.css" rel="stylesheet" type="text/css" />
 
     <script src="/lib/jquery/dist//jquery.min.js"></script>
diff --git a/GanjooRazor/Pages/RecitationsOrder.cshtml b/GanjooRazor/Pages/RecitationsOrder.cshtml
index 0f8e94df..f1f78168 100644
--- a/GanjooRazor/Pages/RecitationsOrder.cshtml
+++ b/GanjooRazor/Pages/RecitationsOrder.cshtml
@@ -12,7 +12,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="robots" content="noindex, nofollow" />
     <title>اطلاعات رتبه‌بندی خوانش‌های شعر</title>
-    <link href="/css/p8.css?version=25" rel="stylesheet" type="text/css" />
+    <link href="/css/p8.css?version=26" rel="stylesheet" type="text/css" />
 
 </head>
 <body>
diff --git a/GanjooRazor/Pages/ReportComment.cshtml b/GanjooRazor/Pages/ReportComment.cshtml
index 6e0e523f..097e8b5f 100644
--- a/GanjooRazor/Pages/ReportComment.cshtml
+++ b/GanjooRazor/Pages/ReportComment.cshtml
@@ -11,7 +11,7 @@
     <meta name="robots" content="noindex, nofollow" />
     <title>درخواست حذف حاشیه</title>
     <script src="/lib/jquery/dist/jquery.min.js"></script>
-    <link href="/css/p8.css?version=25" rel="stylesheet" type="text/css" />
+    <link href="/css/p8.css?version=26" rel="stylesheet" type="text/css" />
     <style>
         label {
             width: 100px;
diff --git a/GanjooRazor/Pages/ReportRecitation.cshtml b/GanjooRazor/Pages/ReportRecitation.cshtml
index bb4133f5..160d7380 100644
--- a/GanjooRazor/Pages/ReportRecitation.cshtml
+++ b/GanjooRazor/Pages/ReportRecitation.cshtml
@@ -12,7 +12,7 @@
     <meta name="robots" content="noindex, nofollow" />
     <title>گزارش خطا در خوانش</title>
     <script src="/lib/jquery/dist/jquery.min.js"></script>
-    <link href="/css/p8.css?version=25" rel="stylesheet" type="text/css" />
+    <link href="/css/p8.css?version=26" rel="stylesheet" type="text/css" />
     <style>
         label {
             width: 100px;
diff --git a/GanjooRazor/Pages/ResetPassword.cshtml b/GanjooRazor/Pages/ResetPassword.cshtml
index c505576c..988ada49 100644
--- a/GanjooRazor/Pages/ResetPassword.cshtml
+++ b/GanjooRazor/Pages/ResetPassword.cshtml
@@ -12,7 +12,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="robots" content="noindex, nofollow" />
     <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
-    <link href="/css/p8.css?version=25" rel="stylesheet" type="text/css" />
+    <link href="/css/p8.css?version=26" rel="stylesheet" type="text/css" />
 </head>
 <body>
     <div id="hdr">
diff --git a/GanjooRazor/Pages/Search.cshtml b/GanjooRazor/Pages/Search.cshtml
index 386b8031..d66cb865 100644
--- a/GanjooRazor/Pages/Search.cshtml
+++ b/GanjooRazor/Pages/Search.cshtml
@@ -15,7 +15,7 @@
         @ViewData["Title"]
     </title>
 
-    <link href="/css/p8.css?version=25" rel="stylesheet" type="text/css" />
+    <link href="/css/p8.css?version=26" rel="stylesheet" type="text/css" />
     <link href="/css/fab.css" rel="stylesheet" type="text/css" />
     <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
     <link rel="search" type="application/opensearchdescription+xml" title="گنجور" href="https://ganjoor.net/search.xml" />
diff --git a/GanjooRazor/Pages/Shared/_AdminLayout.cshtml b/GanjooRazor/Pages/Shared/_AdminLayout.cshtml
index 8f4e5efb..0d8a6121 100644
--- a/GanjooRazor/Pages/Shared/_AdminLayout.cshtml
+++ b/GanjooRazor/Pages/Shared/_AdminLayout.cshtml
@@ -9,7 +9,7 @@
     <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />
     <link rel="stylesheet" href="~/css/site.css" />
     <link href="/dist/skin/blue.monday/css/jplayer.blue.monday.min.css" rel="stylesheet" type="text/css" />
-    <link href="/css/p8.css?version=25" rel="stylesheet" type="text/css" />
+    <link href="/css/p8.css?version=26" rel="stylesheet" type="text/css" />
     <link href="/css/fab.css" rel="stylesheet" type="text/css" />
     <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
     <link rel="search" type="application/opensearchdescription+xml" title="گنجور" href="https://ganjoor.net/search.xml" />
diff --git a/GanjooRazor/Pages/Shared/_Layout.cshtml b/GanjooRazor/Pages/Shared/_Layout.cshtml
index f6e16c2c..21ec302a 100644
--- a/GanjooRazor/Pages/Shared/_Layout.cshtml
+++ b/GanjooRazor/Pages/Shared/_Layout.cshtml
@@ -9,7 +9,7 @@
     <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />
     <link rel="stylesheet" href="~/css/site.css" />
     <link href="/dist/skin/blue.monday/css/jplayer.blue.monday.min.css" rel="stylesheet" type="text/css" />
-    <link href="/css/p8.css?version=25" rel="stylesheet" type="text/css" />
+    <link href="/css/p8.css?version=26" rel="stylesheet" type="text/css" />
     <link href="/css/fab.css" rel="stylesheet" type="text/css" />
     <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
     <link rel="search" type="application/opensearchdescription+xml" title="گنجور" href="https://ganjoor.net/search.xml" />
diff --git a/GanjooRazor/Pages/SignUp.cshtml b/GanjooRazor/Pages/SignUp.cshtml
index 98ea6526..63320079 100644
--- a/GanjooRazor/Pages/SignUp.cshtml
+++ b/GanjooRazor/Pages/SignUp.cshtml
@@ -12,7 +12,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="robots" content="noindex, nofollow" />
     <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
-    <link href="/css/p8.css?version=25" rel="stylesheet" type="text/css" />
+    <link href="/css/p8.css?version=26" rel="stylesheet" type="text/css" />
 </head>
 <body>
     <div id="hdr">
diff --git a/GanjooRazor/Pages/Spotify.cshtml b/GanjooRazor/Pages/Spotify.cshtml
index 746e34bd..9fbf731b 100644
--- a/GanjooRazor/Pages/Spotify.cshtml
+++ b/GanjooRazor/Pages/Spotify.cshtml
@@ -11,7 +11,7 @@
     <title>انتخاب قطعهٔ موسیقی مرتبط با شعر از اسپاتیفای</title>
     <meta name="robots" content="noindex, nofollow" />
     <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
-    <link href="/css/p8.css?version=25" rel="stylesheet" type="text/css" />
+    <link href="/css/p8.css?version=26" rel="stylesheet" type="text/css" />
     <link href="/css/spotify.css" rel="stylesheet" type="text/css" />
 
     <script src="/lib/jquery/dist/jquery.min.js"></script>
diff --git a/GanjooRazor/Pages/Trans.cshtml b/GanjooRazor/Pages/Trans.cshtml
index 5f63a1b4..d1730d4e 100644
--- a/GanjooRazor/Pages/Trans.cshtml
+++ b/GanjooRazor/Pages/Trans.cshtml
@@ -14,7 +14,7 @@
         گنجور &raquo; برگردان‌ها و نویس‌های شعر
     </title>
     <script src="~/lib/jquery/dist/jquery.min.js"></script>
-    <link href="~/css/p8.css?version=25" rel="stylesheet" type="text/css" />
+    <link href="~/css/p8.css?version=26" rel="stylesheet" type="text/css" />
     <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
     <link rel="search" type="application/opensearchdescription+xml" title="گنجور" href="https://ganjoor.net/search.xml" />
 </head>
diff --git a/GanjooRazor/Pages/_AudioPlayerPartial.cshtml b/GanjooRazor/Pages/_AudioPlayerPartial.cshtml
index 4fd5e13f..9150d21f 100644
--- a/GanjooRazor/Pages/_AudioPlayerPartial.cshtml
+++ b/GanjooRazor/Pages/_AudioPlayerPartial.cshtml
@@ -17,6 +17,7 @@
                 <a role="button" onclick="document.getElementById('audio-@(nRecitationIndex + 1)').play()" class="actionlink">@recitaion.AudioTitle</a> @Html.Raw(Model.getAudioDesc(recitaion, nRecitationIndex == 0))
             </div>
             <div class="audio-partial-action-box">
+                <a role="button" class="w3tooltip cursor-pointer recitation-button" onclick="document.getElementById('audio-@(nRecitationIndex + 1)').play()"><i class="recitation-icons recitation-play"></i><span class="w3tooltiptext">پخش</span></a>
                 <a role="button" class="w3tooltip cursor-pointer recitation-button" href="@($"/AudioClip/?a={recitaion.Id}")" onclick="wpopen(this.href); return false"><i class="recitation-icons recitation-download"></i><span class="w3tooltiptext">دریافت خوانش</span></a>
                 <a role="button" class="w3tooltip cursor-pointer recitation-button" onclick="switchPlayerScrollLock()"><i class="recitation-icons recitation-scrollunlock"></i><span class="w3tooltiptext">قفل متن روی خوانش</span></a>
                 <a role="button" class="w3tooltip cursor-pointer recitation-button" href="@($"/ReportRecitation/?a={recitaion.Id}")" onclick="wpopen(this.href); return false"><i class="recitation-icons recitation-report"></i><span class="w3tooltiptext">گزارش خطا</span></a>
@@ -25,6 +26,10 @@
                     <a role="button" class="w3tooltip cursor-pointer recitation-button" onclick="switchRecitationVote(@recitaion.Id)"><i class="recitation-icons recitation-novote" id="@($"recitaion-{recitaion.Id}")"></i><span class="w3tooltiptext">رأی به خوانش</span></a>
                 }
                 <a role="button" class="w3tooltip cursor-pointer recitation-button" href="@($"/RecitationsOrder/?p={recitaion.PoemId}#a{recitaion.Id}")" onclick="wpopen(this.href); return false"><i class="recitation-icons recitation-score"></i><span class="w3tooltiptext">اطلاعات رتبه‌بندی</span></a>
+                @if(recitaion.AudioArtistUrl.IndexOf("http") == 0)
+                {
+                    <a role="button" class="w3tooltip cursor-pointer recitation-button" href="@Html.Raw(recitaion.AudioArtistUrl)" target="_blank"><i class="recitation-icons recitation-website"></i><span class="w3tooltiptext">@recitaion.AudioArtist</span></a>
+                }
             </div>
             @if (recitaion.Mistakes.Length > 0)
             {
diff --git a/GanjooRazor/Pages/errors/404.cshtml b/GanjooRazor/Pages/errors/404.cshtml
index c08dd7fc..1dd0bb6b 100644
--- a/GanjooRazor/Pages/errors/404.cshtml
+++ b/GanjooRazor/Pages/errors/404.cshtml
@@ -14,7 +14,7 @@
         @ViewData["Title"]
     </title>
 
-    <link href="/css/p8.css?version=25" rel="stylesheet" type="text/css" />
+    <link href="/css/p8.css?version=26" rel="stylesheet" type="text/css" />
     <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
     <link rel="search" type="application/opensearchdescription+xml" title="گنجور" href="https://ganjoor.net/search.xml" />
 
diff --git a/GanjooRazor/Pages/errors/503.cshtml b/GanjooRazor/Pages/errors/503.cshtml
index 793ba01c..5345e7c3 100644
--- a/GanjooRazor/Pages/errors/503.cshtml
+++ b/GanjooRazor/Pages/errors/503.cshtml
@@ -15,7 +15,7 @@
         @ViewData["Title"]
     </title>
 
-    <link href="/css/p8.css?version=25" rel="stylesheet" type="text/css" />
+    <link href="/css/p8.css?version=26" rel="stylesheet" type="text/css" />
     <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
     <link rel="search" type="application/opensearchdescription+xml" title="گنجور" href="https://ganjoor.net/search.xml" />
 
diff --git a/GanjooRazor/wwwroot/css/p8.css b/GanjooRazor/wwwroot/css/p8.css
index 429c523b..1208e41e 100644
--- a/GanjooRazor/wwwroot/css/p8.css
+++ b/GanjooRazor/wwwroot/css/p8.css
@@ -1254,6 +1254,10 @@ ol {
     content: 'download';
 }
 
+.recitation-play::after {
+    content: 'play_arrow';
+}
+
 .recitation-report::after {
     content: 'flag';
 }
@@ -1278,6 +1282,10 @@ ol {
     content: 'calculate';
 }
 
+.recitation-website::after {
+    content: 'public';
+}
+
 audio{
     width:100%;
 }