Parcourir la source

Load disqus comments dynamically after user request.

Thomas Buck il y a 7 ans
Parent
révision
b2460a1869
Aucun compte lié à l'adresse e-mail de l'auteur
2 fichiers modifiés avec 32 ajouts et 12 suppressions
  1. 23
    12
      page.html
  2. 9
    0
      static/css/style.css

+ 23
- 12
page.html Voir le fichier

85
                 print '</span>'
85
                 print '</span>'
86
                 print '</div>'
86
                 print '</div>'
87
 
87
 
88
-            # Disqus Comments
88
+            # Disqus Comments (only show button to load afterwards)
89
             if page.get("comments", "false") == "true":
89
             if page.get("comments", "false") == "true":
90
+                print '<div style="margin-top: 1em; text-align: center;">'
91
+                print '<button class="show-comments">Load Disqus comments</button>'
92
+                print '</div>'
90
                 print '<div id="disqus_thread"></div>'
93
                 print '<div id="disqus_thread"></div>'
91
-                print '<script type="text/javascript">'
92
-                print 'var disqus_shortname = "xythobuz";'
93
-                print 'var disqus_identifier = "http://xythobuz.org/' + page["url"] + '";'
94
-                print 'var disqus_url = "http://xythobuz.org/' + page["url"] + '";'
95
-                print '(function() {'
96
-                print 'var dsq = document.createElement("script"); dsq.type = "text/javascript"; dsq.async  = true;'
97
-                print 'dsq.src = "http://" + disqus_shortname + ".disqus.com/embed.js";'
98
-                print '(document.getElementsByTagName("head")[0] || document.getElementsByTagName("body")[0]    ).appendChild(dsq);'
99
-                print '})();'
100
-                print '</script>'
101
                 print '<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>'
94
                 print '<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>'
102
-                print '<a href="http://disqus.com" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a>'
103
             elif page.get("comments", "false") != "false":
95
             elif page.get("comments", "false") != "false":
104
                 print '<p><a href="%s">Head over here to discuss this article!</a></p>' % page.get("comments", "false")
96
                 print '<p><a href="%s">Head over here to discuss this article!</a></p>' % page.get("comments", "false")
105
         %-->
97
         %-->
123
         <a href="https://www.paypal.com/us/cgi-bin/webscr?cmd=_send-money&nav=1&email=xythobuz@me.com">PayPal</a>
115
         <a href="https://www.paypal.com/us/cgi-bin/webscr?cmd=_send-money&nav=1&email=xythobuz@me.com">PayPal</a>
124
     </div>
116
     </div>
125
     <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.3/jquery.min.js"></script>
117
     <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.3/jquery.min.js"></script>
118
+    <!--%
119
+        # Dynamically load Disqus comments after user requested it
120
+        if page.get("comments", "false") == "true":
121
+            print '<script type="text/javascript">'
122
+            print 'var disqus_shortname = "xythobuz";'
123
+            print 'var disqus_identifier = "http://xythobuz.org/' + page["url"] + '";'
124
+            print 'var disqus_url = "http://xythobuz.org/' + page["url"] + '";'
125
+            print '$(document).ready(function() {'
126
+            print '$(".show-comments").on("click", function(){'
127
+            print '(function() {'
128
+            print 'var dsq = document.createElement("script"); dsq.type = "text/javascript"; dsq.async  = true;'
129
+            print 'dsq.src = "http://" + disqus_shortname + ".disqus.com/embed.js";'
130
+            print '(document.getElementsByTagName("head")[0] || document.getElementsByTagName("body")[0]    ).appendChild(dsq);'
131
+            print '})();'
132
+            print '$(this).fadeOut();'
133
+            print '});'
134
+            print '});'
135
+            print '</script>'
136
+    %-->
126
     <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-mousewheel/3.1.13/jquery.mousewheel.min.js"></script>
137
     <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-mousewheel/3.1.13/jquery.mousewheel.min.js"></script>
127
     <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/1.2.18/js/lightgallery-all.min.js"></script>
138
     <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/1.2.18/js/lightgallery-all.min.js"></script>
128
     <script type="text/javascript">
139
     <script type="text/javascript">

+ 9
- 0
static/css/style.css Voir le fichier

47
     border-radius: 10px;
47
     border-radius: 10px;
48
 }
48
 }
49
 
49
 
50
+.show-comments {
51
+    background: none;
52
+    border: none;
53
+    font: inherit;
54
+    cursor: pointer;
55
+    border-bottom: 1px solid blue;
56
+    color: blue;
57
+}
58
+
50
 #home {
59
 #home {
51
     font-size: 2.5em;
60
     font-size: 2.5em;
52
     margin-right: 0.5em;
61
     margin-right: 0.5em;

Chargement…
Annuler
Enregistrer