Skip to content

Gatsby remark plugin to embed Strava activities and profile by their URL

License

Notifications You must be signed in to change notification settings

cedricdelpoux/gatsby-remark-strava

Repository files navigation

gatsby-remark-strava

Npm version Npm downloads MIT license PRs welcome

gatsby-remark-strava is a Gatsby remark plugin to embed Strava activities by their URL.

Usage

  1. Download gatsby-remark-strava from the NPM registry:
yarn add gatsby-remark-strava
  1. Generate a token

The package needs 3 .env variables with the following format to work:

STRAVA_CLIENT_ID=2845
STRAVA_CLIENT_SECRET=c3d62caed3sjf4vdjsb096d010d81f52a17ac5
STRAVA_TOKEN={"access_token":"ya...J0","refresh_token":"1..mE","expires_at":1581439030,"expires_in":21600}

gatsby-remark-strava expose a script to make the generation easier.

Open a terminal at the root of your project and type:

gatsby-remark-strava-token
  1. Add the plugin in your gatsby-config.js file. It's important that it is a child plugin of gatsby-transformer-remark as below, otherwise it won't work.
require("dotenv").config()

module.exports = {
    plugins: [
        {
            resolve: "gatsby-transformer-remark",
            options: {
                plugins: [
                    {
                        resolve: "gatsby-remark-strava",
                        options: {
                            stravaClientId: process.env.STRAVA_CLIENT_ID,
                            stravaClientSecret:
                                process.env.STRAVA_CLIENT_SECRET,
                            stravaToken: process.env.STRAVA_TOKEN,
                            // OPTIONAL
                            render: (activity) => `<div>${activity.name}</div>`,
                        },
                    },
                ],
            },
        },
    ],
}
  1. Add Strava activities links to your content
[strava activity 3657585594 embed](https://www.strava.com/activities/3657585594)

Text need to contains "embed" to be transformed

Showcase

You are using gatsby-remark-strava for your website? Thank you!

Please add your website to the Showcase

Contributing

  • ⇄ Pull/Merge requests and ★ Stars are always welcome.
  • For bugs and feature requests, please create an issue.

Changelog

See CHANGELOG

License

This project is licensed under the MIT License - see the LICENCE file for details