Articles
Syntax highlighting for GitHub files
Syntactically highlight a file stored in any public GitHub repository using a Hugo shortcode. Learn more »
Diagrams
Use a fenced code block to embed an SVG image of a diagram in your Hugo site. Learn more »
Markdown attributes
Hugo supports Markdown attributes on images and block-level elements including blockquotes, fenced code blocks, headings, lists, paragraphs, and tables. Learn more »
Link and image render hooks
Use Hugo’s render hooks to accurately resolve Markdown link and image destinations. This approach solves one of the most common problems encountered by site and content authors. Learn more »
Working with CSV files
Use a CSV file as a data source for your Hugo site, and automatically create tables without using Markdown. Learn more »
Tables of content
Insert a table of contents into pages on your Hugo site using one of four methods. Each method has advantages and disadvantages. Learn more »
Images with overlays
Create a composite of two images using Hugo’s overlay image filter, typically for watermarking or "frame within a frame" applications. Learn more »
Working with raw Markdown
Recursively convert a directory of raw Markdown files to Markdown with front matter. Learn more »
Supplemental math functions
Hugo provides a robust set of built-in math functions, but in some scenarios you might need more. Learn more »
Logical operators
Simplify your Hugo templates with logical operators. They do more than you think. Learn more »
Internal link validation
Document authors include links to related content within a project. While useful and necessary for document consumers, internal links are prone to breakage as the project changes over time. Learn more »
Mathematical expressions
Use a fenced code block or shortcode to embed an SVG image of a LaTeX mathematical expression or equation in your Hugo site. Learn more »
Code block line numbers
Hugo gives you three options in relation to line numbering with code samples. Learn how to create a consistent appearance regardless of method. Learn more »
Parsing URLs
When working with URLs in your Hugo templates, the urls.Parse function provides direct access to any of the URL components. Learn more »
Syntax highlighting styles
Hugo performs syntax highlighting when rendering code samples from Markdown. Customize the appearance with either inline styling or an external style sheet. Learn more »
Knowledge map
Building a site with Hugo requires knowledge of HTML, CSS, Markdown, data formats, media, source control, and hosting options. Learn more »
Working with time
Use Hugo’s time function to convert, format, localize, parse, compare, and manipulate dates and times. Learn more »
Code owners
Hugo can natively parse a CODEOWNERS file in your Git repository, and then retrieve user information directly from GitHub or GitLab. Learn more »
Code block render hooks
When rendering Markdown to HTML, render hooks override the conversion. Hugo introduced a render hook for fenced code blocks in v0.93.0. Learn more »
Spotify widgets
Use a shortcode to embed a Spotify widget in your Hugo site. Available widgets include artist, playlist, album, track, podcast, and episode. Learn more »