Build Websites with Hugo

Populating Page Content Using Data in Front Matter

When you created your Project archetype, you created some placeholder content that you could replace. Over time, you might want to change the content on these pages, and going through each one manually to get them all looking the same could be a lot of work.

Let’s refactor the project pages so they’re more data-driven.

Modify the default archetype for Projects to include the image, the image’s alternative text, and the “Tech Used” content. You’ll also add a summary that you can use in various places:

working_with_data/portfolio/archetypes/projects.md

---
title: "{{ replace .Name "-" " " | title }}"
draft: false
image: //via.placeholder.com/640x150
alt_text: "{{ replace ...