Mention patreon

README.md

@@ -10,6 +10,8 @@ It enables you to add chat functionality to your website, independent of
 any specific backend. You will however need an XMPP server to connect
 to, either your own, or a public one.
 
+Please support this project via [Patreon](https://www.patreon.com/jcbrand)
+
 ## Demo
 
 Converse.js is hosted and can be used at [https://conversejs.org](https://conversejs.org).

css/theme.css

@@ -340,6 +340,10 @@ ul.features {
 }
 .sponsors {
     clear: both;
-    font-size: 1.1em;
-    padding: 2em 0 7em 0;
+    font-size: 1.4em;
+    padding: 2em 0 6em 0;
+}
+.sponsors-text {
+    text-align: left;
+    padding: 0 0 2em 0;
 }

index.html

@@ -49,6 +49,9 @@
                     <li class="page-scroll">
                         <a href="#contact">Contact</a>
                     </li>
+                    <li class="page-scroll">
+                        <a href="#sponsors">Sponsor</a>
+                    </li>
                     <li>
                         <a href="/docs/html/manual.html">User Manual</a>
                     </li>
@@ -71,7 +74,9 @@
             <div class="col-md-8 col-md-offset-2">
                 <p class="intro-text">A free and open-source XMPP chat client in your browser</p>
                 <p>Now also available in a fullscreen version.
-                    Check out <a href="https://inverse.chat" target="_blank" rel="noopener">inverse.chat</a></p>
+                Check out <a href="https://inverse.chat" target="_blank" rel="noopener">inverse.chat</a> </br>
+                Please support this project via <a href="https://www.patreon.com/jcbrand" target="_blank" rel="noopener">Patreon</a></p>
+
                 <div class="page-scroll">
                     <a href="#about" class="btn btn-default btn-lg"><span class="btn-text">Learn More</span></a>
                 </div>
@@ -205,10 +210,15 @@
                             <a href="xmpp:discuss@conference.conversejs.org" class="xmpp JSnocheck" title="Converse.js chat room">discuss@conference.conversejs.org</a>.</li>
                         <li>Please file bugs and feature requests on <a target="_blank" rel="noopener" href="https://github.com/jcbrand/converse.js/issues">Github</a>.</li>
                     </ul>
+                </div>
 
+                <div class="col-lg-8 col-lg-offset-2" style="margin-top: 4em; text-align: left">
+                    <h2 style="text-align: center">Sponsorship</h2>
+                    <p>Please support this project via <a href="https://www.patreon.com/jcbrand" target="_blank" rel="noopener">Patreon</a></p>
                 </div>
-                <div class="col-lg-8 col-lg-offset-2" style="margin-top: 5em; text-align: left">
-                    <h2> Professional support and custom development </h2>
+
+                <div class="col-lg-8 col-lg-offset-2" style="margin-top: 4em; text-align: left">
+                    <h2 style="text-align: center">Professional support and custom development</h2>
                     <p>
                         I'm available for paid-for features, custom development and consulting.<br/>
                         However, please don't contact me personally for free support, use
@@ -217,8 +227,22 @@
                         Here's my <a href="http://opkode.com/contact" target="_blank" rel="noopener">contact form</a>.</br>
                     </p>
                 </div>
-                <div class="sponsors">
-                    Converse.js is supported by <a href="https://www.keycdn.com/" target="_blank" rel="noopener"><img style="height: 2em" src="/logo/keycdn.svg" alt="KeyCDN"></a>
+            </div>
+        </div>
+    </section>
+
+    <section class="outro content-section text-center" id="sponsors">
+        <div class="container">
+            <div class="row">
+                <div class="col-lg-8 col-lg-offset-2" style="margin-top: 3em">
+                    <h2 style="text-align: center">Sponsors</h2>
+                    <div class="sponsors">
+                        Converse.js is supported by <a href="https://www.keycdn.com/" target="_blank" rel="noopener"><img style="height: 2em" src="/logo/keycdn.svg" alt="KeyCDN"></a>
+                    </div>
+
+                    <p class="sponsors-text">Converse.js is a software commons; available at no cost to you and every other person on earth.
+                       Sponsorships allow us to fund further development and improvements and are greatly appreciated.
+                       If you'd like to sponsor this project, please visit our <a href="https://www.patreon.com/jcbrand" target="_blank" rel="noopener">Patreon page</a></p>.
                 </div>
             </div>
         </div>