added categories taxonomy for blog

config.toml

@@ -1,5 +1,5 @@
 # The URL the site will be built for
-base_url = "https://zola-twcss.vercel.app"
+base_url = "https://ourworld.tf"
 # Change this to your own URL! Please note this variable **must** be uncommented.
 
 title = "Our World"
@@ -51,6 +51,12 @@ external_links_no_referrer = true
 # For example, `...` into `…`, `"quote"` into `“curly”` etc
 smart_punctuation = true
 
+[[taxonomies]]
+name = "categories"
+feed = true
+paginate_by = 2
+paginate_path = "/blog-posts"
+
 [extra]
 # Put all your custom variables here
 

content/blog/2018/10/post-1/index.md

@@ -6,7 +6,8 @@ updated: 2019-04-11T20:33:00-05:00 # Comment-out this line with a # if content i
 draft: false # Make it "true" if you don't want Zola to "publish" yet
 extra:
   subtitle: "The UNIQUE Post 1 subtitle" # Quotation marks allow colons, semicolons, etc.
-  author: Your name goes here
+  author: "Your name goes here"
+  category: "Engineering"
   imgPath: images/threefold_blog2.png
   date: 2018-10-17T14:40:00-05:00
 ---

content/blog/2018/10/post-2/index.md

@@ -7,6 +7,7 @@ draft: false # Make it "true" if you don't want Zola to "publish" yet
 extra:
   subtitle: "The UNIQUE Post 2 subtitle" # Quotation marks allow colons, semicolons, etc.
   author: Your name goes here
+  category: "Engineering"
   imgPath: images/threefold_blog2.png
   date: 2018-10-17T14:40:00-05:00
 ---

content/blog/2019/01/post-3/index.md

@@ -7,6 +7,7 @@ draft: false # Make it "true" if you don't want Zola to "publish" yet
 extra:
   subtitle: "The UNIQUE Post 3 subtitle" # Quotation marks allow colons, semicolons, etc.
   author: Your name goes here
+  category: "Engineering"
   imgPath: images/threefold_blog2.png
   date: 2018-10-17T14:40:00-05:00
 ---
@@ -23,6 +24,6 @@ Text here.
 
 And here is an example of how to use the `imgc` shortcode in `/templates/shortcodes`:
 
-{{ (path="blog//2019/01/post-3/screen-cap-from-Pippin-Williamson-s-page-builders-review.png", alt="Screen capture showing shortcodes from a WordPress page builder", width=986, height=482) }}
+![Image](images/threefold-blog.png)
 
 Closing text. That ends Post 3!

content/blog/2019/03/post-4/index.md

@@ -6,6 +6,7 @@ updated: 2020-01-31T08:13:00-06:00 # Comment-out this line with a # if content i
 extra:
   subtitle: "The UNIQUE Post 4 subtitle" # Quotation marks allow colons, semicolons, etc.
   author: Your name goes here
+  category: "Engineering"
   imgPath: images/threefold_blog2.png
   date: 2018-10-17T14:40:00-05:00
 ---

content/blog/2019/03/post-5/index.md

@@ -7,6 +7,7 @@ draft: false # Make it "true" if you don't want Zola to "publish" yet
 extra:
   subtitle: "The UNIQUE Post 5 subtitle" # Quotation marks allow colons, semicolons, etc.
   author: Your name goes here
+  category: "Engineering"
   imgPath: images/threefold_blog2.png
   date: 2018-10-17T14:40:00-05:00
 ---

content/blog/2019/06/post-6/index.md

@@ -7,6 +7,7 @@ draft: false # Make it "true" if you don't want Zola to "publish" yet
 extra:
   subtitle: "The UNIQUE Post 6 subtitle" # Quotation marks allow colons, semicolons, etc.
   author: Your name goes here
+  category: "Engineering"
   imgPath: images/threefold_blog2.png
   date: 2018-10-17T14:40:00-05:00
 ---

content/blog/2020/02/post-7/index.md

@@ -1,13 +1,15 @@
 ---
