Skip to content
This repository has been archived by the owner on Feb 25, 2023. It is now read-only.

Cover photo for post #78

Open
ItsJamesMurray opened this issue May 6, 2020 · 4 comments
Open

Cover photo for post #78

ItsJamesMurray opened this issue May 6, 2020 · 4 comments

Comments

@ItsJamesMurray
Copy link

Hiya!

How am I able to reference a local image for the cover photo in the frontmatter rather than an externally hosted image?

For example, I have my post in content/posts/example-post.md. I have a photo I'd like to set as the cover photo in content/posts/img/header.jpg. Setting the frontmatter as cover: './img/header.jpg' does not work even though it will work if I reference it like that in the markdown post itself.

Thanks in advance!

@ItsJamesMurray
Copy link
Author

Hi everyone! Bumping this up :)

@cossssmin
Copy link
Owner

Hi there! This isn't something specific to this starter, I suggest asking this in the Gridsome repo or on their Discord channel. Might have to do with either core Gridsome or the markdown source plugin.

@edm00se
Copy link

edm00se commented Jun 9, 2020

@ItsJamesMurray A heavy-handed work around for this is to place your cover images under the static/ directory.

*for now, until it's fixed properly

@bryandugan
Copy link

Here's a workaround I came across in case anyone else is still having this issue.

I got it to work with the following Gridsome plugin:
https://gridsome.org/plugins/gridsome-plugin-blog-cover

Detailed Instructions

1.) Add gridsome-plugin-blog-cover": "^0.0.1-beta, to your package.json.
2.) Run yarn install
3.) In your blog post have your image setup like so: cover: ./image-name.png
4.) In the metadata portion of Post.vue, replace it with this.

ogImageUrl() {
        let coverObj =  this.$page.post.cover
        if (coverObj) {
           return `${this.config.siteUrl + coverObj.src}`
        } else {
          return `${this.config.siteUrl}/static/images/sharing-card.png`
        }
      }

5.) Run gridsome develop and it should load the image.

# for free to subscribe to this conversation on GitHub. Already have an account? #.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants