gatsby-remark-strava
is a Gatsby remark plugin to embed Strava activities by their URL.
- Download
gatsby-remark-strava
from the NPM registry:
yarn add gatsby-remark-strava
- 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
- Add the plugin in your
gatsby-config.js
file. It's important that it is a child plugin ofgatsby-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>`,
},
},
],
},
},
],
}
- 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
You are using gatsby-remark-strava
for your website? Thank you!
Please add your website to the Showcase
- ⇄ Pull/Merge requests and ★ Stars are always welcome.
- For bugs and feature requests, please create an issue.
See CHANGELOG
This project is licensed under the MIT License - see the LICENCE file for details