Support » Plugin: WP-Strava » The best there is, but room for improvement

  • Strava’s own facility to embed activities is rubbish, due to the fact that it’s not responsive.

    This plugin is partially responsive and can be made fully responsive with a bit of tweaking.

    Firstly, a little CSS:

    .wp-strava-ride-container img {
      max-width: none;
      width: 100% !important;
    }

    Then ftp to wp-content/plugins/wp-strava/lib/RideShortcode.class.php

    Download the file and then edit it. Inside you’ll see the markup for the information table.

    Copy it and paste it twice, you will then have three identical tables. Then remove the bottom three rows from the second table and the top three rows from the third table.

    You will now have a normal six column table and two three column tables.

    Wrap the first table in a div and invent a class (e.g. <div class=”mobhide”>)

    Wrap the second two tables in another div (e.g. <div class=”mobshow”>)

    Then add some CSS to your stylesheet like this (change according to the widths of your site)

    @media (max-width: 800px) {
    	.mobhide{
    	display:none;
    }
    }
    @media (min-width: 800px) {
    	.mobshow{
    	display:none
    }
    }

    The map will now always be full width and when the page gets too narrow, the columns will split into two rows, so the content wont overflow, as it currently does.

    The plugin generates an image for the map, which is great because you can’t style the map or interact with it. Adding those features would significantly improve the plugin, but credit has to be given to the devs for making the only Strava plugin that has the potential to work responsively.

  • The topic ‘The best there is, but room for improvement’ is closed to new replies.