It is a gatsby plugin that lets you easily embed twitter, instagram, youtube, vimeo, codepen, soundcloud, reddit and more on your site!

It is my first ever package on npm and it would be great to get more eyes on it. Report any problems you might find as an issue, and submit a PR if you have time :D

Thanks in advance!

raae / gatsby-remark-oembed

A GatsbyJS Plugin that transforms oembed links into its corresponding embed code.

Gatsby Remark Oembed Plugin

This GatsbyJS Remark Sub-Plugin transforms oembed links (Twitter, Instagram, YouTube, Vimeo, SoundCloud, CodePen etc.) into its corresponding embed code.

This is an early version of the plugin. Let me know if you have problems or questions by submitting an issue.

Install

npm install @raae/gatsby-remark-oembed

Requirements

Node version 8 and up.
Gatsby version >=2.0.88
Gatsby Transformer Remark Plugin >=2.0.0

Oembed support

Under the hood the oembed provider list from oembed.com is used.

So far these providers are confirmed to be working: CodePen, Flickr, Instagram, Reddit, Twitch, Twitter, Vimeo, YouTube, SoundCloud.

Twitter, Flickr, Instagram and Reddit requires external javascript to be added to every page. So make sure to exclude the ones you do not need.

Example site

Check out gatsby-remark-oembed.netlify.com/. Its source code can be found on Github.

How to use

Configuration

// In your gatsby-config.js
plugins: [
  {
    resolve: `gatsby-transformer-remark`
    options: {
      plugins: [

…

View on GitHub

DEV Community

Discussion on: Who's looking for open source contributors? (Jan 21st edition)

@raae/gatsby-remark-oembed