Tag and pagination support

Bug fix: don’t include js for share buttons if not in the post page.
le4ker · Jul 15, 2015 · b80d292 · b80d292
1 parent ddce0d9
commit b80d292
Show file tree

Hide file tree

Showing 20 changed files with 315 additions and 84 deletions.
diff --git a/_config.yml b/_config.yml
@@ -26,6 +26,9 @@ background-img: "/img/intro-bg.jpg"
 me-img: "/img/me.jpg"
 
 # Blog variables
+paginate: 15
+
+paginate_path: "blog/page:num"
 
 post-preview-words: 128
 
@@ -65,9 +68,9 @@ social:
   - title: "github"
     url: "https://github.com/PanosSakkos"
   - title: "linkedin"
-    url: "https://no.linkedin.com/in/PanosSakkos"
+    url: "http://no.linkedin.com/in/PanosSakkos"
   - title: "youtube"
-    url: "https://youtube.com/c/PanosSakkos"
+    url: "http://youtube.com/c/PanosSakkos"
   - title: "soundcloud"
     url: "https://soundcloud.com/psakkos/"
 

diff --git a/_includes/js.html b/_includes/js.html
@@ -21,47 +21,51 @@
   </script>
 {% endif %}
 
+{% if page.section-type == "post" %}
+
   <!-- Share buttons -->
 
-{% if site.twitter-share %}
-  <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
-{% endif %}
-
-{% if site.fb-share %}
-  <div id="fb-root"></div>
-  <script>(function(d, s, id) {
-  var js, fjs = d.getElementsByTagName(s)[0];
-  if (d.getElementById(id)) return;
-  js = d.createElement(s); js.id = id;
-  js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.3";
-  fjs.parentNode.insertBefore(js, fjs);
-  }(document, 'script', 'facebook-jssdk'));</script>
-{% endif %}
+  {% if site.twitter-share %}
+    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
+  {% endif %}
 