-title: "Bridges Connecting the ThreeFold Ecosystem to External Networks " # Quotation marks allow colons, semicolons, etc.
+title: "Bridges Connecting the ThreeFold Ecosystem to External Networks" # Quotation marks allow colons, semicolons, etc.
-description: "The UNIQUE description for Post 7." # Quotation marks allow colons, semicolons, etc.
+description: "Since the launch of ThreeFold Grid 3.0, TFT is now available on three blockchains – Stellar, Binance Smart Chain and the Substrate-based ThreeFold Blockchain (aka TF Chain)." # Quotation marks allow colons, semicolons, etc.
-date: 2020-02-28T21:30:00-06:00
+date: 2018-10-17T14:40:00-05:00
-updated: 2020-04-02T07:23:00-05:00 # Comment-out this line with a # if content is unchanged
+updated: 2019-04-11T20:33:00-05:00 # Comment-out this line with a # if content is unchanged
 draft: false # Make it "true" if you don't want Zola to "publish" yet
+taxonomies:
+  categories: ["Engineering"]
 extra:
-  subtitle: "The UNIQUE Post 7 subtitle" # Quotation marks allow colons, semicolons, etc.
+  subtitle: "The UNIQUE Post 1 subtitle" # Quotation marks allow colons, semicolons, etc.
-  author: Your name goes here
+  author: HANNAH CORDES
-  imgPath: "images/threefold_blog2.png"
+  imgPath: images/sphere-thing.png
   date: 2018-10-17T14:40:00-05:00
 ---
 

content/blog/featured/_index.md

@@ -1,15 +1,20 @@
----
++++
-title: "Bridges Connecting the ThreeFold Ecosystem to External Networks" # Quotation marks allow colons, semicolons, etc.
+title = "Bridges Connecting the ThreeFold Ecosystem to External Networks"
-description: "Since the launch of ThreeFold Grid 3.0, TFT is now available on three blockchains – Stellar, Binance Smart Chain and the Substrate-based ThreeFold Blockchain (aka TF Chain)." # Quotation marks allow colons, semicolons, etc.
+description = "Since the launch of ThreeFold Grid 3.0, TFT is now available on three blockchains – Stellar, Binance Smart Chain and the Substrate-based ThreeFold Blockchain (aka TF Chain)."
-date: 2018-10-17T14:40:00-05:00
+date = 2018-10-17T19:40:00.000Z
-updated: 2019-04-11T20:33:00-05:00 # Comment-out this line with a # if content is unchanged
+updated = 2019-04-12T01:33:00.000Z
-draft: false # Make it "true" if you don't want Zola to "publish" yet
+draft = false
-extra:
+
-  subtitle: "The UNIQUE Post 1 subtitle" # Quotation marks allow colons, semicolons, etc.
+[taxonomies]
-  author: HANNAH CORDES
+categories=["Engineering"]
-  imgPath: images/sphere-thing.png
+
-  date: 2018-10-17T14:40:00-05:00
+[extra]
----
+subtitle = "The UNIQUE Post 1 subtitle"
+author = "HANNAH CORDES"
+imgPath = "images/sphere-thing.png"
+date = 2018-10-17T19:40:00.000Z
+
++++
 
 ![Image](images/threefold-blog.png)
 

templates/blog/blog.html

@@ -9,6 +9,5 @@
     <div class="flex">
         {% include "partials/blogPosts.html" %}
         {% include "partials/blogSidebar.html" %}
-
     </div>
  </main> {% endblock content %}

templates/categories/list.html

@@ -0,0 +1,7 @@
+{% extends "index.html" %}
+
+{% block content %}
+
+<div>yoo</div>
+
+{% endblock content %}

templates/categories/single.html

@@ -0,0 +1,13 @@
+{% extends "index.html" %}
+
+{% block content %}
+
+<main class="pt-16">
+
+    <div class="flex">
+        {% include "partials/blogPosts.html" %}
+        {% include "partials/blogSidebar.html" %}
+    </div>
+ </main> 
+ 
+ {% endblock content %}

templates/index.html

@@ -8,7 +8,7 @@
     {% include "partials/splitRow.html" %}
 
     <!-- Landing page full width vertical image -->
-    <img src="images/threefold_img2.png" alt="">
+    <img src="/images/threefold_img2.png" alt="">
     <br/>
 
     {%- set section = get_section(path="about/community/_index.md") %}

