Adjust font size for Product Quantity in Filter and Price Sizes

[Verterra]

Hi, I am currently experiencing some different font sizes on my website, particularly for the

1. Filter menu (the number of products listed is smaller than the rest of the filter labels), and;
2. For the old sales price, which is now much smaller than the current sale price displayed 

My file preview link is here: https://verterra.sg/?_ab=0&_fd=0&_sc=1&preview_theme_id=166588514587

Thanks!

[BSSCommerce-HDL · Accepted solution]

Hi @Verterra, 

You can try this code by following these steps:

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file base.css,  theme.css or styles.css

Step 3: Insert the below code at the bottom of the file -> Save

 h2.product-count__text.text-body {
        font-size: 17px !important;
    }

    s.price-item.price-item--regular {
        font-size: 17px !important;
    }

Here is result: 

Hope this can help you, 

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍😍

[BSSCommerce-HDL · Accepted solution]

Hi @Verterra, 

You can try this code by following these steps:

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file base.css,  theme.css or styles.css

Step 3: Insert the below code at the bottom of the file -> Save

 h2.product-count__text.text-body {
        font-size: 17px !important;
    }

    s.price-item.price-item--regular {
        font-size: 17px !important;
    }

Here is result: 

Hope this can help you, 

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍😍

[Verterra]

Thank you for your help! 

[Vinsinfo · Accepted solution]

@Verterra Please follow the below steps to adjust the font size for the product count displayed in the filter and price sizes. Let me know whether it is helpful for you.

1. Go to "Online stores" -> "Themes".

2. Click action button from the current theme and select "Edit code".

3. Search "base.css" file and paste below code at the bottom of the file like in the below attached screenshot.

.facets-container .product-count__text, .price--on-sale .price-item--regular {
    font-size: 1.8rem !important;
}
@media screen and (max-width: 749px){
    .facets-container .product-count__text {
        font-size: 1.5rem !important;
    }
}

Final result will be like the below image,

Please provide your support by click "Like" and "Accepted" if our solution works for you. Thanks for your support.

[Verterra]

Hi, this worked perfectly for me. Thank you! 🙂