Top

How can we help?

Browse our Help Center or visit our Community, still Need Help? Contact Us.

Make the Store Locator Responsive on Mobile Devices

  • Created:
  • Last Updated:
  • Article ID: 204756655
  • Store Locator
  • All Versions
  • Basic CSS knowledge required
  • 15 Minutes

To make the Store Locator responsive on mobile devices, follow these steps:

  1. From "Shopify Admin", select Apps.

    select apps

  2. Select Store Locator.

    select store locator

  3. Select Settings.

    select settings

  4. Select Display Settings.

    select display settings

  5. Copy and paste this code in the "Page Header HTML" field:  
    <style>

@media screen and (max-width: 641px) { 
#col-main { 
width: 96% !important;
margin-left: 10px;
margin-right: 10px;
}
}

</style>

    paste the code

  6. Select Save.

    Save

That's it! 

Next Steps:

Blog Posts: