This demo shows how to use Hugo’s Content Adapters to dynamically build pages from remote data sources, such as JSON files and CSV data from Google Sheet.
You will need Hugo version 0.126.0 or higher installed locally.
Clone this repository:
git clone https://github.com/harrycresswell/content-adapters.git
To start a local development server at at https://localhost:1313/ run:
hugo server
Head to content/books/_content.gotmpl to find Hugo’s content adapter example as seen in the Hugo docs. This example takes remote JSON data and creates pages for a collection of books. You can see these books by navigating to /books in a browser.
Head to content/locations/_content.gotmpl to find a content adapter template used to generate pages from Google Sheets data, as explained in Generate pages from Google Sheets using Hugo’s Content Adapters. I recommend reading this post to get a better understanding of what this content adapter is doing and how it generates pages.
themes/starter/layouts/locations/single.html is the layout template used to display the content on the generated pages.
Generating Hugo pages from Google Sheets data is the sheet used as the data source.
The sheet needs to published to the web in .CSV format for Hugo to have access to the data. To do this, open a copy of the sheet, then head to File > Share > Publish to web. Then under the Link tab, make sure Entire Document is set to Comma-separated values (.csv).
If you are adapting this demo by using your own sheet, then you will have to update the value of $url inside content/locations/_content.gotmpl with the URL from your sheet that Google provides.
Whe your ready to build a production ready site, update the baseUrl inside config.toml then run:
hugo --cleanDestinationDir
This will clean the /public folder and run a fresh build ready for production.
MIT