templates/partials/blogPosts.html

@@ -1,40 +1,65 @@
+<script>
+  var category = window.location.pathname.split("/")[1];
+  console.log("logging", category);
+</script>
 
 <div class="font-sans text-center px-0 w-full md:w-2/3 lg:w-2/3 mx-auto">
-    <h1 class="tracking-tight pt-12 lg:pt-24 2xl:pt-32 text-5xl text-left
+  <h1
-    text-5xl fw-500 leading-snug font-normal mb-10">The Latest from ThreeFold
+    class="tracking-tight pt-12 lg:pt-24 2xl:pt-32 text-5xl text-left text-5xl fw-500 leading-snug font-normal mb-10"
+  >
+    The Latest from ThreeFold
   </h1>
   <div>
-      
     <div class="mt-12 grid gap-5 max-w-lg mx-auto lg:grid-cols-3 lg:max-w-none">
       {%- for post in paginator.pages %} 
+        {% if "Engineering" == "Engineering"%}
             {% include "partials/postCard.html" %} 
-
+        {%endif%} {%- endfor %}
-      {%- endfor %}
     </div>
     <hr class="mt-6" />
     <p class="text-center text-sm mt-2 mb-16">
       {% if paginator.previous %}
-          <a class="border-transparent" aria-label="First page" href="{{ paginator.first }}">{% include "partials/svgPrevPageIcon.html" %}{% include "partials/svgPrevPageIcon.html" %}</a>
+      <a
+        class="border-transparent"
+        aria-label="First page"
+        href="{{ paginator.first }}"
+        >{% include "partials/svgPrevPageIcon.html" %}{% include
+        "partials/svgPrevPageIcon.html" %}</a
+      >
       &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
-          <a class="border-transparent" aria-label="Previous page" href="{{ paginator.previous }}">{% include "partials/svgPrevPageIcon.html" %}</a>
+      <a
+        class="border-transparent"
+        aria-label="Previous page"
+        href="{{ paginator.previous }}"
+        >{% include "partials/svgPrevPageIcon.html" %}</a
+      >
       &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {% else %} {%
+      include "partials/svgFirstPageIcon.html" %}{% include
+      "partials/svgFirstPageIcon.html" %}
+      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {% include
+      "partials/svgFirstPageIcon.html" %}
       &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
-        {% else %}
+      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {% endif %} {% if
-          {% include "partials/svgFirstPageIcon.html" %}{% include "partials/svgFirstPageIcon.html" %}
+      paginator.next %}
+      <a
+        class="border-transparent"
+        aria-label="Next page"
+        href="{{ paginator.next }}"
+        >{% include "partials/svgNextPageIcon.html" %}</a
+      >
       &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
-          {% include "partials/svgFirstPageIcon.html" %}
+      <a
-          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+        class="border-transparent"
-          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+        aria-label="Last page"
-        {% endif %}
+        href="{{ paginator.last }}"
-        {% if paginator.next %}
+        >{% include "partials/svgNextPageIcon.html" %}{% include
-          <a class="border-transparent" aria-label="Next page" href="{{ paginator.next }}">{% include "partials/svgNextPageIcon.html" %}</a>
+        "partials/svgNextPageIcon.html" %}</a
-          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+      >
-          <a class="border-transparent" aria-label="Last page" href="{{ paginator.last }}">{% include "partials/svgNextPageIcon.html" %}{% include "partials/svgNextPageIcon.html" %}</a>
+      {% else %} {% include "partials/svgLastPageIcon.html" %}
-        {% else %}
+      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {% include
-          {% include "partials/svgLastPageIcon.html" %}
+      "partials/svgLastPageIcon.html" %}{% include
-          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+      "partials/svgLastPageIcon.html" %} {% endif %}
-          {% include "partials/svgLastPageIcon.html" %}{% include "partials/svgLastPageIcon.html" %}
-        {% endif %}
     </p>
   </div>
-    </div>  
+</div>

templates/partials/featuredBlog.html

@@ -15,7 +15,7 @@
       </div>
 
       <div class="mt-10 -mx-4 relative lg:mt-0 max-w-full">
