blog

config.yaml

@@ -2,6 +2,11 @@ baseURL: "https://hugo-profile.netlify.app/"
 languageCode: "en-us"
 title: "Hugo-profile"
 
+Paginate: 3
+
+taxonomies:
+  tag: "tags"
+  category: "categories"
 
 params:
   favicon: "/images/hugo.png"
@@ -13,7 +18,7 @@ params:
   # Navbar Menus
   customMenus:
   - name: "Blog"
-    url: "blog"
+    Url: "blog"
     
   # Home
   name: "Gurusabarish"

examplesite/config.yaml

@@ -3,6 +3,12 @@ languageCode: "en-us"
 title: "Hugo-profile"
 theme: "hugo-profile"
 
+Paginate: 3
+
+taxonomies:
+  tag: "tags"
+  category: "categories"
+
 params:
   favicon: "/images/hugo.png"
   description: "Portfolio and personal blog of gurusabarish"
@@ -10,11 +16,10 @@ params:
   disqus: ""
   contact: "false"
 
-  
   # Navbar Menus
   customMenus:
   - name: "Blog"
-    url: "blog"
+    Url: "blog"
     
   # Home
   name: "Gurusabarish"
@@ -79,3 +84,5 @@ params:
 Author:
   name: "Gurusabarish"
   website: "https://github.com/gurusabarish"
+  name: "Gurusabarish"
+  website: "https://github.com/gurusabarish"

layouts/_default/baseof.html

@@ -16,6 +16,7 @@
   {{- block "main" . -}}{{- end }}
   {{- partial "footer.html" . -}}
   {{- partial "scripts.html" . -}}
+
 </body>
 
 </html>

layouts/_default/list.html

@@ -1,26 +1,41 @@
 {{ define "main" }}
-<section>
+<section class="bg-light">
-  {{ range .Pages }}
+  <div class="container-fluid">
-  <br>
+
-  <div class="container">
+    <div class="row justify-content-center pt-3">
-    <div class="row justify-content-md-center">
+      <div class="col-lg-7 col-md-7">
-      <div class="col-md-8">
+        <div class=" mb-4 pt-3">
-        <div class="img-pre">
+          <div class="card shadow ">
-          <a class="text-decoration-none" href="{{ .Permalink }}">
+            <h5 class="card-header bg-warning">Tags</h5>
-            <img class="img-fluid" alt="{{ .Title }}" src="{{ .Params.bg_image }}">
+            <div class=" card-body">
+              {{range $name, $taxonomy := .Site.Taxonomies.tags}} {{ $cnt := .Count }}
+              {{ with $.Site.GetPage (printf "/tags/%s" $name) }}
+              <a href="{{ .RelPermalink }}" class="btn btn-warning rounded-pill mb-2">{{$name}}</a>
+              {{end}}
+              {{end}}
             </div>
-        <div>
-          <h2 class="item-title">
-            {{ .Title }}
-          </h2>
-          <!--{{ if .Params.subtitle }}
-            <h4 class="item-subtitle text-muted">
-              {{ .Params.subtitle }}
-            </h4>
-            {{ end }}-->
             </a>
           </div>
+        </div>
+      </div>
+    </div>
 
+    <div class="row pt-3 justify-content-center">
+      <div class="col-lg-6 col-md-6">
+        {{ range .Paginator.Pages }}
+        <div class=" mb-4">
+          <div class="card border-bottom-primary shadow pb-2">
+            <h5 class="card-header">
+              {{ if .Params.tags }}
+              {{ range .Params.tags }}
+              <a href="{{ "/tags/" | relLangURL }}{{ . | urlize }}" class="btn btn-info btn-rounded mb-2">{{  . }}</a>
+              {{ end }}
+              {{ end }}
+            </h5>
+
+            <a class="text-decoration-none" href="{{ .Permalink }}">
+              <div class="card-body">
+                <div class="text-xs font-weight-bold text-primary text-uppercase mb-1">{{ .Title }}</div>
                 <div class="text-muted">
                   <svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-calendar" fill="currentColor"
                     xmlns="http://www.w3.org/2000/svg">
@@ -34,32 +49,23 @@
                   {{ if .Params.author }}
                   <svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-person-fill" fill="currentColor"
                     xmlns="http://www.w3.org/2000/svg">
