adding share buttons

yogeshagarwala · May 24, 2020 · e97a586 · e97a586
1 parent 620e38e
commit e97a586
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 2 deletions.
diff --git a/_includes/blog_post_article.html b/_includes/blog_post_article.html
@@ -35,8 +35,9 @@ <h4 class="post-meta">{{ page.summary }}</h4>
     <br />
     <br />
     {{ content }}
+    <br />
+    {%- include share_page.html -%}
   </div>
-
   {%- if site.hyvor_talk_website_id -%}
   <div class="comments">
     {%- include hyvor_comments.html -%}
@@ -45,4 +46,6 @@ <h4 class="post-meta">{{ page.summary }}</h4>
   <!-- Incomment incase you want to use Disqus
       <div id="disqus_thread"></div>
    -->
+
+
 </article>
diff --git a/_includes/head.html b/_includes/head.html
@@ -35,7 +35,7 @@
       {% endif %}
 
       {% if page.image %}
-        <meta content="{{ site.url }}/assets/img/posts/{{ page.image }}" property="og:image">
+        <meta content="{{ site.url }}{{ page.thumbnail }}" property="og:image">
       {% endif %}
 
       {% if page.categories %}

diff --git a/_includes/share_page.html b/_includes/share_page.html
@@ -0,0 +1,6 @@
+<div class="share-page">
+    Share this on &rarr;
+    <a href="https://twitter.com/intent/tweet?text={{ page.title }}&url={{ site.url }}{{ page.url }}&via={{ site.twitter_username }}&related={{ site.twitter_username }}" rel="nofollow" target="_blank" title="Share on Twitter"><i class="fa fa-twitter" aria-hidden="true"></i></a>
+    <a href="https://facebook.com/sharer.php?u={{ site.url }}{{ page.url }}" rel="nofollow" target="_blank" title="Share on Facebook"><i class="fa fa-facebook" aria-hidden="true"></i></a>
+    <a href="https://plus.google.com/share?url={{ site.url }}{{ page.url }}" rel="nofollow" target="_blank" title="Share on Google+"><i class="fa fa-google-plus" aria-hidden="true"></i></a>
+</div>
diff --git a/_sass/devlopr.scss b/_sass/devlopr.scss
@@ -392,6 +392,26 @@ header {
     float:left;
 }
 
+/* Share page buttons */
+.share-page {
+    text-align: center;
+    background: var(--button-background-color);
+    color: #111;
+    padding: 8px 15px;
+    border-radius: 5px;
+    margin: 1.5 * 1 * 0;
+
+    a {
+        font-weight: 700;
+        color: #fff;
+        margin-left: 10px;
+
+        &:hover {
+            border-bottom: 1px dashed #fff;
+        }
+    }
+}
+
 /* floating btn for buy me coffee */
 #bmc-wbtn{
     bottom: 40px !important;