automated featured blog display

content/_index.md

@@ -6,7 +6,7 @@ updated: 2021-02-20T14:40:00-06:00
 draft: false
 extra:
   author: Your name here
-  imgPath: images/threefold_globe.png
+  imgPath: /images/threefold_globe.png
   #subtitle:
 ---
 

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

@@ -3,6 +3,7 @@ title: "Post 4 with its UNIQUE title" # Quotation marks allow colons, semicolons
 description: "The UNIQUE description for Post 4." # Quotation marks allow colons, semicolons, etc.
 date: 2019-03-02T10:00:00-06:00
 updated: 2020-01-31T08:13:00-06:00 # Comment-out this line with a # if content is unchanged
+template: blogPage.html
 extra:
   subtitle: "The UNIQUE Post 4 subtitle" # Quotation marks allow colons, semicolons, etc.
   author: Your name goes here

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

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

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

@@ -1,7 +1,7 @@
 ---
 title: "Bridges Connecting the ThreeFold Ecosystem to External Networks" # 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: 2018-10-17T14:40:00-05:00
+date: 2021-10-17T14:40:00-05:00
 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
 template: blogPage.html
@@ -11,7 +11,7 @@ extra:
   subtitle: "The UNIQUE Post 1 subtitle" # Quotation marks allow colons, semicolons, etc.
   author: HANNAH CORDES
   imgPath: images/ourworld_mycellium.png
-  date: 2018-10-17T14:40:00-05:00
+  isFeatured: "true"
 ---
 
 ## In-article heading --- it's an H2 because your title is the H1

content/blog/featured/_index.md

@@ -1,20 +1,21 @@
-+++
+---
-title = "Bridges Connecting the ThreeFold Ecosystem to External Networks"
+title: Bridges Connecting the ThreeFold Ecosystem to External Networks
-description = "Sinces 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)."
+description: Sinces the launch of ThreeFold Grid 3.0, TFT is now available on
-date = 2018-10-17T19:40:00.000Z
+  three blockchains – Stellar, Binance Smart Chain and the Substrate-based
-updated = 2019-04-12T01:33:00.000Z
+  ThreeFold Blockchain (aka TF Chain).
-draft = false
+date: 2021-10-17T19:40:00.000Z
-
+updated: 2022-02-12T01:33:00.000Z
-[taxonomies]
+draft: false
-categories=["Engineering"]
+taxonomies:
-
+  categories:
-[extra]
+    - Engineering
-subtitle = "The UNIQUE Post 1 subtitles"
+extra:
-author = "HANNAH CORDES"
+  subtitle: The UNIQUE Post 1 subtitles
-imgPath = "images/ourworld_mycellium.png"
+  author: HANNAH CORDES
-date = 2018-10-17T19:40:00.000Z
+  imgPath: /images/ourworld_mycellium.png
-
+  date: 2018-10-17T19:40:00.000Z
-+++
+  isFeatured: "true"
+---
 
 ![Image](images/threefold-blog.png)
 

templates/blog/blog.html

@@ -1,9 +1,24 @@
 {% extends "_default/base.html" %}
+<!-- blog template
+the template for displaying the blog page.
+consists of a featured blog row, 
+a paginated list of posts (sorted by date), 
+and a side nav for category and featured post navigation
+-->
 
 {% block content %}
 
 <main class="pt-16">
-    {%- set section = get_section(path="blog/featured/_index.md") %}
+
+    <!--sets global featured variable as the most recent post with the isFeatured tag-->
+    {%- set section = get_section(path="blog/_index.md") %}
+    {% for page in section.pages %}
+    {% if page.extra.isFeatured %}
+        {%- set_global featured = page %}
+        {% break %}
+    {% endif %}
+    {% endfor %}
+    
     {% include "partials/featuredBlog.html" %}
 
     <div class="flex">

templates/blogPage.html

@@ -2,11 +2,13 @@
 {% block content %}
 
 <!-- Default page template for blog posts and basic informative markdown files -->
