move more implementation to theme for consistency, reuse later ; enable pagination ; tune home page to be just a welcome page ; tune search page text ; tune headings

archetypes/default.md

@@ -1,6 +0,0 @@
----
-title: "{{ replace .Name "-" " " | title }}"
-date: {{ .Date }}
-draft: true
----
-

config.toml

@@ -1,4 +1,83 @@
-baseURL = 'http://example.org/'
+baseURL = '/'
+title = 'accessible.tips'
+
+DefaultContentLanguage = "en"
 languageCode = 'en-us'
-title = 'My New Hugo Site'
-enableRobotsTXT = true
+timeZone = 'UTC'
+
+enableEmoji = true
+enableRobotsTXT = true
+rssLimit = 25
+
+ignoreFiles = [ '.gitignore', '.gitkeep' ]
+
+theme = ['hugo-xmin']
+
+footnotereturnlinkcontents = '↩'
+
+uglyURLs = false
+[permalinks]
+  tips = '/tips/:slug/'
+  posts = '/posts/:slug/'
+  tags = '/tags/:title/'
+
+[sitemap]
+  changefreq = 'weekly'
+  filename = 'sitemap.xml'
+  priority = 0.5
+
+[imaging]
+  [imaging.exif]
+    disableDate = false
+    disableLatLong = true
+
+[markup]
+  [markup.goldmark]
+    [markup.goldmark.renderer]
+      unsafe = true
+  [markup.highlilght]
+    codeFences = false
+
+[outputs]
+    home = ["HTML", "RSS", "JSON"]
+
+[params]
+  description = 'A collection of accessibility tips and tricks'
+  footer = '© KemoNine {Year}'
+
+[menu]
+[[menu.main]]
+  identifier = 'home'
+  name = 'Home'
+  url = '/'
+  weight = 10
+[[menu.main]]
+  identifier = 'posts'
+  name = 'Blog'
+  url = '/posts/'
+  weight = 20
+#[[menu.main]]
+#  identifier = 'tags'
+#  name = 'Tags'
+#  url = '/tags/'
+#  weight = 30
+[[menu.main]]
+  identifier = 'categories'
+  name = 'Categories'
+  url = '/categories/'
+  weight = 40
+[[menu.main]]
+  identifier = 'tips'
+  name = 'Tips'
+  url = '/tips/'
+  weight = 50
+[[menu.main]]
+  identifier = 'rss'
+  name = 'RSS'
+  url = 'index.xml'
+  weight = 60
+[[menu.main]]
+  identifier = 'search'
+  name = 'Search'
+  url = '/search/'
+  weight = 70

themes/hugo-xmin/archetypes/default.md

@@ -1,4 +1,5 @@
----
-title: ''
-date: ''
----
++++
+toc = true
+draft = true
++++
+

themes/hugo-xmin/content/search.md

@@ -0,0 +1,10 @@
++++
+title = "Search"
+author = ["KemoNine"]
+draft = false
+layout = "search"
+[sitemap]
+  priority = 0.1
++++
+
+This page was adapted from <https://makewithhugo.com/add-search-to-a-hugo-site/>

themes/hugo-xmin/exampleSite/config.toml

