Hugo detector

Hugo logo

How can you detect if a website uses Hugo by looking at the source code?

Detecting whether a website uses Hugo can be done by examining the source code for specific markers that are unique to Hugo-generated sites.

Here’s a step-by-step guide on how to do it:

  1. Open the Page Source: Right-click on the webpage and select “View Page Source” or press Ctrl+U (Windows) or Cmd+Option+U (Mac) to open the page source code.
  2. Check the Meta Generator Tag: Hugo often includes a meta tag in the head section of the page that indicates it’s a Hugo site. Look for:
    • <meta name="generator" content="Hugo X.X.X" > (where X.X.X represents the version number).
  3. Look for Hugo-Specific Themes: Hugo sites frequently use themes that have specific folder structures. Search for assets using Ctrl+F (Windows) or Cmd+F (Mac), and look for directories such as:
    • /themes/: Theme-related assets are often stored here.
  4. Check for Hugo-Specific Shortcodes or Custom Tags: Hugo uses shortcodes to simplify HTML markup. Check the source code for any remnants of these shortcodes in comments or inline. For example:
    • {{< some_shortcode >}}
  5. Look for Static File References: Hugo serves static files from a static directory. In the page source, look for references to files with paths like:
    • /assets//img/, or /css/.
  6. Inspect the URL Structure: Hugo can produce clean URLs. Look for URL patterns that might indicate use of Hugo’s routing capabilities, such as:
    • Pretty URLs without file extensions.
  7. Check for Sitemap and RSS Feed: Many Hugo sites generate a sitemap and an RSS feed by default. Search for links to these files:
    • /sitemap.xml or /index.xml.
  8. Look for Hugo’s Default Favicon: Hugo-generated sites may include the default Hugo favicon. Look for:
    • <link rel="icon" href="/favicon.ico" />