How can I adjust the price on the mobile home page section 'Collage'?

Store Design
1

Hi

Need help to change the price on the mobile home page in the section “Collage”, I can change it on desktop, but how I can do it on mobile?

Screenshot 2023-02-08 at 20.53.05.png
Screenshot 2023-02-08 at 20.53.05.png412×518 36.3 KB

web: homeda.co.uk

psw: picture

Thanks

2

Hi, @Deoxes . I’m happy to help you out with this! Can you tell me more about what you’re trying to do? Are you hoping for your desktop and mobile views to have different prices?

Once you change your product’s price in the Products section of the Shopify admin, the price will be changed everywhere on your online store. You can read more about adding and updating products here.

If you’d like to see how this is displayed on your desktop view versus your mobile view, you can look at your storefront using your theme editor. There’s a setting that allows you to quickly switch between both views. To get into your theme editor go to Online store > Themes > Customize within your Shopify admin. From here, click Customize next to the theme you’re using. Once you’re in your theme editor you can use the icons in the top right of the page to view different versions of your storefront.

08-27-63956-35511
08-27-63956-355112558×194 33.7 KB

To be sure this is working correctly I took a look at the product you shared as an example, on your storefront. The price for this product is appearing the same both on desktop and mobile. You can see how this looks below:

Desktop:

08-30-52353-59955
08-30-52353-599551308×720 80 KB

Mobile:

08-31-83717-38291
08-31-83717-38291488×793 72.7 KB

Please let me know if you have any questions!

3

@PageFly-Kate Can you add to me this code for mobile? Thanks

4

Hi @Deoxes

This is Kate from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/component-price.css->paste below code at the bottom of the file:

@media screen and (max-width: 767px) {
    .collage__item--product .card-information .price-item.price-item--regular {
        font-size: 20px !important;
    }
}

Hope my answer will help you.

5

@PageFly-Kate Thank you it works.