Relative paths in Markdown Frontmatter? about gatsby-starter-elemental HOT 10 CLOSED

Hey,
To add images from static folder, you can simply use /images/imagename, but please note that this method is really disadvantageous because if you source images from the static folder, there won't be a blur up preview or screen resolution based images. It is better to use the conventional method.

from gatsby-starter-elemental.

Hello.

I tried it even before and now, again. The path /images/imagename doesn't work, however, I see what you say. Even though I'm not a fan of those blurred up images, the resolution based images are kinda important. I just had to use it because I had to use site logo from static folder, so, I thought, why create a copy.

from gatsby-starter-elemental.

To use in frontmatter you will have to change some queries, but this will break all the other images that are not in the static folder. I would say making a copy will be better for the long run for the users of your site.

from gatsby-starter-elemental.

I've now taken a full backup. If I may ask, which queries would they be?

from gatsby-starter-elemental.

There are a couple of files you will have to change, you will basically have to replace

image {
    publicURL
    childImageSharp {
        fluid(maxWidth: 1920) {
            srcSet
            ...GatsbyImageSharpFluid
       }
    }
}

with

image

This will simply retrieve the URL as it is given (without gatsby manipulations) and then you will have to replace gatsby-image <Img> component with the normal <img> component.

The queries are located at src/components in the files list- and src/templates/list-
The component is at src/components in the files item-

list- => list-portfolio.js and list-blog.js

from gatsby-starter-elemental.

It seemed an easy task, but, this error pops-up: Field "image" of type "File" must have a selection of subfields. Did you mean "image { ... }"?

from gatsby-starter-elemental.

Hey, It probably means that you have some image that is still using the conventional method somewhere. For static to work, you will have to make sure that all of the images (in all pages) are in the static folder.

from gatsby-starter-elemental.

It was the case before, but, now, I replaced all image paths in all pages in the contents folder. Unfortunately, the same error exists.

from gatsby-starter-elemental.

Try gatsby clean

from gatsby-starter-elemental.

That worked. At first, it gave a lot of errors in various files in templates folder, but, I went ahead and tried to fix them all. Then, the images had lost their size styling, but, I added some CSS which fixed that. Great work sir, great template, everything just amazing. Thank you!

from gatsby-starter-elemental.