-<!-- Disqus -->
-
-{% if site.disqus-shortname %}
-  <script type="text/javascript">
-  var disqus_shortname = '{{ site.disqus-shortname }}';
-  (function() {
-      var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
-      dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
-      (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
-  })();
-  </script>
+  {% if site.fb-share %}
+    <div id="fb-root"></div>
+    <script>(function(d, s, id) {
+    var js, fjs = d.getElementsByTagName(s)[0];
+    if (d.getElementById(id)) return;
+    js = d.createElement(s); js.id = id;
+    js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.3";
+    fjs.parentNode.insertBefore(js, fjs);
+    }(document, 'script', 'facebook-jssdk'));</script>
+  {% endif %}
+
+  <!-- Disqus -->
+
+  {% if site.disqus-shortname %}
+    <script type="text/javascript">
+    var disqus_shortname = '{{ site.disqus-shortname }}';
+    (function() {
+        var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
+        dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
+        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
+    })();
+    </script>
+
+    <!-- Comments counter -->
 
-  <!-- Comments counter -->
+    <script type="text/javascript">
+    /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
+    var disqus_shortname = '{{ site.disqus-shortname }}'; // required: replace example with your forum shortname
 
-  <script type="text/javascript">
-  /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
-  var disqus_shortname = '{{ site.disqus-shortname }}'; // required: replace example with your forum shortname
+    /* * * DON'T EDIT BELOW THIS LINE * * */
+    (function () {
+    var s = document.createElement('script'); s.async = true;
+    s.type = 'text/javascript';
+    s.src = '//' + disqus_shortname + '.disqus.com/count.js';
+    (document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
+    }());
+    </script>
+  {% endif %}
 
-  /* * * DON'T EDIT BELOW THIS LINE * * */
-  (function () {
-  var s = document.createElement('script'); s.async = true;
-  s.type = 'text/javascript';
-  s.src = '//' + disqus_shortname + '.disqus.com/count.js';
-  (document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
-  }());
-  </script>  
 {% endif %}
diff --git a/_includes/blog.html → _includes/latest-post.html b/_includes/blog.html → _includes/latest-post.html
@@ -14,7 +14,7 @@ <h4> <strong> {{ post.date | date_to_string }} </strong>
 
         {{ post.content | truncatewords: site.post-preview-words | markdownify }}
 
-        <a href="/blog.html"><h4><strong>View more posts</strong></h4></a>
+        <a href="/blog/index.html"><h4><strong>View more posts</strong></h4></a>
 
       </div>
     </div>

diff --git a/_includes/navigation.html b/_includes/navigation.html
@@ -5,7 +5,7 @@
             <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-main-collapse">
                 <i class="fa fa-bars"></i>
             </button>
-            {% if page.name == "index.html" %}
+            {% if page.section-type == "index" %}
               <a class="navbar-brand page-scroll" href="#page-top">
             {% else %}
               <a class="navbar-brand page-scroll" href="/index.html#page-top">
@@ -20,32 +20,37 @@
                 <li class="hidden">
                     <a href="#page-top"></a>
                 </li>
-                {% for p in site.pages_list %}
-                  {% if page.name == "index.html" %}
-                    <!-- Go to section for each page in index -->
+                {% if page.section-type == "index" %}
+
+                  <!-- Scroll to section for each page in index -->
+                  {% for p in site.pages_list %}
                     <li>
                       <a class="page-scroll" href="#{{ p[1] }}"> {{ p[0] }} </a>
                     </li>
-                  {% else %}
-                    {% if page.name == 'blog.html' and p[0] == "Blog" %}
+                  {% endfor %}
+
+                {% else %}
+                  <!-- Blog, Post, Tag pages-->
+                  {% for p in site.pages_list %}
+                    {% if page.section-type == "blog" and p[0] == "Blog" %}
                       <!-- Blog button in blog.html doesn't refresh the page -->
                       <li>
                         <a class="page-scroll" href="#blog"> {{ p[0] }} </a>
                       </li>
                     {% elsif p[0] == "Blog" %}
                       <li>
-                        <a class="page-scroll" href="/blog.html"> {{ p[0] }} </a>
+                        <a class="page-scroll" href="/blog/index.html"> {{ p[0] }} </a>
                       </li>
                     {% else %}
                       <li>
                         <a class="page-scroll" href="/index.html#{{ p[1] }}"> {{ p[0] }} </a>
                       </li>
                     {% endif %}
-                  {% endif %}
-                {% endfor %}
+                  {% endfor %}
+
+                {% endif %}
+
             </ul>
         </div>
-        <!-- /.navbar-collapse -->
     </div>
-    <!-- /.container -->
 </nav>
diff --git a/_layouts/blog.html b/_layouts/blog.html
@@ -11,20 +11,38 @@
     <div class="row">
       <div class="col-lg-8 col-lg-offset-2">
 
-	{{ page.content | markdownify }}
+      {{ page.content | markdownify }}
 
-	{% for post in site.posts %}
-	  <h4 align="left"><strong>{{ post.date | date_to_string }}</strong> <small>. {{ post.category }} .</small> <a href="{{ post.url }}"> <strong>{{ post.title }} </a> </strong> <small><a href="{{ post.url }}#disqus_thread">Comments</a></small></h4>
-        {% endfor %}
+      {% for post in paginator.posts %}
+        <h4 align="left"><strong>{{ post.date | date_to_string }}</strong> <small>. {{ post.category }} .</small> <a href="{{ post.url }}"> <strong>{{ post.title }} </strong> </a> <small><a href="{{ post.url }}#disqus_thread">Comments</a></small></h4>
+      {% endfor %}
 
+      <!-- Pagination links -->
+      <div class="pagination">
+
+        {% if paginator.previous_page and paginator.next_page%}
+          <h4>
+              <a href="{{ paginator.previous_page_path }}" class="previous">Newer Posts</a>  <a href="{{ paginator.next_page_path }}" class="next">Older Posts</a>
+          </h4>
+        {% endif %}
+
+        {% if paginator.previous_page %}
+          <h4><a href="{{ paginator.previous_page_path }}" class="previous">Newer Posts</a></h4>
+        {% endif %}
+
+        {% if paginator.next_page %}
+          <h4><a href="{{ paginator.next_page_path }}" class="next">Older Posts</a></h4>
+        {% endif %}
+
+        </div>
       </div>
     </div>
   </section>
 
   <section id="{{ page.title }}" class="container content-section text-center">
     <div class="row">
       <div class="col-lg-8 col-lg-offset-2">
-	{% include social-buttons.html %}
+	       {% include social-buttons.html %}
       </div>
     </div>
   </section>

diff --git a/_layouts/index.html b/_layouts/index.html
@@ -10,14 +10,14 @@
   {% include header.html %}
 
   {% for page in site.pages %}
-  
+
     {% if page.section-type == "about" %}
 
       {% include about.html %}
 
-    {% elsif page.section-type == "blog" %}
+    {% elsif page.section-type == "latest-post" %}
 
-      {% include blog.html %}
+      {% include latest-post.html %}
 
     {% elsif page.section-type == "career" %}
 

diff --git a/_layouts/post.html b/_layouts/post.html
@@ -15,7 +15,7 @@ <h1><strong>{{ page.title }}</strong></h1>
       	<h4><strong>{{ page.date | date_to_string }}</strong>
           <small> . {{ page.category }} . <a href="{{ page.url }}#disqus_thread">Comments</a><p/>
           {% for tag in page.tags %}
-            <a href="/tags/{{tag}}.html">#{{ tag }}</a>
+            <a href="/tags/{{ tag }}.html">#{{ tag }}</a>
           {% endfor %}
           </small>
         </h4>

diff --git a/_layouts/tag.html b/_layouts/tag.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+
+  {% include head.html %}
+
+  <body id="page-top" data-spy="scroll" data-target=".navbar-fixed-top">
+
+  {% include navigation.html %}
+
+  <section id="{{ page.title }}" class="container content-section text-center">
+    <div class="row">
+      <div class="col-lg-8 col-lg-offset-2">
+
+        <div id="archives">
+          <div>
+            {% assign tag = page.title %}
+            <h3 id="#{{ tag }}">#{{ tag }}</h3>
+            {% for post in site.posts %}
+              {% if post.tags contains tag %}
+                <h4 align="left"><strong>{{ post.date | date_to_string }}</strong> <small>. {{ post.category }} .</small> <a href="{{ post.url }}"> <strong>{{ post.title }} </a> </strong> <small><a href="{{ site.url }}{{post.url }}#disqus_thread">Comments</a></small></h4>
+              {% endif %}
+            {% endfor %}
+            </div>
+        </div>
+
+      </div>
+    </div>
+  </section>
+
+  <section id="{{ page.title }}" class="container content-section text-center">
+    <div class="row">
+      <div class="col-lg-8 col-lg-offset-2">
+	{% include social-buttons.html %}
+      </div>
+    </div>
+  </section>
+
+  {% include footer.html %}
+
+  {% include js.html %}
+
+</body>
+</html>
-Original file line number
+Diff line change
@@ Expand Up / @@ -14,7 +14,7 @@ <h4> <strong> {{ post.date | date_to_string }} </strong> @@
             {{ post.content | truncatewords: site.post-preview-words | markdownify }}
-            <a href="/blog.html"><h4><strong>View more posts</strong></h4></a>
+            <a href="/blog/index.html"><h4><strong>View more posts</strong></h4></a>
           </div>
         </div>
@@ Expand Down @@