-        <img class="relative mx-auto max-w-full max-h-80" src={{section.extra.imgPath}} alt="" />
+        <img class="relative mx-auto max-w-full max-h-80" src=/{{section.extra.imgPath}} alt="" />
       </div>
     </div>
 

templates/partials/footer.html

@@ -7,7 +7,7 @@
           <div class="max-w-screen-xl mx-auto py-12 px-4 sm:px-6 lg:py-16 lg:px-8">
             <div class="xl:grid xl:grid-cols-3 xl:gap-8">
               <div class="space-y-8 xl:col-span-1">
-                <img class="h-10" src="https://tailwindui.com/img/logos/v1/workflow-mark-gray-300.svg" alt="Company name" />
+                <img class="h-10" src="/https://tailwindui.com/img/logos/v1/workflow-mark-gray-300.svg" alt="Company name" />
                 <p class="text-gray-500 text-base leading-6">
                   Making the world a better place through constructing elegant hierarchies.
                 </p>

templates/partials/header.html

@@ -31,12 +31,12 @@
 </script>
 
 <body>
-        <div class="z-10 bg-semi-white fixed w-screen">
+        <div class="z-10 bg-white fixed w-screen">
           <div class="relative z-10 shadow">
             <div class="max-w-7xl mx-auto flex justify-between items-center px-4 py-5 sm:px-6 sm:py-4 lg:px-8 md:justify-start md:space-x-10">
               <div>
-                <a href="#" class="flex">
+                <a href="/" class="flex">
-                  <img class="w-20 h-auto sm:w-32" src="images/ourworld_logo.png" alt="Workflow" />
+                  <img class="w-20 h-auto sm:w-32" src="/images/ourworld_logo.png" alt="Workflow" />
                 </a>
               </div>
               <div class="-mr-2 -my-2 md:hidden">
@@ -70,23 +70,12 @@
                   <a href="/blog" class="text-sm leading-6 font-normal text-gray-500 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
                     Community
                   </a>
-                  <a href="/blog" class="text-sm leading-6 font-normal text-gray-500 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
-                    Blog
-                  </a>
                   <a href="/blog" class="text-sm leading-6 font-normal text-gray-500 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
                     Career
                   </a>
-                  <div class="relative">
+                  <a href="/blog" class="text-sm leading-6 font-normal text-gray-500 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
-                    <!-- Item active: "text-gray-900", Item inactive: "text-gray-500" -->
+                    Blog
-                    <button type="button" class="text-gray-500 group inline-flex items-center space-x-2 text-sm leading-6 font-normal hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
+                  </a>
-                      <span>Menu</span>
-                      <!--
-                        Heroicon name: chevron-down
-        
-                        Item active: "text-gray-600", Item inactive: "text-gray-400"
-                      -->
-                    </button>
-                  </div>
                 </nav>
                 <div class="flex items-center space-x-8">
                   <a href="#" class="text-sm leading-6 font-normal text-gray-500 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
@@ -117,7 +106,7 @@
           <div id="learn" class="opacity-0 -translate-y-1 absolute inset-x-0 transform shadow-lg backdrop-blur">
             <div class="bg-semi-white">
               <div class="max-w-7xl mx-auto grid gap-y-6 px-4 py-6 sm:grid-cols-2 sm:gap-8 sm:px-6 sm:py-8 lg:grid-cols-4 lg:px-8 lg:py-12 xl:py-16">
-                <a href="#" class="-m-3 p-3 flex flex-col justify-between space-y-6 rounded-lg transition ease-in-out duration-150">
+                <div href="#" class="-m-3 p-3 flex flex-col justify-between space-y-6 rounded-lg transition ease-in-out duration-150">
                   <div class="space-x-4 flex md:h-full lg:flex-col lg:space-x-0 lg:space-y-4">
                     <div class="flex-shrink-0">
                       <span class="inline-flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
@@ -128,27 +117,27 @@
                       </span>
                     </div>
                     <div class="space-y-2 md:flex-1 md:flex md:flex-col md:justify-between lg:space-y-4">
