Add Katex support. Various other fixes

8 files changed, 79 insertions, 11 deletions

diff --git a/exampleSite/config.toml b/exampleSite/config.toml
index d75c844..c803878 100644
--- a/exampleSite/config.toml
+++ b/exampleSite/config.toml
@@ -32,6 +32,9 @@ pygmentsStyle = "pygments"
   # Footer text, can be markdown
   footer = "Made with [Hugo](https://gohugo.io/). Themed by [Cayman](https://github.com/zwbetz-gh/cayman-hugo-theme). Deployed to [Netlify](https://www.netlify.com/)."
 
+  # If true, the CSS/JS for Katex math typesetting are enabled
+  katex = true
+
   # Breakpoints
   large_breakpoint = "64em"
   medium_breakpoint = "42em"
diff --git a/exampleSite/config.yaml b/exampleSite/config.yaml
index be26c8b..bc4801b 100644
--- a/exampleSite/config.yaml
+++ b/exampleSite/config.yaml
@@ -32,6 +32,9 @@ params:
   # Footer text, can be markdown

   footer: Made with [Hugo](https://gohugo.io/). Themed by [Cayman](https://github.com/zwbetz-gh/cayman-hugo-theme). Deployed to [Netlify](https://www.netlify.com/).

 

+  # If true, the CSS/JS for Katex math typesetting are enabled

+  katex: true

+

   # Breakpoints

   large_breakpoint: 64em

   medium_breakpoint: 42em

diff --git a/exampleSite/content/post/katex-math-typesetting/index.md b/exampleSite/content/post/katex-math-typesetting/index.md
new file mode 100644
index 0000000..dc9a8b5
--- /dev/null
+++ b/exampleSite/content/post/katex-math-typesetting/index.md
@@ -0,0 +1,29 @@
+---

+title: "Katex Math Typesetting"

+date: 2019-04-02

+tags: [katex, math, typesetting, hugo]

+---

+

+Enable Katex in the config file by setting the `katex` param to `true`. This will import the necessary Katex CSS/JS. 

+

+**Note:** Use the online reference of [supported TeX functions](https://katex.org/docs/supported.html). 

+

+Some math:

+

+```

+$$ \varphi = \dfrac{1+\sqrt5}{2}= 1.6180339887… $$

+```

+

+$$ \varphi = \dfrac{1+\sqrt5}{2}= 1.6180339887… $$

+

+More math: 

+

+```

+$$

+\varphi = 1+\frac{1} {1+\frac{1} {1+\frac{1} {1+\cdots} } } 

+$$

+```

+

+$$

+\varphi = 1+\frac{1} {1+\frac{1} {1+\frac{1} {1+\cdots} } } 

+$$

diff --git a/exampleSite/content/post/migrate-from-jekyll/index.md b/exampleSite/content/post/migrate-from-jekyll/index.md
index 89d8458..581da3c 100644
--- a/exampleSite/content/post/migrate-from-jekyll/index.md
+++ b/exampleSite/content/post/migrate-from-jekyll/index.md
@@ -47,7 +47,7 @@ That's the bulk of the work right here. The documentation is your friend. You sh
 As a single reference data point, converting my templates for [heyitsalex.net](http://heyitsalex.net/) took me no more than a few hours.

 

 ## Convert Jekyll plugins to Hugo shortcodes

-Jekyll has [plugins](http://jekyllrb.com/docs/plugins/); Hugo has [shortcodes](/doc/shortcodes/). It's fairly trivial to do a port.

+Jekyll has [plugins](http://jekyllrb.com/docs/plugins/); Hugo has [shortcodes](https://gohugo.io/content-management/shortcodes/). It's fairly trivial to do a port.

 

 ### Implementation

 As an example, I was using a custom [`image_tag`](https://github.com/alexandre-normand/alexandre-normand/blob/74bb12036a71334fdb7dba84e073382fc06908ec/_plugins/image_tag.rb) plugin to generate figures with caption when running Jekyll. As I read about shortcodes, I found Hugo had a nice built-in shortcode that does exactly the same thing.

diff --git a/exampleSite/content/post/nasa-images/index.md b/exampleSite/content/post/nasa-images/index.md
index e81b9a3..a795f6c 100644
--- a/exampleSite/content/post/nasa-images/index.md
+++ b/exampleSite/content/post/nasa-images/index.md
@@ -4,7 +4,17 @@ date: 2018-12-27
 tags: [nasa, shortcodes, figure, sun, moon, earth]
 ---
 
-The below images are from the [NASA Image and Video Library](https://images.nasa.gov/) -- indulge yourself, revel in their beauty. 
+The below images are from the [NASA Image and Video Library](https://images.nasa.gov/) -- indulge yourself, revel in their beauty. Also, the built-in [figure](https://github.com/zwbetz-gh/cayman-hugo-theme/blob/master/layouts/shortcodes/figure.html) shortcode is shown for each image. 
+
+---
+
+```
+{{</* figure
+img="sun.jpg" 
+caption="The Sun is the star at the center of the Solar System. It is a nearly perfect sphere of hot plasma, with internal convective motion that generates a magnetic field via a dynamo process. It is by far the most important source of energy for life on Earth. [Credits](https://images.nasa.gov/details-GSFC_20171208_Archive_e000393.html)." 
+command="Resize" 
+options="800x" */>}}
+```
 
 {{< figure
 img="sun.jpg" 
@@ -14,6 +24,14 @@ options="800x" >}}
 
 <br>
 
+```
+{{</* figure
+img="moon.jpg" 
+caption="The Moon is an astronomical body that orbits planet Earth and is Earth's only permanent natural satellite. It is the fifth-largest natural satellite in the Solar System, and the largest among planetary satellites relative to the size of the planet that it orbits (its primary). The Moon is after Jupiter's satellite Io the second-densest satellite in the Solar System among those whose densities are known. [Credits](https://images.nasa.gov/details-GSFC_20171208_Archive_e001861.html)." 
+command="Resize" 
+options="800x" */>}}
+```
+
 {{< figure
 img="moon.jpg" 
 caption="The Moon is an astronomical body that orbits planet Earth and is Earth's only permanent natural satellite. It is the fifth-largest natural satellite in the Solar System, and the largest among planetary satellites relative to the size of the planet that it orbits (its primary). The Moon is after Jupiter's satellite Io the second-densest satellite in the Solar System among those whose densities are known. [Credits](https://images.nasa.gov/details-GSFC_20171208_Archive_e001861.html)." 
@@ -22,6 +40,14 @@ options="800x" >}}
 
 <br>
 
+```
+{{</* figure
+img="earth.jpg" 
+caption="Earth is the third planet from the Sun and the only astronomical object known to harbor life. According to radiometric dating and other sources of evidence, Earth formed over 4.5 billion years ago. Earth's gravity interacts with other objects in space, especially the Sun and the Moon, Earth's only natural satellite. Earth revolves around the Sun in 365.26 days, a period known as an Earth year. During this time, Earth rotates about its axis about 366.26 times. [Credits](https://images.nasa.gov/details-PIA18033.html)." 
+command="Resize" 
+options="800x" */>}}
+```
+
 {{< figure
 img="earth.jpg" 
 caption="Earth is the third planet from the Sun and the only astronomical object known to harbor life. According to radiometric dating and other sources of evidence, Earth formed over 4.5 billion years ago. Earth's gravity interacts with other objects in space, especially the Sun and the Moon, Earth's only natural satellite. Earth revolves around the Sun in 365.26 days, a period known as an Earth year. During this time, Earth rotates about its axis about 366.26 times. [Credits](https://images.nasa.gov/details-PIA18033.html)." 
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index 2440bfd..17c45ea 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -14,5 +14,6 @@
   <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
   <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
   <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
+  {{ partial "katex.html" . }}
   <title>{{ .Title }} | {{ $.Site.Title }}</title>
 </head>
diff --git a/layouts/partials/header-nav.html b/layouts/partials/header-nav.html
index f6a4030..d01b0bf 100644
--- a/layouts/partials/header-nav.html
+++ b/layouts/partials/header-nav.html
@@ -5,13 +5,14 @@
   <h2 class="project-tagline">
     {{ $.Site.Params.project_tagline | default "project_tagline goes here" | markdownify }}
   </h2>
-  <!-- TODO wrap w/ nav element -->
-  {{ $current := . }}
-  {{ range .Site.Menus.nav }}
-    {{ $active := or ($current.IsMenuCurrent "nav" .) ($current.HasMenuCurrent "nav" .) }}
-    {{ $active = or $active (eq .Name $current.Title) }}
-    {{ $active = or $active (and (eq .Name "Blog") (eq $current.Section "post")) }}
-    {{ $active = or $active (and (eq .Name "Tags") (eq $current.Section "tags")) }}
-    <a href="{{ .URL }}" class="btn">{{ .Name }}</a>
-  {{ end }}
+  <nav>
+    {{ $current := . }}
+    {{ range .Site.Menus.nav }}
+      {{ $active := or ($current.IsMenuCurrent "nav" .) ($current.HasMenuCurrent "nav" .) }}
+      {{ $active = or $active (eq .Name $current.Title) }}
+      {{ $active = or $active (and (eq .Name "Blog") (eq $current.Section "post")) }}
+      {{ $active = or $active (and (eq .Name "Tags") (eq $current.Section "tags")) }}
+      <a href="{{ .URL }}" class="btn">{{ .Name }}</a>
+    {{ end }}
+  </nav>
 </section>
diff --git a/layouts/partials/katex.html b/layouts/partials/katex.html
new file mode 100644
index 0000000..7410749
--- /dev/null
+++ b/layouts/partials/katex.html
@@ -0,0 +1,5 @@
+{{ if eq $.Site.Params.katex true }}

+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.10.1/dist/katex.min.css" integrity="sha384-dbVIfZGuN1Yq7/1Ocstc1lUEm+AT+/rCkibIcC/OmWo5f0EA48Vf8CytHzGrSwbQ" crossorigin="anonymous">

+<script defer src="https://cdn.jsdelivr.net/npm/katex@0.10.1/dist/katex.min.js" integrity="sha384-2BKqo+exmr9su6dir+qCw08N2ZKRucY4PrGQPPWU1A7FtlCGjmEGFqXCv5nyM5Ij" crossorigin="anonymous"></script>

+<script defer src="https://cdn.jsdelivr.net/npm/katex@0.10.1/dist/contrib/auto-render.min.js" integrity="sha384-kWPLUVMOks5AQFrykwIup5lo0m3iMkkHrD0uJ4H5cjeGihAutqP0yW0J6dpFiVkI" crossorigin="anonymous" onload="renderMathInElement(document.body);"></script>

+{{ end }}
\ No newline at end of file