@@ -0,0 +1,83 @@
+baseURL = '/'
+title = 'accessible.tips'
+
+DefaultContentLanguage = "en"
+languageCode = 'en-us'
+timeZone = 'UTC'
+
+enableEmoji = true
+enableRobotsTXT = true
+rssLimit = 25
+
+ignoreFiles = [ '.gitignore', '.gitkeep' ]
+
+theme = ['hugo-xmin']
+
+footnotereturnlinkcontents = '↩'
+
+uglyURLs = false
+[permalinks]
+  tips = '/tips/:slug/'
+  posts = '/posts/:slug/'
+  tags = '/tags/:title/'
+
+[sitemap]
+  changefreq = 'weekly'
+  filename = 'sitemap.xml'
+  priority = 0.5
+
+[imaging]
+  [imaging.exif]
+    disableDate = false
+    disableLatLong = true
+
+[markup]
+  [markup.goldmark]
+    [markup.goldmark.renderer]
+      unsafe = true
+  [markup.highlilght]
+    codeFences = false
+
+[outputs]
+    home = ["HTML", "RSS", "JSON"]
+
+[params]
+  description = 'A collection of accessibility tips and tricks'
+  footer = '© KemoNine {Year}'
+
+[menu]
+[[menu.main]]
+  identifier = 'home'
+  name = 'Home'
+  url = '/'
+  weight = 10
+[[menu.main]]
+  identifier = 'tips'
+  name = 'Tips'
+  url = '/tips/'
+  weight = 20
+[[menu.main]]
+  identifier = 'posts'
+  name = 'Posts'
+  url = '/posts/'
+  weight = 30
+[[menu.main]]
+  identifier = 'tags'
+  name = 'Tags'
+  url = '/tags/'
+  weight = 40
+[[menu.main]]
+  identifier = 'categories'
+  name = 'Categories'
+  url = '/categories/'
+  weight = 50
+[[menu.main]]
+  identifier = 'rss'
+  name = 'RSS'
+  url = 'index.xml'
+  weight = 60
+[[menu.main]]
+  identifier = 'search'
+  name = 'Search'
+  url = '/search/'
+  weight = 70

themes/hugo-xmin/exampleSite/config.yaml

@@ -1,42 +0,0 @@
-baseurl: "/"
-languageCode: "en-us"
-title: "A minimal Hugo website"
-theme: "hugo-xmin"
-googleAnalytics: ""
-disqusShortname: ""
-ignoreFiles: ["\\.Rmd$", "\\.Rmarkdown$", "_cache$"]
-footnotereturnlinkcontents: "↩"
-paginate: 1
-
-permalinks:
-  note: "/note/:year/:month/:day/:slug/"
-  post: "/post/:year/:month/:day/:slug/"
-
-menu:
-  main:
-    - name: Home
-      url: ""
-      weight: 1
-    - name: About
-      url: "about/"
-      weight: 2
-    - name: Categories
-      url: "categories/"
-      weight: 3
-    - name: Tags
-      url: "tags/"
-      weight: 4
-    - name: Subscribe
-      url: "index.xml"
-
-params:
-  description: "A website built through Hugo and blogdown."
-  footer: "© [Yihui Xie](https://yihui.org) 2017 -- {Year} | [Github](https://github.com/yihui) | [Twitter](https://twitter.com/xieyihui)"
-  GithubEdit: "https://github.com/yihui/hugo-xmin/edit/feature/github-edit/exampleSite/content/"
-
-markup:
-  highlight:
-    codeFences: false
-  goldmark:
-    renderer:
-      unsafe: true

themes/hugo-xmin/layouts/_default/index.json

@@ -0,0 +1,5 @@
+{{- $.Scratch.Add "index" slice -}}
+{{- range .Site.RegularPages -}}
+    {{- $.Scratch.Add "index" (dict "title" .Title "tags" .Params.tags "categories" .Params.categories "contents" .Plain "permalink" .Permalink) -}}
+{{- end -}}
+{{- $.Scratch.Get "index" | jsonify -}}

themes/hugo-xmin/layouts/_default/list.html

@@ -6,17 +6,27 @@
 
 {{ .Content }}
 
+{{ if not .IsHome }}
 <ul>
+
   {{ $pages := .Pages }}
-  {{ if .IsHome }}{{ $pages = .Site.RegularPages }}{{ end }}
   {{ $paginator := .Paginate (where $pages "Section" "!=" "") }}
-  {{ range $paginator.Pages }}
-  <li>
-    <span class="date">{{ .Date.Format "2006/01/02" }}</span>
-    <a href="{{ .RelPermalink }}">{{ .Title | markdownify }}</a>
-  </li>
+  {{ if (eq .Type "tips") }}
+    {{ range sort $paginator.Pages ".Title" }}
+    <li>
+     <a href="{{ .RelPermalink }}">{{ .Title | markdownify }}</a>
+    </li>
+    {{ end }}
+  {{ else }}
+    {{ range sort $paginator.Pages }}
+    <li>
+      <span class="date">{{ .Date.Format "2006/01/02" }}</span>
+     <a href="{{ .RelPermalink }}">{{ .Title | markdownify }}</a>
+    </li>
+    {{ end }}
   {{ end }}
 </ul>
 {{ template "_internal/pagination.html" . }}
