From fbfec0cde1c7f84fe138662345863444e72ac437 Mon Sep 17 00:00:00 2001
From: Eduardo <this.eduardo@gmail.com>
Date: Sun, 14 Apr 2019 20:41:25 +0200
Subject: [PATCH] Code documented

---
 author.hbs                  | 12 +++++++++++-
 default.hbs                 |  4 ++++
 error-404.hbs               |  7 +++++++
 index.hbs                   | 13 ++++++++++++-
 page-authors.hbs            | 10 +++++++++-
 page.hbs                    | 11 ++++++++++-
 partials/footer.hbs         |  4 ++++
 partials/header.hbs         |  4 ++++
 partials/hero.hbs           |  5 +++++
 partials/loop.hbs           |  2 ++
 partials/navigation.hbs     |  5 +++++
 partials/pagination.hbs     |  4 ++++
 partials/search.hbs         |  6 ++++++
 partials/subscribe_form.hbs |  5 +++++
 post.hbs                    | 16 +++++++++++++++-
 subscribe.hbs               |  6 ++++++
 tag.hbs                     | 12 +++++++++++-
 17 files changed, 120 insertions(+), 6 deletions(-)

diff --git a/author.hbs b/author.hbs
index 099dc47..ccd88bd 100644
--- a/author.hbs
+++ b/author.hbs
@@ -1,9 +1,17 @@
+{{!--
+This template is used for the author page.
+--}}
+
+{{!-- The tag below means: insert everything in this file
+into the {body} of the default.hbs template --}}
 {{!< default}}
 
 <div class="main-wrap">
+  {{!-- Everything inside the #author tags pulls data from the author --}}
   {{#author}}
+  {{!--Special header.hbs partial to generate the <header> tag--}}
   {{> header background=cover_image}}
-  
+  {{!-- Inject styles of the hero image to make it responsive --}}
   {{> hero background=cover_image}}
   <div class="m-hero__content" data-aos="fade-down">
     {{#if profile_image}}
@@ -59,9 +67,11 @@
     <div class="l-content">
       <div class="l-wrapper" data-aos="fade-up" data-aos-delay="300">
         <div class="l-grid centered">
+          {{!-- The tag below iterates over all the posts --}}
           {{> "loop"}}
         </div>
       </div>
+      {{!-- Links to Previous/Next posts --}}
       {{pagination}}
     </div>
   </main>
diff --git a/default.hbs b/default.hbs
index ea0b5ef..05fafdc 100644
--- a/default.hbs
+++ b/default.hbs
@@ -13,15 +13,19 @@
     {{!-- Styles'n'Scripts --}}
     <link rel="stylesheet" type="text/css" href="{{asset "css/app.css"}}" media="screen" />
 
+    {{!-- This #block helper will pull data from the hero partial 
+    to inject styles of the hero image to make it responsive --}}
     {{{block "herobackground"}}}
 
     {{!-- This tag outputs SEO meta+structured data and other important settings --}}
     {{ghost_head}}
 
+    {{!-- This variable is used to make the search form work --}}
     <script>
       const ghostHost = "{{@site.url}}"
     </script>
 
+    {{!-- This script loads the Google fornt asynchronously --}}
     <script>
       WebFontConfig = {
         google: { families: ['Source+Sans+Pro:400,600,700'] }
diff --git a/error-404.hbs b/error-404.hbs
index 0a436bb..1e3b847 100644
--- a/error-404.hbs
+++ b/error-404.hbs
@@ -1,5 +1,12 @@
+{{!--
+This error template is used for all 404 errors, which might occur on your site.
+--}}
+
+{{!-- The tag below means: insert everything in this file
+into the {body} of the default.hbs template --}}
 {{!< default}}
 
+{{!--Special header.hbs partial to generate the <header> tag--}}
 {{> header}}
 
 <main class="l-fullscreen">
diff --git a/index.hbs b/index.hbs
index 67fd89a..03e9e55 100644
--- a/index.hbs
+++ b/index.hbs
@@ -1,8 +1,16 @@
+{{!--
+This template is used for the index page.
+It can be used also as the home page or the default page.
+--}}
+
+{{!-- The tag below means: insert everything in this file
+into the {body} of the default.hbs template --}}
 {{!< default}}
 
 <div class="main-wrap">
+  {{!--Special header.hbs partial to generate the <header> tag--}}
   {{> header background=@site.cover_image}}
-  
+  {{!-- Inject styles of the hero image to make it responsive --}}
   {{> hero background=@site.cover_image}}
   <div class="m-hero__content" data-aos="fade-down">
     <h1 class="m-hero-title bigger">{{@site.title}}</h1>
@@ -66,14 +74,17 @@
           </div>
           {{/if}}
           {{/get}}
+          {{!-- The tag below iterates over all the posts --}}
           {{> "loop"}}
         </div>
       </div>
+      {{!-- Links to Previous/Next posts --}}
       {{pagination}}
     </div>
   </main>
 </div>
 
+{{!-- The #contentFor helper here will send everything inside it up to the matching #block helper found in default.hbs --}}
 {{#contentFor "scripts"}}
   <script defer src="{{asset "js/home.js"}}"></script>
 {{/contentFor}}
diff --git a/page-authors.hbs b/page-authors.hbs
index 92d6faf..179feca 100644
--- a/page-authors.hbs
+++ b/page-authors.hbs
@@ -1,9 +1,17 @@
+{{!--
+This template is used for the authors page.
+You must first create a page called Authors in the dashboard to enable it.
+--}}
+
+{{!-- The tag below means: insert everything in this file
+into the {body} of the default.hbs template --}}
 {{!< default}}
 
 {{#post}}
   <div class="main-wrap">
+    {{!--Special header.hbs partial to generate the <header> tag--}}
     {{> header background=feature_image}}
-    
+    {{!-- Inject styles of the hero image to make it responsive --}}
     {{> hero background=feature_image}}
     <div class="m-hero__content" data-aos="fade-down">
       <h1 class="m-hero-title bigger">{{title}}</h1>
diff --git a/page.hbs b/page.hbs
index 8e30a87..c0fb93d 100644
--- a/page.hbs
+++ b/page.hbs
@@ -1,9 +1,17 @@
+{{!--
+This template is used for the posts that are marked as pages.
+--}}
+
+{{!-- The tag below means: insert everything in this file
+into the {body} of the default.hbs template --}}
 {{!< default}}
 
+{{!-- Everything inside the #post tags pulls data from the post --}}
 {{#post}}
   <div class="main-wrap">
+    {{!--Special header.hbs partial to generate the <header> tag--}}
     {{> header background=feature_image}}
-    
+    {{!-- Inject styles of the hero image to make it responsive --}}
     {{> hero background=feature_image}}
     <div class="m-hero__content" data-aos="fade-down">
       <h1 class="m-hero-title bigger">{{title}}</h1>
@@ -28,6 +36,7 @@
   </div>
 {{/post}}
 
+{{!-- The #contentFor helper here will send everything inside it up to the matching #block helper found in default.hbs --}}
 {{#contentFor "scripts"}}
   <script defer src="{{asset "js/page.js"}}"></script>
 {{/contentFor}}
diff --git a/partials/footer.hbs b/partials/footer.hbs
index 95c14f4..7302b59 100644
--- a/partials/footer.hbs
+++ b/partials/footer.hbs
@@ -1,3 +1,7 @@
+{{!--
+This footer template is shared across all the pages.
+--}}
+
 <footer class="m-footer">
   <div class="m-footer__content">
     <p class="m-footer-copyright">
diff --git a/partials/header.hbs b/partials/header.hbs
index 2731d2f..faac863 100644
--- a/partials/header.hbs
+++ b/partials/header.hbs
@@ -1,3 +1,7 @@
+{{!--
+This header template is shared across all the pages.
+--}}
+
 {{#if background}}
   <header class="m-header with-picture js-header">
 {{else}}
diff --git a/partials/hero.hbs b/partials/hero.hbs
index 3bdebe3..7c132f2 100644
--- a/partials/hero.hbs
+++ b/partials/hero.hbs
@@ -1,3 +1,8 @@
+{{!--
+If the template in question has a background image, then we render responsive image styles
+for it, and apply those styles to the <header> tag.
+--}}
+
 {{#if background}}
   {{#contentFor "herobackground"}}
   <style>
diff --git a/partials/loop.hbs b/partials/loop.hbs
index 4e73595..0822781 100644
--- a/partials/loop.hbs
+++ b/partials/loop.hbs
@@ -1,3 +1,5 @@
+{{!-- The template below includes the markup for each post --}}
+
 {{#foreach posts}}
   {{#is "post"}}
     <div class="m-recommended-slider__item">
diff --git a/partials/navigation.hbs b/partials/navigation.hbs
index 2e539b6..80d1244 100644
--- a/partials/navigation.hbs
+++ b/partials/navigation.hbs
@@ -1,3 +1,8 @@
+{{!--
+This navigation template is shared across all the pages.
+Also it includes the big submenu.
+--}}
+
 <ul role="menu">
   {{#if @site.logo}}
   <li class="only-desktop" role="menuitem">
diff --git a/partials/pagination.hbs b/partials/pagination.hbs
index b9fe4f9..e3fa5c3 100644
--- a/partials/pagination.hbs
+++ b/partials/pagination.hbs
@@ -1,3 +1,7 @@
+{{!--
+This pagination template is used to navigate through newer and older articles.
+--}}
+
 <div class="l-wrapper">
   <nav class="m-pagination">
     {{#if prev}}
diff --git a/partials/search.hbs b/partials/search.hbs
index 7ace7a9..009d606 100644
--- a/partials/search.hbs
+++ b/partials/search.hbs
@@ -1,3 +1,9 @@
+{{!--
+This search template is used to display the search form.
+You need to create a custom integration first to get a Content API key and then 
+follow the instructions to enable the search feature.
+--}}
+
 <div class="m-search js-search">
   <button class="m-icon-button outlined as-close-search js-close-search" aria-label="Close search">
     <span class="icon-close"></span>
diff --git a/partials/subscribe_form.hbs b/partials/subscribe_form.hbs
index 580d24d..4b52ea4 100644
--- a/partials/subscribe_form.hbs
+++ b/partials/subscribe_form.hbs
@@ -1,3 +1,8 @@
+{{!--
+This subscribe template is used to display the form where users can subscribe.
+You need to enable the subscription feature first.
+--}}
+
 <form method="post" action="{{action}}" id="{{form_id}}" class="{{form_class}}">
   {{hidden}}
 
diff --git a/post.hbs b/post.hbs
index 5b24c9f..e019dbc 100644
--- a/post.hbs
+++ b/post.hbs
@@ -1,9 +1,17 @@
+{{!--
+This template is used for the post page.
+--}}
+
+{{!-- The tag below means: insert everything in this file
+into the {body} of the default.hbs template --}}
 {{!< default}}
 
 <div class="main-wrap">
+  {{!-- Everything inside the #post tags pulls data from the post --}}
   {{#post}}
+  {{!--Special header.hbs partial to generate the <header> tag--}}
   {{> header background=feature_image}}
-  
+  {{!-- Inject styles of the hero image to make it responsive --}}
   {{> hero background=feature_image}}
   </header>
   {{/post}}
@@ -11,6 +19,7 @@
   <main>
     <article>
       <div class="l-content">
+        {{!-- Everything inside the #post tags pulls data from the post --}}
         {{#post}}
         <div class="l-wrapper in-post js-aos-wrapper" data-aos="fade-up" data-aos-delay="300">
           {{#if @labs.subscribers}}
@@ -49,6 +58,7 @@
             </div>
           </div>
         </div>
+        {{!-- Email subscribe form at the bottom of the page --}}
         {{#if @labs.subscribers}}
         <section class="m-subscribe-section">
           <div class="l-wrapper in-post">
@@ -123,6 +133,7 @@
             </div>
           </div>
         </section>
+        {{!-- If you want to embed comments, this is a good place to do it! --}}
         {{!--
           <section class="m-comments">
             <div class="m-load-comments">
@@ -149,12 +160,14 @@
           </section>
           --}}
         {{/post}}
+        {{!-- Related posts --}}
         {{#get "posts" limit="3" filter="tags:[{{post.tags}}]+id:-{{post.id}}" include="tags,authors" as |related|}}
         <section class="m-recommended">
           <div class="l-wrapper in-recommended">
             <h3 class="m-section-title in-recommended">Recommended for you</h3>
             <div class="m-recommended-articles">
               <div class="m-recommended-slider js-recommended-articles">
+                {{!-- The tag below iterates over all the related posts --}}
                 {{> "loop"}}
               </div>
             </div>
@@ -166,6 +179,7 @@
   </main>
 </div>
 
+{{!-- The #contentFor helper here will send everything inside it up to the matching #block helper found in default.hbs --}}
 {{#contentFor "scripts"}}
   <script defer src="{{asset "js/post.js"}}"></script>
 {{/contentFor}}
diff --git a/subscribe.hbs b/subscribe.hbs
index ba083eb..3a49155 100644
--- a/subscribe.hbs
+++ b/subscribe.hbs
@@ -1,3 +1,9 @@
+{{!--
+This error template is used for the subscription page.
+--}}
+
+{{!-- The tag below means: insert everything in this file
+into the {body} of the default.hbs template --}}
 {{!< default}}
 
 <div class="l-wrapper" data-aos="fade-down">
diff --git a/tag.hbs b/tag.hbs
index 6f44d04..21941d0 100644
--- a/tag.hbs
+++ b/tag.hbs
@@ -1,9 +1,17 @@
+{{!--
+This template is used for the tag page.
+--}}
+
+{{!-- The tag below means: insert everything in this file
+into the {body} of the default.hbs template --}}
 {{!< default}}
 
 <div class="main-wrap">
+  {{!-- Everything inside the #tag tags pulls data from the tag --}}
   {{#tag}}
+  {{!--Special header.hbs partial to generate the <header> tag--}}
   {{> header background=feature_image}}
-  
+  {{!-- Inject styles of the hero image to make it responsive --}}
   {{> hero background=feature_image}}
   <div class="m-hero__content" data-aos="fade-down">
     <h1 class="m-hero-title bigger">{{name}}</h1>
@@ -18,9 +26,11 @@
     <div class="l-content">
       <div class="l-wrapper" data-aos="fade-up" data-aos-delay="300">
         <div class="l-grid centered">
+          {{!-- The tag below iterates over all the posts --}}
           {{> "loop"}}
         </div>
       </div>
+      {{!-- Links to Previous/Next posts --}}
       {{pagination}}
     </div>
   </main>