Make subscribe page nicer (#303)

Author: ByteHamster

_i18n/en/documentation/podcasters-hosters/add-on-antennapod.md

@@ -1,5 +1,9 @@
 Do you want to make it easy for your network or audience to add your podcast(s) in AntennaPod?
+Simply include a link like the one given below on your website or wherever you want.
+Make sure to replace `xyz` with the URL of your RSS feed and `abc` with the title of your podcast.
 
-Simply include a link to `https://antennapod.org/deeplink/subscribe?url=xyz` on your website or wherever you want. Make sure to replace `xyz` with the URL of your RSS feed. Users who have installed AntennaPod and open that link will be able to preview episodes and subscribe to your podcast directly in our app.
+`https://antennapod.org/deeplink/subscribe?url=xyz&title=abc`
 
+Users who have installed AntennaPod and open that link will be able to preview episodes and subscribe to your podcast directly in our app.
+You can view an example of such a page [here](/deeplink/subscribe?url=https://antennapod.org/rss.xml&title=Blog+Posts).
 If you need our logo, please have a look at our [branding repository](https://github.com/AntennaPod/branding).

_i18n/en/general/subscribe.md

@@ -1,3 +1,11 @@
-Press the button above to subscribe to this podcast in AntennaPod. If you don't have AntennaPod installed yet, you can [download the app here](/download).
+Press the button below to subscribe to this podcast in AntennaPod. Don't have AntennaPod yet? You can [download](/download) the app to enjoy free access to millions of podcasts.
 
-If your web browser does not support opening AntennaPod directly using the button, you can also copy the address displayed in the box below and paste it into AntennaPod's search box.
+<!-- mdpo-disable-next-line -->
+<button id="subscribeButton" class="btn btn-primary">
+Subscribe in AntennaPod
+<!-- mdpo-disable-next-line -->
+</button>
+
+Do you use another podcast app or does your web browser not support opening AntennaPod directly?
+You can find the RSS address of the podcast in the box below.
+To subscribe, paste the address into AntennaPod's search box or into your other podcast app.

deeplink/subscribe/index.html

@@ -3,23 +3,24 @@
 title: generic.subscribe
 ---
 
-<div class="container-fluid py-5">
+<div class="container-fluid">
   <div class="container">
-    <article class="post-content">
-      <div class="row pb-4">
-        <button id="retryButton" class="btn btn-primary">{% t generic.subscribe %}</button>
+    <div class="row justify-content-md-center">
+      <div class="col col-xl-6">
+        <article class="post-content">
+          <h2 id="podcastTitle">{% t generic.subscribe %}</h2>
+          {% tf general/subscribe.md %}
+          <p>
+            <div class="card">
+              <div class="card-body">
+                <i class="fa fa-rss mr-1"></i>
+                <span id="urlTextBox">JavaScript required</span>
+              </div>
+            </div>
+          </p>
+        </article>
       </div>
-      <div class="row">
-        {% tf general/subscribe.md %}
-      </div>
-      <div class="row pb-4">
-        <div class="card">
-          <div class="card-body" id="urlTextBox">
-            JavaScript required.
-          </div>
-        </div>
-      </div>
-    </article>
+    </div>
   </div>
 </div>
 
@@ -33,15 +34,18 @@
   };
 
   const urlTextBox = document.getElementById("urlTextBox");
-  const retryButton = document.getElementById("retryButton");
+  const subscribeButton = document.getElementById("subscribeButton");
+  const podcastTitle = document.getElementById("podcastTitle");
   if (getUrlParameter("url") === false) {
     urlTextBox.textContent = "URL not available";
-    retryButton.disabled = true;
-    retryButton.textContent += " (error)";
-
+    subscribeButton.disabled = true;
+    subscribeButton.textContent += " (error)";
   } else {
+    if (getUrlParameter("title") !== false) {
+      podcastTitle.textContent = getUrlParameter("title");
+    }
     urlTextBox.textContent = getUrlParameter("url");
-    retryButton.onclick = () => {
+    subscribeButton.onclick = () => {
       window.open("antennapod-subscribe://" + getUrlParameter("url"));
     };
   }