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! 

82

評論

  • 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
    評論操作 永久連結
  • 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
    評論操作 永久連結
  • 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
    評論操作 永久連結
  • You can now hide segments, the title and Street View buttons. Enjoy!

    2
    評論操作 永久連結
  • Wow, that's fantastic! Exactly what I was hoping for—thank you so much. The tool is (for me at least) perfect now :)

    0
    評論操作 永久連結
  • 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
    評論操作 永久連結
  • Hi Andy

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

    0
    評論操作 永久連結
  • 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
    評論操作 永久連結
  • 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
    評論操作 永久連結
  • Hi Roy, the layout on mobile should be better now

    0
    評論操作 永久連結
  • 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
    評論操作 永久連結
  • 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
    評論操作 永久連結
  • Thanks Daniel, if you have any suggestions, let me know

    0
    評論操作 永久連結
  • [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
    評論操作 永久連結
  • 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
    評論操作 永久連結
  • 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
    評論操作 永久連結
  • 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
    評論操作 永久連結
  • @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
    評論操作 永久連結

登入寫評論。

不是您要找的?

新貼文