mod. replace like button with comment

fieldinrain · Mar 11, 2014 · 13f505f · 13f505f
1 parent 634de04
commit 13f505f
Show file tree

Hide file tree

Showing 5 changed files with 75 additions and 21 deletions.
diff --git a/README b/README
@@ -1,2 +1,4 @@
 Feel free to fork.
-And just please keep the link in the bottom.
+Please keep the link in the bottom.
+
+The like button is currently for personal use and would not work on any other domain, please delete all the line between `<!-- BEGIN this would not work on any other domain -->` and `<!-- END this would not work on any other domain -->`
diff --git a/_layouts/post.html b/_layouts/post.html
@@ -16,12 +16,51 @@ <h2>{{ page.title }} </h2>
     <a href="/tags.html#{{ tag }}" title="{{ tag }}">#{{ tag }}</a>
     {% endfor %}
   </span>
+  <!-- BEGIN this would not work on any other domain -->
+  <span id="like-wrapper"></span>
+  <script type="text/javascript">
+    var like_shortname      = '{{ site.disqus }}';
+    var like_identifier     = '{{ page.guid }}';
+    var like_like_btn       = '&#xf087;';
+    var like_unlike_btn     = '&#xf087;';
+    var like_disable_unlike = true;
+
+    var l = document.createElement('script'); l.type = 'text/javascript'; l.async = true;
+    l.src = 'https://like-waynezhang.rhcloud.com/javascript/widget.js';
+    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(l);
+  </script>
+  <!-- END this would not work on any other domain -->
   {% endif %}
   </section>
   <section class="post">
   {{ content }}
   </section>
   {% if page.guid %}
+  <div class="divider">
+    <span>
+    {% if page.previous %}
+    <a href="{{ page.previous.url }}"><i class="fa fa-chevron-left"></i></a>
+    {% else %}
+    <i class="fa fa-circle"></i>
+    {% endif %}
+    </span>
+    <!-- BEGIN comment icon
+    <span><a href="javascript:leave_comment();" id="leave_comment_link"><i class="fa fa-comment-o"></i></a></span>
+    <span><a href="javascript:collapse_comment();" id="collapse_comment_link" style="display:none;"><i class="fa fa-chevron-up"></i></a></span>
+      END comment icon -->
+
+    <span>
+    {% if page.next %}
+    <a href="{{ page.next.url }}"><i class="fa fa-chevron-right"></i></a>
+    {% else %}
+    <i class="fa fa-circle"></i>
+    {% endif %}
+    </span>
+  </div>
+
+  <!-- BEGIN comment
+  <section class="comment">
+  <div id="disqus_thread"></div>
   <script type="text/javascript">
       var disqus_shortname = '{{ site.disqus }}';
       var disqus_identifier = '{{ page.guid }}';
@@ -43,27 +82,8 @@ <h2>{{ page.title }} </h2>
           });
       };
   </script>
-  <div class="divider">
-    <span>
-    {% if page.previous %}
-    <a href="{{ page.previous.url }}"><i class="fa fa-chevron-left"></i></a>
-    {% else %}
-    <i class="fa fa-circle"></i>
-    {% endif %}
-    </span>
-    <span><a href="javascript:leave_comment();" id="leave_comment_link"><i class="fa fa-comment-o"></i></a></span>
-    <span><a href="javascript:collapse_comment();" id="collapse_comment_link" style="display:none;"><i class="fa fa-chevron-up"></i></a></span>
-    <span>
-    {% if page.next %}
-    <a href="{{ page.next.url }}"><i class="fa fa-chevron-right"></i></a>
-    {% else %}
-    <i class="fa fa-circle"></i>
-    {% endif %}
-    </span>
-  </div>
-  <section class="comment">
-  <div id="disqus_thread"></div>
   <noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
   </section>
+  END comment -->
   {% endif %}
 </article>
diff --git a/index.markdown b/index.markdown
@@ -20,6 +20,20 @@ layout: default
       {% endfor %}
     </span>
     {% endif %}
+    <!-- BEGIN this would not work on any other domain -->
+    <span id="like-wrapper"></span>
+    <script type="text/javascript">
+      var like_shortname      = '{{ site.disqus }}';
+      var like_identifier     = '{{ post.guid }}';
+      var like_like_btn       = '&#xf087;';
+      var like_unlike_btn     = '&#xf087;';
+      var like_disable_unlike = true;
+
+      var l = document.createElement('script'); l.type = 'text/javascript'; l.async = true;
+      l.src = 'https://like-waynezhang.rhcloud.com/javascript/widget.js';
+      (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(l);
+    </script>
+    <!-- END this would not work on any other domain -->
     </section>
     <section class="post">
     {{ post.content }}

diff --git a/media/css/style.css b/media/css/style.css
@@ -198,3 +198,15 @@ footer {
 .gist {
   font-size: 13px;
   line-height: 1.6; }
+
+.like-button {
+  font-family: "FontAwesome";
+  padding-right: 5px; }
+
+.unlike-button {
+  font-family: "FontAwesome";
+  padding-right: 5px;
+  color: #999; }
+
+.like-button:hover {
+  color: #dd1144; }
diff --git a/media/css/style.scss b/media/css/style.scss
@@ -96,6 +96,7 @@ article {
   }
 
   .post { img { max-width: #{$page-width}px; display: block; margin: .5em auto; } }
+
   .comment { margin: 3em 0; }
   .divider {
     margin: 2em 0;
@@ -144,3 +145,8 @@ footer {
 
 // gist
 .gist { font-size: 13px; line-height:1.6; }
+
+// like
+.like-button { font-family: "FontAwesome"; padding-right: 5px; }
+.unlike-button { font-family: "FontAwesome"; padding-right: 5px; color: #999; }
+.like-button:hover { color: #dd1144; }