• Thank you for the great plugin. So far we are liking it very much.

    I’d like to list our stores below the map. However we are finding that the default view of a list causes the site visitor to scroll way too much. We’d like to change to a columnar view (maybe 3 columns) when the user is on a computer but have the listing change to a single column on a phone.

    I found some css customizations that allowed for changing the view to 2 or 3 columns but when I do that, the display looks great on a PC but horrible on the phone.

    I used the css customization listed at this following link for the current columns.
    https://wordpress.org/support/topic/store-listings-in-multiple-columns-below-map?replies=5

    It seems that this is a frequently asked question but I’m having a hard time pinning down the solution.

    We are using WP Store Locator 2.2.2 with WordPress 4.5.3

    Thanks for your help in advance.
    Andy

    https://wordpress.org/plugins/wp-store-locator/

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter davidsona303

    (@davidsona303)

    Just checking in. Anyone have an idea of how to make this work with responsive columns?

    @davidsona303

    This custom CSS will give you three columns.

    /*store location */
    #wpsl-result-list li {
    width: 33%;
    float:left;
    }

    this will revert to one column when the screen size is narrower than 767px (ipad mini) you can change that to be 480 so it’s just phone, etc.

    @media screen and (max-width: 767px) {
    #wpsl-result-list li {
    width: 100%;
    float:left;
    }
    }

    • This reply was modified 9 years, 7 months ago by tlash.
Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘How to list stores with responsive columns’ is closed to new replies.