Hugo CMS example
The easiest Hugo integration with a CMS you can get
Being written in Go, Hugo doesn't offer a native way to extend its features with plugins. To overcome this limitation, Dato CMS offers a Javascript-based CLI tool that makes it extremely convenient to transform the content stored in your DatoCMS project into Hugo posts and content types:
/*Inside your Hugo project run:npm install datocms-clientdato dump --token=YOUR_DATOCMS_PROJECT_API_TOKEN*/// dato.config.jsmodule.exports = (dato, root, i18n) => {// inside a "content/post" directory...root.directory("content/post", (dir) => {// ...iterate over the "Blog post" records saved in CMS...dato.blogPosts.forEach((blogPost) => {// ...and create a Hugo markdown file for each article!dir.createPost(`${blogPost.slug}.md`, "yaml", {frontmatter: {title: blogPost.title,type: "post",categories: blogPost.categories.map(cat => cat.slug),date: blogPost.publishedAt,},content: blogPost.content});}});}
Endless image transformations at your disposal
DatoCMS offers best-in-class image processing and image CDN. Optimize, resize, crop, rotate and watermark images on-the-fly simply adding custom parameters to the URL of your image. Serve lazy loaded, responsive images in one line of code.
Easily build dynamic landing pages with modular blocks
Give your editors the power of building custom landing pages through the CMS with no code intervention. Define reusable custom blocks of content, map them to Hugo template partials and you're good to go.
Start your new DatoCMS + Hugo project in minutes
In our marketplace you can find our best-practice project, a Hugo repository fully configured combined with a DatoCMS project that is ready to be deployed on Netlify or Vercel. You will have a fully functional Hugo project in a matter of minutes!