Strava Widget for Routes: Imbed a Strava Route in a website/blog

This is a suggested feature for Strava to build a widget so that Strava Route data can be imbedded in external websites like personal sites and blogs. This would be useful in planning an event or group ride, as well as sharing maps and good run/ride routes outside of the Strava website. The widget could be similar to the current Activity Widget that Strava created for an individual activity. 

Vote if you agree! 

84

Opmerkingen

49 opmerkingen
  • Thanks for the great feedback! I've adjusted the code a bit. the cookie message shouldn't appear anymore (blame the EU for that one). I've moved the text info off to the right so the elevation and map are closer together which makes it a bit more obvious that hovering over the elevation chart does show a marker on the map.

    I'll have a look at adding distance markers as well.

    I certainly plan to keep it up and running (my website has been around for 16 years with only the occasional outage). The only thing that may cause problems at the moment is that my Strava API quota is pretty low so the route may not appear if I've gone over the quota. I can fix that easily enough by caching the data but haven't got round to it yet

    1
    Acties voor opmerkingen Permalink
  • Chris: This is an excellent tool, thank you for making it! Was looking for something like this and am surprised that Strava don't offer something similar themselves.

    If you don't mind me offering a small piece of feedback, while it's already great, if you had the ability to select which information was shown when embedded, I think it'd be even better. By way of example, I'd prefer to simply show the map, elevation profile, and have a link to download GPX (without the street view links, segment information etc.) as I'm after a clean look.

    This is the site I'm working on: http://stormriderskr.blogspot.com/p/race-mct-geumsan.html – it's not live yet, but will have information pages like this on all the major races that take place in Korea, as well as maps of good local rides. I like the look of the current Google Maps embed I'm using, but cyclists obviously want to know the elevation information ! Another benefit of your tool is that I'd not to have to upload the GPX and create a download link separately.

    Anyway, just a suggestion—I know this is a passion project and am thankful for what you've done already. Cheers!

    0
    Acties voor opmerkingen Permalink
  • Hi Jon

    Always happy to get some feedback. I think it should be pretty straightforward to add some customisation options. I will have a look at it

    0
    Acties voor opmerkingen Permalink
  • You can now hide segments, the title and Street View buttons. Enjoy!

    2
    Acties voor opmerkingen Permalink
  • Wow, that's fantastic! Exactly what I was hoping for—thank you so much. The tool is (for me at least) perfect now :)

    0
    Acties voor opmerkingen Permalink
  • I've added my vote for this feature from Strava.  For our charity ride with 800 entrants we will have to use ridewithgps to provide embedded maps as we can't use Strava.

    Chris: I've tried your tool but can't see how to hide segments etc

    0
    Acties voor opmerkingen Permalink
  • Hi Andy

    When you enter the ID for a route, you should see three tick boxes that let you customise the embedding code?

    0
    Acties voor opmerkingen Permalink
  • Chris, fantastic work! I've been looking for a wordpress widget or any code and nothing exists - except for yours! Get that as a plugin for free and then a better version to sell - there's a gap for this for sure and clearly a lot of work has gone into it. I see veloviewer have a 3d set up: http://blog.veloviewer.com/embeddable-strava-route-interactive-3d-profiles/ which is interesting. All I'd say is maybe a bit of layout styling (example - I have descriptions of my routes which are pushed to the right and go way down the page so it's a bit unattractive) and responsive @media queries to shift the layout for smaller screens and mobile devices. I'd be happy to help out with css! You could even put this on github too? Other developers could help you extend the capabilities? Amazing work mate, thanks!

    0
    Acties voor opmerkingen Permalink
  • Thanks Ron. Totally agree the styling could be improved, I'm a developer so my design skills are somewhat limited! I've done some responsive stuff in the past so I'll have a play.

    Could you give me the ID of the route you had trouble with so I can try to fix that as well?

    0
    Acties voor opmerkingen Permalink
  • Hi Roy, the layout on mobile should be better now

    0
    Acties voor opmerkingen Permalink
  • I could really use this for the Tent City Marathon website. All 3,000 participants that visit the site each year would get a look at Strava.  

    0
    Acties voor opmerkingen Permalink
  • Chris, you are a legend.

    As part of a running club, I am looking at ways to share some routes on our website, and this solution is looking good.  We may not end up using it, but I wanted to commend you on your efforts in any case.

    Thanks :-D

    0
    Acties voor opmerkingen Permalink
  • Thanks Daniel, if you have any suggestions, let me know

    0
    Acties voor opmerkingen Permalink
  • [edit] Strava has already an embed module for this... Sorry :)

     

    "Hi Chris, 

    Super cool tool! Thanks for this! 

    I'd like to embed a segment rather than a route, does the tool allows that? 

    Something like : 

    > segment name 

    > gpx route 

    > segment infos

    > top 5 riders 

    > download the route 

    Thanks, 

    Vincent"

    0
    Acties voor opmerkingen Permalink
  • Amazing job Chris! This embedded widget is indeed a valuable thing, can't understand why Strava didn't make it by themselves. 

    Let me ask you, is it possible to color the elevation graph the same way as it appears on Strava? With a light grey background instead of yellow. 

    Also, have you might considered putting the code open source? I would be happy to contribute! :)

    Thanks a lot!

    0
    Acties voor opmerkingen Permalink
  • Zsolt

    I've updated the elevation chart so it's more similar to the Strava one. I may open source the code at some point but it's all tightly integrated with my website code at the moment so it's going to take some effort

    0
    Acties voor opmerkingen Permalink
  • We looking have link on our website that goes the routes form our locations. We currently have 3 locations with 2 more opening in 2018.

    Is there a way to link the routes and allow customers to view with out being logged into our account?

    Thank You

    0
    Acties voor opmerkingen Permalink
  • @Rbm R., if the route is public, you can add a link to the Strava page which anyone should be able to see. Or you can embed the route using my widget, https://www.doogal.co.uk/StravaRoute.php

    0
    Acties voor opmerkingen Permalink
  • Can't you use the api for this?

    0
    Acties voor opmerkingen Permalink

U moet u aanmelden om een opmerking te plaatsen.

Niet gevonden wat u zocht?

Nieuw bericht