+{{ end }}
 
 {{ partial "footer.html" . }}

themes/hugo-xmin/layouts/_default/search.html

@@ -0,0 +1,33 @@
+{{ partial "header.html" . }}
+
+<main>
+<form action="/search" method="GET">
+    <input type="search" name="q" id="search-query" title="Search query" placeholder="Search....">
+    <input type="submit" value="Search" title="Search">
+</form>
+
+<hr />
+
+    <div id="search-results"></div>
+    <div class="search-loading"></div>
+
+    <script id="search-result-template" type="text/x-js-template">
+    <div id="summary-${key}">
+        <hr />
+        <h3><a href="${link}">${title}</a></h3>
+        <p>${snippet}</p>
+        <p>
+            <small>
+                ${ isset tags }Tags: ${tags}<br>${ end }
+            </small>
+        </p>
+    </div>
+    </script>
+
+
+<script src="{{ "js/fuse.min.js" | absURL }}"></script>
+<script src="{{ "js/mark.min.js" | absURL }}"></script>
+<script src="{{ "js/search.js" | absURL }}"></script>
+</main>
+
+{{ partial "footer.html" . }}

themes/hugo-xmin/layouts/_default/single.html

@@ -2,7 +2,8 @@
 <div class="article-meta">
 <h1><span class="title">{{ .Title | markdownify }}</span></h1>
 {{ with .Params.author }}<h2 class="author">{{ . }}</h2>{{ end }}
-{{ if (gt .Params.date 0) }}<h2 class="date">{{ .Date.Format "2006/01/02" }}</h2>{{ end }}
+{{ if (gt .Date 0) }}<h4 class="date">Published: {{ .Date.Format "2006/01/02" }}</h4>{{ end }}
+{{ if (gt .Lastmod 0) }}<h4 class="date">Last Modified: {{ .Lastmod.Format "2006/01/02" }}</h4>{{ end }}
 <p class="terms">
   {{ range $i := (slice "categories" "tags") }}
   {{ with ($.Param $i) }}

themes/hugo-xmin/layouts/partials/header.html

@@ -6,6 +6,11 @@
     <title>{{ .Title }} | {{ .Site.Title }}</title>
     <link rel="stylesheet" href="{{ "css/style.css" | relURL }}" />
     <link rel="stylesheet" href="{{ "css/fonts.css" | relURL }}" />
+
+    {{ range .AlternativeOutputFormats -}}
+    {{ printf `<link rel="%s" type="%s" href="%s" title="%s | %s" />` .Rel .MediaType.Type .Permalink $.Title $.Site.Title | safeHTML }}
+    {{ end -}}
+
     {{ partial "head_custom.html" . }}
   </head>
 

themes/hugo-xmin/static/css/fonts.css

@@ -1,7 +1,7 @@
 body {
-  font-family: Optima, Candara, Calibri, Arial, sans-serif;
+  font-family: "Atkinson Hyperlegible", Atkinson-Hyperlegible, AtkinsonHyperlegible, "Open Dyslexic", Open-Dyslexic, OpenDyslexic, serif;
 }
 code {
-  font-family: "Lucida Console", Monaco, monospace;
+  font-family: "MonoLisa Variable", "MonoLisa", "DejaVu Sans Mono", "Lucida Console", Monaco, monospace;
   font-size: 85%;
 }

themes/hugo-xmin/static/js/search.js

