Build Websites with Hugo

Managing Images

Up until now, you’ve used placeholder images in your pages, but you’re going to want to place images in your blog posts, or screenshots of your projects. And you might even want an image on your home page. Hugo offers a few options for managing images: you can host images externally and link to them, you can place them in the static folder like you did with CSS files, or you can create a resource bundle and keep images with their associated content.

You already brought in images from an external site in Chapter 3, ​Adding Content Sections​. If your images are hosted elsewhere, you can use that same approach.

To link to images in the static folder of your theme or your site, use a standard <img> tag with a site-relative URL. This ...