Update README.md

Added ability to add custom content to head

README.md

@@ -11,7 +11,7 @@
 
 A high performance and mobile first hugo template for personal portfolio and blog
 
-- Example Site: [hugo-profile.netlify.app](https://hugo-profile.netlify.app)
+- ### Example Site: [https://hugo-profile.netlify.app](https://hugo-profile.netlify.app)
 
 # Features
 - Fully Responsive
@@ -40,7 +40,7 @@ Technology used: Bootstrap, fontawesome
 [For more details](https://github.com/gurusabarish/hugo-profile/wiki)
 ## Hugo theme
 
-- Install Hugo and create a site using `hugo new site my-site -f=yaml`
+- Install Hugo and create a site using `hugo new site my-site --format="yaml"`
 - Clone this repo inside your themes folder
 ```
 cd themes

exampleSite/config.yaml

@@ -352,8 +352,8 @@ params:
     enable: true
     # title: "Custom Name"
     content: My inbox is always open. Whether you have a question or just want to say hi, I’ll try my best to get back to you!
-    email: gurusabarisha@gmail.com
     btnName: Mail me
+    btnLink: mailto:gurusabarisha@gmail.com
     # formspree:
     #   enable: true # `contact.email` value will be ignored
     #   formId: abcdefgh # Take it from your form's endpoint, like 'https://formspree.io/f/abcdefgh'

exampleSite/content/gallery.md

@@ -4,11 +4,11 @@ date: 2022-06-25T18:35:46+05:30
 draft: false
 description: "My gallery :earth_asia:"
 layout: "gallery"
-images:
+galleryImages:
  - src: https://iso.500px.com/wp-content/uploads/2016/03/stock-photo-142984111-1500x1000.jpg
  - src: https://img.etimg.com/thumb/msid-68721417,width-650,imgsize-1016106,,resizemode-4,quality-100/nature1_gettyimages.jpg
  - src: https://thumbs.dreamstime.com/b/team-ants-council-collective-decision-work-17037482.jpg
  - src: https://thumbs.dreamstime.com/b/summer-day-smiling-women-relax-wearing-red-dress-fashion-standing-wooden-bridge-over-sea-blue-sky-background-summer-107411998.jpg
  - src: https://thumbs.dreamstime.com/b/young-woman-playing-dog-pet-beach-sunrise-sunset-girl-dog-having-fun-seasid-seaside-cute-neglected-stay-66480218.jpg
  - src: https://thumbs.dreamstime.com/b/funny-picture-taken-sunrise-frozen-lake-perspective-rider-retro-bicycle-sunrise-personal-211066044.jpg 
----
+---

layouts/_default/gallery.html

@@ -16,7 +16,7 @@
     </div>
     <div class="card-group p-4">
         <div class="row justify-content-center">
-            {{ range .Params.images }}
+            {{ range .Params.galleryImages }}
             <div class="col-md-4 p-0 m-0">
                 <div class="card p-0 m-0 border-0">
                     <img class="w-100" height="280px" src="{{ .src }}">
@@ -26,4 +26,4 @@
         </div>
     </div>
 </div>
-{{ end }}
+{{ end }}

layouts/_default/single.html

@@ -69,6 +69,11 @@
             <h5>{{ .Site.Params.terms.social | default "Social" }}</h5>
             <div class="social-content">
               <ul class="list-inline">
+                <li class="list-inline-item text-center">
+                  <a target="_blank" href="https://www.linkedin.com/shareArticle?mini=true&url={{ .Site.Params.hostName }}{{ .Permalink | absURL }}">
+                    <i class="fab fa-linkedin"></i>
+                  </a>
+                </li>
                 <li class="list-inline-item text-center">
                   <a target="_blank" href="https://twitter.com/share?text={{ .Title }}&url={{ .Site.Params.hostName }}{{ .Permalink | absURL }}">
                     <i class="fab fa-twitter"></i>

layouts/partials/head.html

@@ -74,19 +74,18 @@
     }
 
     body::-webkit-scrollbar {
-        width: .5em;
-        height: .5em;
+        height: 0px;
+        width: 8px;
         background-color: var(--background-color);
     }
     
     ::-webkit-scrollbar-track {
-        box-shadow: inset 0 0 6px var(--background-color);
         border-radius: 1rem;
     }
     
     ::-webkit-scrollbar-thumb {
         border-radius: 1rem;
-        background-color: var(--secondary-color);
+        background: #b0b0b0;
         outline: 1px solid var(--background-color);
     }
 
@@ -96,3 +95,5 @@
         background-color: var(--background-color);
     }
 </style>
+
+{{ partial "head/extensions.html" . }}

layouts/partials/head/extensions.html

@@ -0,0 +1,4 @@
+{{/*
+    You can add further theme extensions or customizations here if they should
+    appear in <head>.
+*/}}

layouts/partials/sections/contact.html

@@ -22,9 +22,17 @@
                             </div>
                         </form>
                     </div>
-                    {{ else if .Site.Params.contact.email }}
+                    {{ else if or (.Site.Params.contact.email)  (.Site.Params.contact.btnLink) }}
                     <div class="text-center pt-3">
-                        <a href="mailto:{{ .Site.Params.contact.email }}" class="btn">
+                        <a 
+                            href='{{ if .Site.Params.contact.btnLink }}
+                                    {{ .Site.Params.contact.btnLink | default "#" }}
+                                  {{ else }}
+                                    mailto:{{ .Site.Params.contact.email }}
+                                  {{ end }}'
+                            target="_blank"
+                            class="btn"
+                        >
                             {{ .Site.Params.contact.btnName | default "Get in Touch" }}
                         </a>
                     </div>

static/css/single.css

@@ -165,7 +165,17 @@
   position: sticky;
 }
 
+#single .sticky-sidebar ::-webkit-scrollbar {
+    height: 0px;
+    width: 8px;
+}
+
 /* Tags */
+#single aside.tags {
+    max-height: 35vh;
+    overflow: scroll;
+}
+
 #single aside.tags h5 {
     margin: .7em 0;
     margin-bottom: 1em;
@@ -173,16 +183,16 @@
 
 
 #single aside.tags ul.tags-ul li a {
-    padding: 10px 15px;
+    padding: 5px 10px;
     margin-bottom: 2px;
-    border-radius: 8px;
+    border-radius: 10px;
     background-color: var(--background-color);
     text-decoration: none;
     color: var(--text-color);
 }
 
 #single aside.tags ul.tags-ul li {
-    margin-bottom: 1.2rem;
+    margin-bottom: 0.8rem;
 }
 
 #single aside.tags ul.tags-ul li:hover {
@@ -193,6 +203,8 @@
 /*TOC*/
 #single aside.toc {
     padding: .7rem 1rem;
+    max-height: 50vh;
+    overflow: scroll;
 }
 
 #single aside.toc h5 {