Make the Store Locator Page More Printer Friendly

• Store Locator
• All Versions
• Basic CSS knowledge required
• 15 Minutes

To make the Store Locator page more printer friendly, please follow these steps:

1. From Shopify's admin, select Online Store.

   

2. Select Actions.

   

3. Select Edit code.

   

4. Under "Assets", select your theme's main CSS file.

   Note: This will vary by theme and could be something like theme.scss.liquid.

   

5. Copy and paste this code to the end of the file:

   @media print {
   
   .search_bar, .return_to_results, .preview-area-plugin-wrapper {
   display: none !important; 
   }
   
   .directions_text {
    height: auto;
    width: 400px;
    margin-left: auto;
    margin-right: auto;
   }
   
   .store_map, .gm-style {
    margin-left:auto !important;
    margin-right: auto !important;
   }
   } 

6. Select Save.

   

That's it!

Next Steps:

• Bulk Import Stores in Store Locator
• Display Settings
• Change the Website Text

Blog Posts:

• Why Store Locator was the Solution for Slawsa from Shark Tank
• Help your customers find you and your products [IRL]