-                      <div class="space-y-1">
+                      <a href="" class="space-y-1 border-transparent">
                         <p class="text-sm leading-6 font-normal text-gray-900">
                           Analytics
                         </p>
                         <p class="text-sm leading-5 text-gray-500">
                           Get a better understanding of where your traffic is coming from.
                         </p>
-                      </div>
+                    </a>
                     </div>
                     <div class="space-y-2 md:flex-1 md:flex md:flex-col md:justify-between lg:space-y-4">
-                        <div class="space-y-1">
+                        <a href="" class="space-y-1 border-transparent">
                           <p class="text-sm leading-6 font-normal text-gray-900">
                             Analytics
                           </p>
                           <p class="text-sm leading-5 text-gray-500">
                             Get a better understanding of where your traffic is coming from.
                           </p>
-                        </div>
-                      </div>
-                  </div>
                         </a>
+                      </div>
+                  </div>
+                </div>
                 <a href="#" class="-m-3 p-3 flex flex-col justify-between space-y-6 rounded-lg transition ease-in-out duration-150">
                   <div class="space-x-4 flex md:h-full lg:flex-col lg:space-x-0 lg:space-y-4">
                     <div class="flex-shrink-0">
@@ -253,12 +242,7 @@
             <a href="#" class="-m-3 p-3 flex flex-col justify-between space-y-6 rounded-lg transition ease-in-out duration-150">
               <div class="space-x-4 flex md:h-full lg:flex-col lg:space-x-0 lg:space-y-4">
                 <div class="flex-shrink-0">
-                  <span class="inline-flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
+                  <h3>BASICS</h3>
-                    <!-- Heroicon name: chart-bar -->
-                    <svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" />
-                    </svg>
-                  </span>
                 </div>
                 <div class="space-y-2 md:flex-1 md:flex md:flex-col md:justify-between lg:space-y-4">
                   <div class="space-y-1">
@@ -373,7 +357,7 @@
                 <div class="pt-5 pb-6 px-5 space-y-6 sm:space-y-8 sm:pb-8">
                   <div class="flex items-center justify-between">
                     <div>
-                      <img class="h-8 w-auto" src="https://tailwindui.com/img/logos/v1/workflow-mark-on-white.svg" alt="Workflow" />
+                      <img class="h-8 w-auto" src="/https://tailwindui.com/img/logos/v1/workflow-mark-on-white.svg" alt="Workflow" />
                     </div>
                     <div class="-mr-2">
                       <button type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out">

templates/partials/postCard.html

@@ -1,16 +1,11 @@
 <div class="flex flex-col rounded-lg shadow-lg overflow-hidden">
     <div class="flex-shrink-0">
-      <img class="h-48 w-full object-cover" src={{post.extra.imgPath}} alt="" />
+      <img class="h-48 w-full object-cover" src=/{{post.extra.imgPath}} alt="" />
     </div>
     <div class="flex-1 bg-white p-6 flex flex-col justify-between">
       <div class="flex-1">
-        <p class="text-sm leading-5 font-medium text-indigo-600">
-          <a href="#" class="hover:underline">
-            Blog
-          </a>
-        </p>
         <a href={{ post.permalink }} class="block">
-          <h3 class="mt-2 text-xl leading-7 font-semibold text-gray-900">
+          <h3 class="mt-2 text-xl leading-7 font-semibold text-gray-900 text-left not-italic">
             {{ post.title }}
           </h3>
           {% if post.description %}
@@ -23,7 +18,7 @@
       <div class="mt-6 flex items-center">
         <div class="flex-shrink-0">
           <a href="#">
-            <img class="h-10 w-10 rounded-full" src="https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="" />
+            <img class="h-10 w-10 rounded-full" src="/https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="" />
           </a>
         </div>
         <div class="ml-3">

templates/partials/splitRow.html

@@ -16,7 +16,7 @@
       </div>
 
       <div class="mt-10 -mx-4 relative lg:mt-0 max-w-full">
-        <img class="relative mx-auto max-w-full max-h-80 mr-0" src={{section.extra.imgPath}} alt="" />
+        <img class="relative mx-auto max-w-full max-h-80 mr-0" src=/{{section.extra.imgPath}} alt="" />
       </div>
 
     </div>