Solved

Narrative Theme Make sale price red and increase price font size

ReneeT
Tourist
5 0 1

Hello!

I have the narrative theme and I added a code to make the sale price red, but I also want to increase the font size on the price (product page and home page).  I also want the shipping underneath to be a larger font size.  Can anyone help?  Thank you much.

ReneeT_0-1626851863558.png

 

Accepted Solutions (2)
Kinjaldavra
Shopify Partner
2302 570 1422

This is an accepted solution.

hello @ReneeT 


please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

.product__current-price{
    font-size:20px;
}

.product__policies.rte{
    font-size:20px !important;
}

 

View solution in original post

dmwwebartisan
Shopify Partner
12282 2546 3694

This is an accepted solution.

@ReneeT 

Please add following css 

.product__price--sale .product__compare-price, .product__price--sale .product__compare-price-label {
    font-size: 35px !important;
}

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app

View solution in original post

Replies 10 (10)

dmwwebartisan
Shopify Partner
12282 2546 3694

@ReneeT 

Please share your store URL.

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app
ReneeT
Tourist
5 0 1

Hi @dmwwebartisan and @Kinjaldavra

It is www.titanscrubbrush.com  The current code I'm currently using is below, but it doesn't allow me to change the font size on the price on the home page or product page.  Thank you! 

.product__price--sale .product__current-price {color: #FF0000 !important;} s:after {background-color: #FF0000 !important;}

Kinjaldavra
Shopify Partner
2302 570 1422

This is an accepted solution.

hello @ReneeT 


please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

.product__current-price{
    font-size:20px;
}

.product__policies.rte{
    font-size:20px !important;
}

 

ReneeT
Tourist
5 0 1

Hi @Kinjaldavra,

That definitely did the trick.  Just one more item...now the original price is tiny.  Is there a way to change that?  Snapshot below.  Appreciate your help.

ReneeT_0-1626935247840.png

 

 

dmwwebartisan
Shopify Partner
12282 2546 3694

@ReneeT 

Please share your webshop URL!

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app
ReneeT
Tourist
5 0 1

Hi @dmwwebartisan.  It's www.titanscrubbrush.com.  I have the code below added.  Thanks.

.product__price--sale .product__current-price {color: #FF0000 !important;} s:after {background-color: #FF0000 !important;}

dmwwebartisan
Shopify Partner
12282 2546 3694

This is an accepted solution.

@ReneeT 

Please add following css 

.product__price--sale .product__compare-price, .product__price--sale .product__compare-price-label {
    font-size: 35px !important;
}

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app
Kinjaldavra
Shopify Partner
2302 570 1422

hello @ReneeT 

please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

 

.product__compare-price{
	
	    font-size:20px; !important;
}

 

Kinjaldavra
Shopify Partner
2302 570 1422

Hello @ReneeT 

Can you please share your web url 

ReneeT
Tourist
5 0 1

Thanks, @dmwwebartisan and @Kinjaldavra.  What a wonderful community.  I used both of your codes as part of the solution.  Have a great day!