Solved

How can I make the price bold on the Expanse theme?

Eze_Paul
Excursionist
38 0 8

Hi Guys, I recently updated my Expanse theme to the newest version. All my configuration disappeared after the update. I would like to remove the word ''price'' on product page and also make the price bold enough. How should I do that?

 

Thanks!

 

www.hyggehusmobler.se

 

Screenshot 2024-02-25 at 03.22.58.png

Accepted Solutions (3)

techlyser_web
Shopify Partner
1533 283 303

This is an accepted solution.

Hello @Eze_Paul 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid

<style>
  .product-block.product-block--price label {
      display: none !important;
  }
  span.product__price span {
     font-weight: 800 !important;
  }
</style>

techlyser_web_0-1708837091878.png

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

Techlyser || Shopify Partner || Helping eCommerce Stores
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.
- For further discussion contact: Email ID- info@techlyser.com

View solution in original post

ThePrimeWeb
Shopify Partner
2127 608 474

This is an accepted solution.

Hey @Eze_Paul,

 

Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag paste the following. Screenshot attached for reference.

<style>
.product-block.product-block--price > label {
    display: none !important;
}

.product-block[data-dynamic-variants-enabled] {
    display: none !important;
}

span.product__price {
    font-weight: 600 !important;
}
</style>

 

Screenshot is for reference only, the correct code to paste is the one shown above.

ThePrimeWeb_0-1708840312860.jpeg

 

Result:

ThePrimeWeb_1-1708840343401.png

 

 

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!

View solution in original post

techlyser_web
Shopify Partner
1533 283 303

This is an accepted solution.

@Eze_Paul 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid

<style>
@media screen and(max-width: 767px){
  span.product__price span {
    font-weight: 900 !important;
    font-size: 25px !important;
  }
}
</style>

techlyser_web_0-1708859015833.png

 

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

Techlyser || Shopify Partner || Helping eCommerce Stores
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.
- For further discussion contact: Email ID- info@techlyser.com

View solution in original post

Replies 9 (9)

PageFly-Oliver
Astronaut
878 190 171

Hi @Eze_Paul ,

 

You can try this code by following these steps:

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

Step 2: Search file theme.liquid

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

 

<style>
[for="ProductPrice-template--20866884960585__main"]{
display:none !important
}
.product__price{
font-weight:600 !important
}
</style>

 

 

Hope my solution works perfectly for you!

Best regards,

Oliver | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

techlyser_web
Shopify Partner
1533 283 303

This is an accepted solution.

Hello @Eze_Paul 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid

<style>
  .product-block.product-block--price label {
      display: none !important;
  }
  span.product__price span {
     font-weight: 800 !important;
  }
</style>

techlyser_web_0-1708837091878.png

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

Techlyser || Shopify Partner || Helping eCommerce Stores
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.
- For further discussion contact: Email ID- info@techlyser.com
Eze_Paul
Excursionist
38 0 8

Great! The price word is gone, but the price bold only works on desk, any code for both desk and mobile?

Thank you!

techlyser_web
Shopify Partner
1533 283 303

@Eze_Paul 
Firstly Please accept my solution. 

Techlyser || Shopify Partner || Helping eCommerce Stores
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.
- For further discussion contact: Email ID- info@techlyser.com
techlyser_web
Shopify Partner
1533 283 303

This is an accepted solution.

@Eze_Paul 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid

<style>
@media screen and(max-width: 767px){
  span.product__price span {
    font-weight: 900 !important;
    font-size: 25px !important;
  }
}
</style>

techlyser_web_0-1708859015833.png

 

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

Techlyser || Shopify Partner || Helping eCommerce Stores
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.
- For further discussion contact: Email ID- info@techlyser.com

ThePrimeWeb
Shopify Partner
2127 608 474

This is an accepted solution.

Hey @Eze_Paul,

 

Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag paste the following. Screenshot attached for reference.

<style>
.product-block.product-block--price > label {
    display: none !important;
}

.product-block[data-dynamic-variants-enabled] {
    display: none !important;
}

span.product__price {
    font-weight: 600 !important;
}
</style>

 

Screenshot is for reference only, the correct code to paste is the one shown above.

ThePrimeWeb_0-1708840312860.jpeg

 

Result:

ThePrimeWeb_1-1708840343401.png

 

 

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!
Eze_Paul
Excursionist
38 0 8

Thank you!, The price word is gone, but the price bold only works on desk, any code for both desk and mobile?

ThePrimeWeb
Shopify Partner
2127 608 474

Hey @Eze_Paul,

 

I don' think you used the code I provided. 

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!

tharu00
Visitor
1 0 0

ssssssssssssssssss