social bar

6 files changed, 121 insertions, 63 deletions

diff --git a/README.md b/README.md
index d1bcbb6..319ec8f 100644
--- a/README.md
+++ b/README.md
@@ -24,11 +24,17 @@ So I made this simple one.
 
  - W3.css - small and fast
  - Responsive
- - W3 code color js - small and fast code highlight solution. Less than half of highlights.js. [Demo Here](https://jesselau.com/start-blogging-today/)
+ - W3 code color js - small and fast code highlight solution. The file size is less than half of highlights.js. [Demo Here](https://jesselau.com/start-blogging-today/)
+ - Facebook Open Graph
+ - Twitter Card
+ - Google Analytics
+ - Disqus
+ - One Signal Push
+ - Social share & Bookmark bar
  
 
 ## Install:
- ```
+ ```bash
  cd themes
  git clone https://github.com/jesselau76/hugo-w3-simple.git
  ```
@@ -37,7 +43,7 @@ So I made this simple one.
  It is very simple. You can edit the example **config. toml** file below
  
 
-```
+```bash
 baseurl = "/"
 languageCode = "en-us"
 title = "Jesse Lau Blog"
@@ -57,15 +63,15 @@ googleAnalytics = "UA-12345678-1"      # UA-XXXXXXXX-X
     name = "Tags"
     url = "/tags/"
     weight = 4
-[[menu.main]]
-    name = "Subscribe"
-    url = "/index.xml"
+
 
 [params]
     relatedPosts = true
+    socialshare = true
     description = "Jesse Lau Blog"
-    logotext = "JESSE LAU BLOG"  # Logo text 
-    footer = "© [Jesse Lau](https://jesselau.com) 2018 | [Github](https://github.com/jesselau76) | [Twitter](https://twitter.com/jesselau2)"
+    onesignalid = "xxxxx-xxxx-xxxx-xxxx-xxxxxxxxxx"  #one signal push app id
+    logotext = "JESSE LAU BLOG" # logo text
+    footer = "© [Jesse Lau](https://jesselau.com) 2018 | [Github](https://github.com/jesselau76) | [Twitter](https://twitter.com/jesselau2)  | [RSS](/index.xml)"
 ```
 
 ## Hugo is really fast
@@ -75,3 +81,4 @@ googleAnalytics = "UA-12345678-1"      # UA-XXXXXXXX-X
  ![wordpress](https://raw.githubusercontent.com/jesselau76/hugo-w3-simple/master/webpagetest-without-cache.png)Load Times **7.450s**
  And here is the new test with same page:
  ![hugo](https://raw.githubusercontent.com/jesselau76/hugo-w3-simple/master/webpagetest-hugo.png)The load times is **1.962s** now!
+
diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index 374e2d7..66f2ef6 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -38,6 +38,8 @@
 
     
   </div>
-  {{ partial "scripts.html" . }}
+{{ if .Site.Params.socialshare }}
+  {{ partial "socialshare.html" . }}
+{{ end }}
 </body>
 </html>
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index 3e42781..f7c22b9 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -2,7 +2,7 @@
   <div class="w3-container w3-center w3-padding-32 w3-hide-small"> 
       <h1 class="w3-xxxlarge w3-text-blue w3-wide w3-allerta" style="text-shadow:1px 1px 0 #444" ><u>
       {{ with .Site.Params.logotext }}
-         {{ . | markdownify }}
+         {{ . }}
       {{ else }}
           W3 SIMPLE
       {{ end }}
diff --git a/layouts/partials/scripts.html b/layouts/partials/scripts.html
index 14690fb..2df10b8 100644
--- a/layouts/partials/scripts.html
+++ b/layouts/partials/scripts.html
@@ -5,13 +5,28 @@
   </script>
 <div class="icon-bar">
 <script>
-document.write( '<a href="http://www.facebook.com/sharer.php?u='+shareurl+'" onclick="window.open(this.href, \'mywin\',\'left=20,top=20,width=500,height=500,toolbar=1,resizable=0\'); return false;" class="facebook"><i class="fa fa-facebook"></i></a> ');
+document.write( '<a href="javascript:bookmark();" class="bookmark w3-tooltip"><i class="fa fa-bookmark"></i><span style="position:absolute;left:40px;bottom:18px" class="w3-text w3-small w3-tag w3-round w3-green ">Bookmark this page</span></a> ');
+	
+document.write( '<a href="http://www.facebook.com/sharer.php?u='+shareurl+'" onclick="window.open(this.href, \'mywin\',\'left=20,top=20,width=500,height=500,toolbar=1,resizable=0\'); return false;" class="facebook w3-tooltip"><i class="fa fa-facebook "></i><span style="position:absolute;left:40px;bottom:18px" class="w3-text w3-small w3-tag w3-round w3-green">Share to Facebook</span></a> ');
 
-document.write( '<a href="https://twitter.com/share?url='+shareurl+'&amp;text='+sharetitle+'" onclick="window.open(this.href, \'mywin\',\'left=20,top=20,width=500,height=500,toolbar=1,resizable=0\'); return false;" class="twitter"><i class="fa fa-twitter"></i></a> ');
-document.write( '<a href="https://plus.google.com/share?url='+shareurl+'" onclick="window.open(this.href, \'mywin\',\'left=20,top=20,width=500,height=500,toolbar=1,resizable=0\'); return false;" class="google"><i class="fa fa-google"></i></a>');
+document.write( '<a href="https://twitter.com/share?url='+shareurl+'&amp;text='+sharetitle+'" onclick="window.open(this.href, \'mywin\',\'left=20,top=20,width=500,height=500,toolbar=1,resizable=0\'); return false;" class="twitter w3-tooltip"><i class="fa fa-twitter"></i><span style="position:absolute;left:40px;bottom:18px" class="w3-text w3-small w3-tag w3-round w3-green">Share to Facebook</span></a> ');
+document.write( '<a href="https://plus.google.com/share?url='+shareurl+'" onclick="window.open(this.href, \'mywin\',\'left=20,top=20,width=500,height=500,toolbar=1,resizable=0\'); return false;" class="google w3-tooltip"><i class="fa fa-google"></i><span style="position:absolute;left:40px;bottom:18px" class="w3-text w3-small w3-tag w3-round w3-green">Share to Facebook</span></a>');
 
-document.write( '<a href="http://www.linkedin.com/shareArticle?mini=true&amp;url='+shareurl+'" onclick="window.open(this.href, \'mywin\',\'left=20,top=20,width=500,height=500,toolbar=1,resizable=0\'); return false;" class="linkedin"><i class="fa fa-linkedin"></i></a>');
+document.write( '<a href="http://www.linkedin.com/shareArticle?mini=true&amp;url='+shareurl+'" onclick="window.open(this.href, \'mywin\',\'left=20,top=20,width=500,height=500,toolbar=1,resizable=0\'); return false;" class="linkedin w3-tooltip"><i class="fa fa-linkedin"></i><span style="position:absolute;left:40px;bottom:18px" class="w3-text w3-small w3-tag w3-round w3-green">Share to Facebook</span></a>');
 
 </script>
 
+<script>
+function bookmark(){
+// Mozilla Firefox Bookmark
+if ('sidebar' in window && 'addPanel' in window.sidebar) { 
+                window.sidebar.addPanel(location.href,document.title,"");
+            } else if( /*@cc_on!@*/false) { // IE Favorite
+                window.external.AddFavorite(location.href,document.title); 
+            } else { // webkit - safari/chrome
+                alert('Press ' + (navigator.userAgent.toLowerCase().indexOf('mac') != - 1 ? 'Command/Cmd' : 'CTRL') + ' + D to bookmark this page.');
+            }
+        }
+
+</script>
 </div>
\ No newline at end of file
diff --git a/layouts/partials/socialshare.html b/layouts/partials/socialshare.html
new file mode 100644
index 0000000..aa02ead
--- /dev/null
+++ b/layouts/partials/socialshare.html
@@ -0,0 +1,32 @@
+<script>
+  shareurl=encodeURIComponent(location.protocol + '//' + location.host + location.pathname);
+  sharetitle=encodeURIComponent(document.title);
+    
+  </script>
+<div class="icon-bar">
+<script>
+document.write( '<a href="javascript:bookmark();" class="bookmark w3-tooltip"><i class="fa fa-bookmark"></i><span style="position:absolute;left:40px;bottom:18px" class="w3-text w3-small w3-tag w3-round w3-green ">Bookmark this page</span></a> ');
+
+document.write( '<a href="http://www.facebook.com/sharer.php?u='+shareurl+'" onclick="window.open(this.href, \'mywin\',\'left=20,top=20,width=500,height=500,toolbar=1,resizable=0\'); return false;" class="facebook w3-tooltip"><i class="fa fa-facebook "></i><span style="position:absolute;left:40px;bottom:18px" class="w3-text w3-small w3-tag w3-round w3-green">Share to Facebook</span></a> ');
+
+document.write( '<a href="https://twitter.com/share?url='+shareurl+'&amp;text='+sharetitle+'" onclick="window.open(this.href, \'mywin\',\'left=20,top=20,width=500,height=500,toolbar=1,resizable=0\'); return false;" class="twitter w3-tooltip"><i class="fa fa-twitter"></i><span style="position:absolute;left:40px;bottom:18px" class="w3-text w3-small w3-tag w3-round w3-green">Share to Twitter</span></a> ');
+document.write( '<a href="https://plus.google.com/share?url='+shareurl+'" onclick="window.open(this.href, \'mywin\',\'left=20,top=20,width=500,height=500,toolbar=1,resizable=0\'); return false;" class="google w3-tooltip"><i class="fa fa-google"></i><span style="position:absolute;left:40px;bottom:18px" class="w3-text w3-small w3-tag w3-round w3-green">Share to Google Plus</span></a>');
+
+document.write( '<a href="http://www.linkedin.com/shareArticle?mini=true&amp;url='+shareurl+'" onclick="window.open(this.href, \'mywin\',\'left=20,top=20,width=500,height=500,toolbar=1,resizable=0\'); return false;" class="linkedin w3-tooltip"><i class="fa fa-linkedin"></i><span style="position:absolute;left:40px;bottom:18px" class="w3-text w3-small w3-tag w3-round w3-green">Share to Linkedin</span></a>');
+
+</script>
+
+<script>
+function bookmark(){
+// Mozilla Firefox Bookmark
+if ('sidebar' in window && 'addPanel' in window.sidebar) { 
+                window.sidebar.addPanel(location.href,document.title,"");
+            } else if( /*@cc_on!@*/false) { // IE Favorite
+                window.external.AddFavorite(location.href,document.title); 
+            } else { // webkit - safari/chrome
+                alert('Press ' + (navigator.userAgent.toLowerCase().indexOf('mac') != - 1 ? 'Command/Cmd' : 'CTRL') + ' + D to bookmark this page.');
+            }
+        }
+
+</script>
+</div>
\ No newline at end of file
diff --git a/static/css/style.css b/static/css/style.css
index 2111111..75b9c76 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -66,62 +66,64 @@ blockquote p {
   
 }
 
-.pdfobject-container {
-  width: 100%;
-  max-width: 1000px;
-  height: 800px;
-  margin: 2em 0;
-}
+{{ if .Site.Params.socialshare }}
+
+  @media screen and (min-width: 1024px)
+  {
+  .icon-bar {
+    position: fixed;
+    top: 50%;
+    -webkit-transform: translateY(-50%);
+    -ms-transform: translateY(-50%);
+    transform: translateY(-50%);
+  }
+  }
+  @media screen and (max-width: 1023px) {
+  .icon-bar {
+    position: relative;
+    
+  }
+  }
 
-.pdfobject { border: solid 1px #666; }
+  .icon-bar a {
+  display: block;
+  text-align: center;
+  padding: 16px;
+  transition: all 0.3s ease;
+  color: white;
+  font-size: 20px;
+  }
 
+  .icon-bar a:hover {
+  background-color: #000;
+  }
 
-@media screen and (min-width: 1024px)
-{
-.icon-bar {
-  position: fixed;
-  top: 50%;
-  -webkit-transform: translateY(-50%);
-  -ms-transform: translateY(-50%);
-  transform: translateY(-50%);
-}
-}
-@media screen and (max-width: 1023px) {
-.icon-bar {
-  position: relative;
-  
-}
+  .bookmark {
+  background: #bb0000;
+  color: white;
+  -webkit-border-radius: 12px 12px 0 0;
 }
 
-.icon-bar a {
-display: block;
-text-align: center;
-padding: 16px;
-transition: all 0.3s ease;
-color: white;
-font-size: 20px;
-}
 
-.icon-bar a:hover {
-background-color: #000;
-}
+  .facebook {
+  background: #3B5998;
+  color: white;
+  }
 
-.facebook {
-background: #3B5998;
-color: white;
-}
+  .twitter {
+  background: #55ACEE;
+  color: white;
+  }
 
-.twitter {
-background: #55ACEE;
-color: white;
-}
+  .google {
+  background: #dd4b39;
+  color: white;
+  }
 
-.google {
-background: #dd4b39;
-color: white;
-}
+  .linkedin {
+  background: #007bb5;
+  color: white;
+  -webkit-border-radius: 0 0 12px 12px;
+  }
 
-.linkedin {
-background: #007bb5;
-color: white;
-}
\ No newline at end of file
+  {{ end }}
\ No newline at end of file