@@ -0,0 +1,136 @@
+var summaryInclude = 180;
+var fuseOptions = {
+    shouldSort: true,
+    includeMatches: true,
+    includeScore: true,
+    tokenize: true,
+    location: 0,
+    distance: 100,
+    minMatchCharLength: 1,
+    keys: [
+        {name: "title", weight: 0.45},
+        {name: "contents", weight: 0.4},
+        {name: "tags", weight: 0.1},
+        {name: "categories", weight: 0.05}
+    ]
+};
+
+// =============================
+// Search
+// =============================
+
+var inputBox = document.getElementById('search-query');
+if (inputBox !== null) {
+    var searchQuery = param("q");
+    if (searchQuery) {
+        inputBox.value = searchQuery || "";
+        executeSearch(searchQuery, false);
+    } else {
+        document.getElementById('search-results').innerHTML = '<p class="search-results-empty">Please enter a word or phrase above to search</p>';
+    }
+}
+
+function executeSearch(searchQuery) {
+
+    show(document.querySelector('.search-loading'));
+
+    fetch('/index.json').then(function (response) {
+        if (response.status !== 200) {
+            console.log('Looks like there was a problem. Status Code: ' + response.status);
+            return;
+        }
+        // Examine the text in the response
+        response.json().then(function (pages) {
+            var fuse = new Fuse(pages, fuseOptions);
+            var result = fuse.search(searchQuery);
+            if (result.length > 0) {
+                populateResults(result);
+            } else {
+                document.getElementById('search-results').innerHTML = '<p class=\"search-results-empty\">No matches found</p>';
+            }
+            hide(document.querySelector('.search-loading'));
+        })
+        .catch(function (err) {
+            console.log('Fetch Error :-S', err);
+        });
+    });
+}
+
+function populateResults(results) {
+
+    var searchQuery = document.getElementById("search-query").value;
+    var searchResults = document.getElementById("search-results");
+
+    // pull template from hugo template definition
+    var templateDefinition = document.getElementById("search-result-template").innerHTML;
+
+    results.forEach(function (value, key) {
+
+        var contents = value.item.contents;
+        var snippet = "";
+        var snippetHighlights = [];
+
+        snippetHighlights.push(searchQuery);
+        snippet = contents.substring(0, summaryInclude * 2) + '&hellip;';
+
+        //replace values
+        var tags = ""
+        if (value.item.tags) {
+            value.item.tags.forEach(function (element) {
+                tags = tags + "<a href='/tags/" + element + "'>" + "#" + element + "</a> "
+            });
+        }
+
+        var output = render(templateDefinition, {
+            key: key,
+            title: value.item.title,
+            link: value.item.permalink,
+            tags: tags,
+            categories: value.item.categories,
+            snippet: snippet
+        });
+        searchResults.innerHTML += output;
+
+        snippetHighlights.forEach(function (snipvalue, snipkey) {
+            var instance = new Mark(document.getElementById('summary-' + key));
+            instance.mark(snipvalue);
+        });
+
+    });
+}
+
+function render(templateString, data) {
+    var conditionalMatches, conditionalPattern, copy;
+    conditionalPattern = /\$\{\s*isset ([a-zA-Z]*) \s*\}(.*)\$\{\s*end\s*}/g;
+    //since loop below depends on re.lastInxdex, we use a copy to capture any manipulations whilst inside the loop
+    copy = templateString;
+    while ((conditionalMatches = conditionalPattern.exec(templateString)) !== null) {
+        if (data[conditionalMatches[1]]) {
+            //valid key, remove conditionals, leave contents.
+            copy = copy.replace(conditionalMatches[0], conditionalMatches[2]);
+        } else {
+            //not valid, remove entire section
+            copy = copy.replace(conditionalMatches[0], '');
+        }
+    }
+    templateString = copy;
+    //now any conditionals removed we can do simple substitution
+    var key, find, re;
+    for (key in data) {
+        find = '\\$\\{\\s*' + key + '\\s*\\}';
+        re = new RegExp(find, 'g');
+        templateString = templateString.replace(re, data[key]);
+    }
+    return templateString;
+}
+
+// Helper Functions
+function show(elem) {
+    elem.style.display = 'block';
+}
+function hide(elem) {
+    elem.style.display = 'none';
+}
+function param(name) {
+    return decodeURIComponent((location.search.split(name + '=')[1] || '').split('&')[0]).replace(/\+/g, ' ');
+}