Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Plugins for SEO / AMP / Instant Articles #1594

Closed
vilav opened this issue Jul 24, 2017 · 5 comments
Closed

Plugins for SEO / AMP / Instant Articles #1594

vilav opened this issue Jul 24, 2017 · 5 comments
Labels
type: question or discussion Issue discussing or asking a question about Gatsby

Comments

@vilav
Copy link

vilav commented Jul 24, 2017

Hi there

Are there any current plugins for SEO / Google AMP / Facebook Instant Articles?

Thanks

@tderflinger
Copy link

There is a Gatsby AMP Starter: https://github.com/chiedo/gatsby-amp-starter-blog
Hope this helps!

@benjaminhoffman
Copy link
Contributor

@vilav feel free to take a look at all the gatsby starters here, many of which do have SEO support: https://www.gatsbyjs.org/docs/gatsby-starters/. Closing this issue for now but feel free to re-open if your question has not be addressed.

@fk fk added the type: question or discussion Issue discussing or asking a question about Gatsby label Dec 5, 2017
@misscs
Copy link

misscs commented Dec 23, 2017

@vilav I have a working solution for AMP that I'm currently writing up. The link @tderflinger is not that flexible though it's a great start. It's also a bit unconventional. For example, you should create your own React component for <amp-img> instead of relying on a script to parse through HTML files and replace <img> with <amp-img>. A component allows you to define fallbacks and set attributes that allow you to leverage AMP goodness.

@tderflinger
Copy link

Hi @misscs! Thanks for your comment! Once you have a working solution, I would also be interested in it!
Kind regards!

@misscs
Copy link

misscs commented Dec 25, 2017

@tderflinger I do have one. The bulk of the code is here #3319

All JS files are pulled out of props.headComponents and what's returned is just what's necessary to pass AMP. You'll need to make sure you are using the latest React so that you can set AMP attributes. React < 16 strips all unknown attributes. You'll need to add them as follow:

<html amp="amp">

or

<style amp-custom="amp-custom">

Lastly, we are use gatsby-ssr.js to add style boilerplate that AMP requires.

I'll post the write-up soon!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
type: question or discussion Issue discussing or asking a question about Gatsby
Projects
None yet
Development

No branches or pull requests

5 participants