Display Cart Summary on Mobile

Follow

By default, Bold Cashier will collapse the cart summary on mobile devices. If you would like to display the cart summary by default, follow this guide.

If you would like to just display the discount code box by default, go to: Display Discount Code Box on Mobile.

To display the cart summary by default, on mobile, please follow these steps:

  1. From Shopify's admin, select Apps.

    Select Apps

  2. Select Bold Cashier.

    Bold Cashier

  3. Select Settings, then General Settings.

    Settings/General Settings

  4. Copy and paste this code into the Custom CSS field.
    @media only screen and (max-width: 999px) {
    .Summary .SummaryMain {
    max-height: 100%;
    overflow: visible;
    display:block;
    }
    .Summary  .SummaryHeader__Overview {
       opacity: 0;
    }
    .Summary--alt .SummaryHeader__Title::before{
    transform:none !important;
    }
    .Summary--alt .SummaryMain {
    display:none;
    }
    .Summary--alt .SummaryHeader__Overview {
       opacity: 1;
    }
    .Summary .SummaryHeader__Title::before {
    transform: rotate(90deg);
    }
    }

    Paste Code/Custom CSS

  5. Select Save.

    Select Save

Helpful Links:

0 out of 0 found this helpful

Comments

0 comments

Please sign in to leave a comment.