Fixes #75

_includes/js.html

@@ -214,4 +214,44 @@ $(window).scroll(toggleNavCollapse);$(function(){$("a.page-scroll").bind("click"
 
 {% endif %}
 
+{% if page.section-type == "blog" %}
+
+  <!-- Swipe Instructions for Blog Start -->
+
+  <script>
+    $(document).ready(function(){
+      if(!localStorage.getItem('blog-swipeshowed')){
+        $("#swipe-instruction").fadeIn();
+        $("#swipe-instruction .close-swipe-instruction").click(function(){
+          $("#swipe-instruction").fadeOut();
+        });
+        localStorage.setItem('blog-swipeshowed', true);
+      }
+    });
+  </script>
+
+  <!-- Swipe Instructions for Blog End -->
+
+{% endif %}
+
+{% if page.section-type == "post" %}
+
+  <!-- Swipe Instructions for Post Start -->
+
+  <script>
+    $(document).ready(function(){
+      if(!localStorage.getItem('post-swipeshowed')){
+        $("#swipe-instruction").fadeIn();
+        $("#swipe-instruction .close-swipe-instruction").click(function(){
+          $("#swipe-instruction").fadeOut();
+        });
+        localStorage.setItem('post-swipeshowed', true);
+      }
+    });
+  </script>
+
+  <!-- Swipe Instructions for Post End -->
+
+{% endif %}
+
 <!-- Javascript End -->

_includes/navigation.html

@@ -13,7 +13,9 @@
         <a class="navbar-brand" href="{{site.baseurl}}/">
       {% endif %}
           <div>
-            {% if site.black-favicon %}<img src="{{site.baseurl}}{{ site.black-favicon }}" alt="">{% endif %}
+            {% if site.black-favicon %}
+              <img src="{{site.baseurl}}{{ site.black-favicon }}" alt="">
+            {% endif %}
             {{ site.title }}
           </div>
         </a>

_includes/swipe-instructions.html

@@ -0,0 +1,25 @@
+
+<!-- Swipe Instructions Start -->
+
+<div id="swipe-instruction">
+  <div>
+    <p><br><br><br></p>
+    <i id="hand-swipe" class="fa fa-hand-o-up"></i>
+    <p><strong>
+    {% if page.section-type == "blog" %}
+      Did you know that you can navigate the archive pages by swiping left and right?
+    {% elsif page.section-type == "post" %}
+      Did you know that you can navigate the posts by swiping left and right?
+    {% endif %}
+    </strong></p>
+    <button type="button" class="btn btn-default ok-btn close-swipe-instruction">
+      {% if page.section-type == "blog" %}
+        Got it!
+      {% elsif page.section-type == "post" %}
+        Awesome!
+      {% endif %}
+    </button>
+  </div>
+</div>
+
+<!-- Swipe Instructions End -->