gatsby-source-drupal image alt tags

Created on 7 Dec 2018  Β·  19Comments  Β·  Source: gatsbyjs/gatsby

Summary

I'm trying to query an image's alt-text / title but it seems like it's not available. I'd love to fork it and fix it myself but can't seem to wrap my head around gatsby-source-drupal/gatsby-node.js (which is where I suppose the changes should be made).

Basic example

{
  nodeHome {
    id

    relationships{
field_slides {
  id
  alt
  localFile {
publicURL
  }
}
    }
  }
}
help wanted

Most helpful comment

+1

Same issue!

JSON API has the data for the alt tag as meta data, but the source module does not publish this data via GraphQL. It would be great if this could be pushed to the file__file relationship or somewhere that easily accessible and semantic.

..., "field_cover_image": { "data": { "type": "file--file", "id": "2ab20275-366c-431c-8ec6-d5cc42d5c20e", "meta": { "alt": "A lovely place where the \"magic\" happens. Toilet close.", "title": "", "width": 700, "height": 580 } }, "links": { "self": { "href": "http://site.domain/jsonapi/node/project/243d7fd4-7e55-47c4-a048-ed781b92cc9f/relationships/field_cover_image" }, "related": { "href": "http://site.domain/jsonapi/node/project/243d7fd4-7e55-47c4-a048-ed781b92cc9f/field_cover_image" } } }, ...

It's not very SEO friendly using this module until this gets fixed.

All 19 comments

I've worked around it for now by doing these things;

  • replaced all the image fields on the content types with media fields
  • disable the alt field on the media types' image field
  • manually add an alt text field to the image media type

Not ideal but it'll do for now :)

{ nodeHome { id relationships { field_media { id field_alt relationships { field_media_image { localFile { childImageSharp { original { src } } } } } } } } }

Hiya!

This issue has gone quiet. Spooky quiet. πŸ‘»

We get a lot of issues, so we currently close issues after 30 days of inactivity. It’s been at least 20 days since the last update here.

If we missed this issue or if you want to keep it open, please reply here. You can also add the label "not stale" to keep this issue open!

Thanks for being a part of the Gatsby community! πŸ’ͺπŸ’œ

+1

Same issue!

JSON API has the data for the alt tag as meta data, but the source module does not publish this data via GraphQL. It would be great if this could be pushed to the file__file relationship or somewhere that easily accessible and semantic.

..., "field_cover_image": { "data": { "type": "file--file", "id": "2ab20275-366c-431c-8ec6-d5cc42d5c20e", "meta": { "alt": "A lovely place where the \"magic\" happens. Toilet close.", "title": "", "width": 700, "height": 580 } }, "links": { "self": { "href": "http://site.domain/jsonapi/node/project/243d7fd4-7e55-47c4-a048-ed781b92cc9f/relationships/field_cover_image" }, "related": { "href": "http://site.domain/jsonapi/node/project/243d7fd4-7e55-47c4-a048-ed781b92cc9f/field_cover_image" } } }, ...

It's not very SEO friendly using this module until this gets fixed.

+1

Having the same issue here too!

Hiya!

This issue has gone quiet. Spooky quiet. πŸ‘»

We get a lot of issues, so we currently close issues after 30 days of inactivity. It’s been at least 20 days since the last update here.

If we missed this issue or if you want to keep it open, please reply here. You can also add the label "not stale" to keep this issue open!

Thanks for being a part of the Gatsby community! πŸ’ͺπŸ’œ

@pascal-kubrick Comment + 1 or something to remove the stale? label ;)

+1

+1

I need to understand a little bit about drupal json api here.

This meta object is on relationship object - can there be scenario where same file is linked with different meta (i.e. different alt tag)?

I need to understand a little bit about drupal json api here.

This meta object is on relationship object - can there be scenario where same file is linked with different meta (i.e. different alt tag)?

I believe that in theory it is possible that there's different alt tags for a single image, since Drupal sees every file as a separate entity, but stores meta data on the field level.

ie, this is what the table in the database looks like for an image field;
screenshot 2019-02-13 at 10 12 34

You can see the image field has multiple 'sub fields' containing the meta data, but the file itself is a reference to another entity field_image_target_id. This entity could be referenced from several fields.

To fix all scenarios for all of the field types, could the meta attributes not just simply be added to the relationship data (see below)?

{
  nodeBlogArticle {
    relationships {
      field_cover_image {
        meta {
          alt
          width
          height
        }
      }
    }
  }
}

As long as the data is accessible, it would be down to the developer implementing the GraphQL query to ensure that the data being output according to their requirements. If not additional logic clientside can be used.

The primary thing is that this data is not excluded from the GraphQL schema.

As far as I can tell this meta information needs to live on the content node in GraphQL and not the file node. Since the information it contains is specific to the content node. But the node.relationships.field_image is just foreign key that points to the file node in Gatsby.

I created a proof of concept here https://github.com/eojthebrave/gatsby/commit/0864018c42bfb67cd5cb139288a1917e2c4570ae that ads the meta data from the Drupal file entity as a field name {file_name}__meta on the GraphQL content entity. So you can query like

{
  nodeBlogArticle {
    field_cover_image__meta {
      alt,
    }
  }
}

I haven't yet tested this with things like multi-value image fields. Or media entities. But thought I would share and see if this is even the right direction to take before going further.

Hiya!

This issue has gone quiet. Spooky quiet. πŸ‘»

We get a lot of issues, so we currently close issues after 30 days of inactivity. It’s been at least 20 days since the last update here.

If we missed this issue or if you want to keep it open, please reply here. You can also add the label "not stale" to keep this issue open!

Thanks for being a part of the Gatsby community! πŸ’ͺπŸ’œ

Please keep this open

On 27 Mar 2019, 18:27 +0100, gatsbot[bot] notifications@github.com, wrote:

Hiya!
This issue has gone quiet. Spooky quiet. πŸ‘»
We get a lot of issues, so we currently close issues after 30 days of inactivity. It’s been at least 20 days since the last update here.
If we missed this issue or if you want to keep it open, please reply here. You can also add the label "not stale" to keep this issue open!
Thanks for being a part of the Gatsby community! πŸ’ͺπŸ’œ
β€”
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub, or mute the thread.

BUMP!

@KyleAMathews Can this be done in the gatsby-source-drupal module when creating the node for a file if the node.internal.type is either files or file__file?

I'm also having this issue. Using a very vanilla install of Drupal on Pantheon, and a basic Image filed on a custom content type.

Yeah, we can copy data around inside the source plugin to make it easier to access. I'm not going to have time to look into this but if someone would like to create a PR with a proposed solution, that seems the best way to move things forward.

Will try and have a look at this. Just wrapping up some other projects before I can take a look.

PR created with working fix #14187

I also submitted a PR with a different approach on #14562.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

rossPatton picture rossPatton  Β·  3Comments

andykais picture andykais  Β·  3Comments

timbrandin picture timbrandin  Β·  3Comments

dustinhorton picture dustinhorton  Β·  3Comments

dustinhorton picture dustinhorton  Β·  3Comments