-            <path fill-rule="evenodd" d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6z" />
+                    <path fill-rule="evenodd"
+                      d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6z" />
                   </svg>
                   {{ .Params.author }}
                   {{ end }}
                 </div>
-
+              </div>
-        <div>
-          {{truncate 200 .Summary}}
-          <a class="text-decoration-none" href="{{ .Permalink }}">
-            <button type="button" class="float-right btn btn-outline-primary read-more">Read more</button>
             </a>
           </div>
+        </div>
+        {{ end }}
+        {{ template "_internal/pagination.html" . }}
+      </div>
 
-        {{ if .Params.tags }}
-        <div class="blog-tags">
-          <strong class="text-muted">Tags: </strong>
-          {{ range .Params.tags }}
-          #<a href="{{ "/tags/" | relLangURL }}{{ . | urlize }}">{{  . }}</a>
-          {{ end }}
-        </div>
-        {{ end }}
     </div>
   </div>
-  </div>
+
-  <br>
-  {{ end }}
 
 
 </section>

layouts/index.html

@@ -7,8 +7,22 @@
 
 <head>
     {{- partial "head.html" . -}}
+
     <meta name="description" content="{{ .Site.Params.description }}" />
 
+    <!-- Global site tag (gtag.js) - Google Analytics -->
+    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-167646412-7"></script>
+    <script>
+        window.dataLayer = window.dataLayer || [];
+
+        function gtag() {
+            dataLayer.push(arguments);
+        }
+        gtag('js', new Date());
+
+        gtag('config', '{{ .Site.Params.googleanalytics }}');
+    </script>
+
     <!-- stylesheets -->
     <link rel="stylesheet" href="/css/bootstrap.min.css">
     <link rel="stylesheet" href="/css/index.css">

layouts/partials/head.html

@@ -10,16 +10,3 @@
 
 <!-- Fonts -->
 <link href="https://fonts.googleapis.com/css2?family=Alata&display=swap" rel="stylesheet">
-
-<!-- Global site tag (gtag.js) - Google Analytics -->
-<script async src="https://www.googletagmanager.com/gtag/js?id=UA-167646412-7"></script>
-<script>
-    window.dataLayer = window.dataLayer || [];
-
-    function gtag() {
-        dataLayer.push(arguments);
-    }
-    gtag('js', new Date());
-
-    gtag('config', '{{ .Site.Params.googleanalytics }}');
-</script>

layouts/partials/sections/contact.html

@@ -1,5 +1,5 @@
 {{ if eq .Site.Params.contact "true"}}
-<section>
+<section id="contact">
     <div class="contact bg-danger text-white">
         <div class="text-center p-3 font-weight-bold contact-head">Get In Tough</div>
         <div class="p-3 container">

layouts/partials/sections/home.html

@@ -19,10 +19,15 @@
                         <li class="nav-item navbar-text">
                             <a class="nav-link text-dark" href="{{ .Site.BaseURL }}#projects">Projects</a>
                         </li>
+                        {{ if eq .Site.Params.contact "true"}}
+                        <li class="nav-item navbar-text">
+                            <a class="nav-link text-dark" href="{{ .Site.BaseURL }}#contact">Contact</a>
+                        </li>
+                        {{ end }}
 
                         {{ range site.Params.customMenus }}
                         <li class="nav-item navbar-text">
-                            <a class="nav-link text-dark" href="{{ .Site.BaseURL }}{{.url}}">{{ .name }}</a>
+                            <a class="nav-link text-dark" href="{{.Url}}">{{ .name }}</a>
                         </li>
                         {{ end }}
                     </ul>

static/css/blog.css

@@ -1,29 +1,7 @@
 /*blog*/
-.item-title {
+
-    font-family: 'Alata', sans-serif;
+.border-bottom-primary {
-    color: rgba(0, 0, 0, 0.541);
+    border-bottom: .25rem solid #4e73df !important;
 }
 
-.blog-tags {
+@media only screen and (max-width: 600px) {}
-    color: rgb(0, 204, 255);
-}
-
-.read-more:hover {
-    background-color: transparent;
-    color: #007bff;
-}
-
-.read-more:focus {
-    box-shadow: none;
-}
-
-.img-fluid {
-    width: 100% !important;
-    height: 350px !important;
-}
-
-@media only screen and (max-width: 600px) {
-    .img-fluid {
-        height: 200px !important;
-    }
-}