Hugo Tips

Posted by John Liu on Sunday, September 17, 2023

In Hugo markup, you can create hyperlink to reference either internal or external webpages.

To reference internal (on the same site) page:

[your title]({{< ref "/your reference file name.md" >}})

To referenc external page, hyperlink will open in a new tab:

This one will add a line break after the hyperlink: we use the newtabref-newline Hugo shortcodes
{{< newtabref-newline href="https://...." title="your title" >}}

This one will not add a line break after the hyperlink: we use the newtabref-inline Hugo shortcodes
{{< newtabref-inline href="https://...." title="your title" >}}

(self note: in the above code snip, undercover, we escaped the Hugo shortcodes using /**/ inside the <…> block so it will not break this page.)

Create Table

{{<table "table table-striped table-bordered">}}
|Project Name|Allocated Hours|User Name|Used Hours
|--------------|-----------------|--------------|-----------------|
|Project1|40|User1|2|
|Project1|40|User2|4|
{{</table>}}

Escape shortcode

You might need to escape (i.e., prevent from executing) a shortcode in a Hugo markdown (.md) file. A simple method is adding /* after the opening double curly braces and the angle bracket or percent sign (i.e., {{< or {{%/*) and adding */ after the closing angle bracket or percent sign and double curly braces (i.e., >}} or */%}}).

Rebuild public folder

hugo -d public