Gatsby blog, default settings cause path and image issue

Netlify CMS
, ,
#1

Hi there, I have a blog hosted on my company’s landing page at Blog | Swapstack - the entire site is built on the Gatsby starter blog template with Netlify CMS for content.

My config.yml file settings are copy/pasted the same as in the documentation - see source code here (and pasted below):

backend:
  name: git-gateway
  repo: jakesing/gatsby-swapstack
  branch: main # Branch to update (optional; defaults to master)

media_folder: static/img # Media files will be stored in the repo under images/uploads
public_folder: /img
publish_mode: editorial_workflow

collections:
  - name: "blog"
    label: "Blog"
    folder: "content/blog"
    create: true
    slug: "index"
    media_folder: ""
    public_folder: ""
    path: "{{title}}/index"
    editor:
      preview: false
    fields:
      - { label: "Title", name: "title", widget: "string" }
      - {
          label: "Author",
          name: "author",
          widget: "relation",
          collection: "authors",
          value_field: "email",
          display_fields: ["name"],
          search_fields: ["name", "email"],
        }

      - { label: "Publish Date", name: "date", widget: "datetime" }
      - { label: "Description", name: "description", widget: "string" }
      - { label: "Body", name: "body", widget: "markdown" }
      - { label: "Featured Image", name: "thumbnail", widget: "image" }

  - name: authors
    label: Authors
    folder: src/pages/blog/_authors/
    media_folder: ""
    public_folder: ""
    format: json
    create: true
    slug: "{{name}}"
    fields:
      - { label: Name, name: name, widget: string }
      - { label: Title, name: title, widget: string }
      - { label: Email, name: email, widget: string }
      - { label: Shortbio, name: shortbio, widget: text }
      - { label: Image, name: authorimage, widget: image }
      - { label: URL, name: url, widget: string }

Things are working as expected except for two issues:

  1. filepath: I want my blog posts to appear at swapstack.co/blog/{slug}, but instead they are appearing at swapstack.co/{slug}. I’ve tried changing some settings to rectify this, but haven’t found a solution.

  2. Thumbnail image: my blog landing page reads from the post frontmatter and pulls the thumbnail. When the thumbnail is added via URL, this works just fine. When it is uploaded as a file, it fails and cannot read it. Here is an example of a post: the file is listed as a filepath.

---
title: Testing Images
author: vidya@swapstack.co
date: 2022-01-28T16:10:40.131Z
description: Testing image 123
thumbnail: high-resolution-full-logo.jpg
---

How can I get the blog landing page to understand that this is a filepath and not a URL?

#2

Hi there! Thanks for your interest in Netlify CMS. Looks like you posted your question a little while ago, but that you haven’t received a solution yet. Here’s where you might get more help:

netlifycms.org - the site houses our extensive documentation that likely contains helpful information to get you back on track.

netlify cms slack - join our friendly slack channel and chat with other cms pros to get the help you need.

GitHub Issues - think you’ve found a bug, or would like to make a feature request? Make your voice heard here. Netlify CMS is open source - PRs and other contributions are also welcome!

Stack Overflow Check StackOverflow for questions tagged “Netlify CMS” if you don’t get an answer in the Slack or the GH issues. StackOverflow reaches a worldwide audience of knowledgeable people.

Your question will be left open here for anyone to comment - but we encourage you to check out the above resources if you are still looking for a solution!