+<main class="pt-16">
+
 <div class="sm:w-5/6 md:w-4/5 mr-auto ml-auto px-6 lg:px-16 xl:w-11/12">
-<img src="/images/threefold_blog.png" alt="">
+<img class="max-h-60 sm:max-h-60 md:max-h-80 lg:max-h-96 mx-auto" src={{"/" ~ page.extra.imgPath}} alt="">
 <div>
     <article class="article lg:w-7/12 mx-auto">
-    <h1 class="tracking-tight pt-12 lg:pt-12 2xl:pt-32 text-5xl text-left
+    <h1 class="tracking-tight pt-8 lg:pt-8 2xl:pt-24 text-5xl text-left
     text-5xl fw-500 leading-snug font-normal mb-10">
         {{ page.title }} 
     </h1>
@@ -17,5 +19,6 @@
     </article>
 </div>
 </div>
+</main>
 
 {% endblock content %}

templates/partials/blogSidebar.html

@@ -3,16 +3,25 @@
     <div class="lg:pt-24 flex flex-col mb-12 mr-24">
         <h4 class="text-base not-italic font-medium leading-6 text-gray-600 mb-6"> FILTER POSTS BY</h4>
         <a class="mb-3" href="/blog">All</a>
-        <a class="mb-3" href="/categories/engineering">Engineering</a>
+        {% set taxonomy = get_taxonomy(kind="categories") %}
-        <a class="mb-3" href="/categories/community">Community</a>
+        {% set categories = taxonomy.items %}
-        <a class="mb-3" href="/categories/use-cases">Use Cases</a>
+        {% for category in categories %}
+            {% set path = category.name | slugify %}
+            {% set fullpath = "/categories/" ~ path %}
+            <a class="mb-3" href={{fullpath}}> {{category.name}} </a>
+        {% endfor %}
     </div>
 
+{% set section = get_section(path="blog/_index.md")%}
+
     <div class="lg:pt-6 flex flex-col mb-12 w-64 mr-24">
-        <h4 class="text-base not-italic font-medium leading-6 text-gray-600 mb-6"> POPULAR POSTS</h4>
+        <h4 class="text-base not-italic font-medium leading-6 text-gray-600 mb-6"> FEATURED POSTS</h4>
-        <a class="mb-3 text-blue-700" href="">NEAR Launches Nightshade Sharding, Paving the Way for Mass Adoption</a>
+
-        <a class="mb-3" href="/categories/engineering">Engineering</a>
+        {% for page in section.pages %}
-        <a class="mb-3" href="/categories/community">Community</a>
+        {% if page.extra.isFeatured %}
-        <a class="mb-3" href="">Use Cases</a>
+            <a class="mb-3 text-blue-700" href={{page.permalink}}>{{ page.title }}</a>
+        {% endif %}
+        {% endfor %}
+        
     </div>
 </div>

templates/partials/featuredBlog.html

@@ -3,19 +3,21 @@
     <div class="relative mt-12 lg:mt-16 lg:grid lg:grid-cols-2 lg:gap-8 lg:items-center">
       <div class="relative mx-24">
         <h3 class="text-base not-italic leading-6 text-gray-600">FEATURED POST</h3>
+        <a href={{featured.permalink}} class="">
             <h1 class="text-5xl fw-500 leading-snug font-normal mb-10">
-            {{ section.title }}
+                {{ featured.title }}
-
             </h1>
+        </a>
+        
         <h4 class="text-sm not-italic font-light leading-6 text-gray-600"> 
-            {{ section.extra.date | date(format="%B %e, %Y", timezone="America/Chicago")}} - 
+            {{ featured.date | date(format="%B %e, %Y", timezone="America/Chicago")}} - 
-            {{ section.extra.author }}
+            {{ featured.extra.author }}
         </h4>
             
       </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=/{{featured.extra.imgPath}} alt="" />
       </div>
     </div>