Change "Low Stock Notice" font to italic?

Sheehan · ‎06-05-2024

I am looking to change the font on my low stock notice to italic. Any ideas how to do this? I am using Beyond 3.4.3. theme. I circled the low stock notice in red in the photo. I want to change that font to italic.

TerenceKEANE · ‎06-06-2024

You need to place it right above the </head> tag, as shown in the picture. There are issues in the upper sections. Also, I recommend trying the “!important” property as well.

<style> 
.product-low-stock--root { 
font-style: italic!important;
} 
</style>

★ Looking for Dedicated Premium Coding Support? Join our unique "PREMIUM SUPPORT" service starting at 59 USD for 1 MONTH!
★ Get skilled Shopify developers at BUDGET-FRIENDLY RATES — explore Novajetsoft.com for a rapid quote!
☕ If my support was a lifeline for you, The COFFEE
would be the anchor keeping me steady!
★ For Quick response --> WhatsApp | Email --> [email protected] | Software Engineer - Specializing In Advanced E-Commerce Websites

View solution in original post

TerenceKEANE · ‎06-05-2024

Hi,

The following code will do what you want. You can change the values as you like. If you encounter any issues again, feel free to write, I'll help.

1) Navigate to the 'Edit Code' option in your theme settings, then search for 'theme.liquid' in the search bar.

2) Paste the following code below the '<head>' tag. Please refer to the attached screenshot for guidance.

<style>

.product-low-stock--root {
    font-style: italic;
}

  
</style>

★ Looking for Dedicated Premium Coding Support? Join our unique "PREMIUM SUPPORT" service starting at 59 USD for 1 MONTH!
★ Get skilled Shopify developers at BUDGET-FRIENDLY RATES — explore Novajetsoft.com for a rapid quote!
☕ If my support was a lifeline for you, The COFFEE
would be the anchor keeping me steady!
★ For Quick response --> WhatsApp | Email --> [email protected] | Software Engineer - Specializing In Advanced E-Commerce Websites

Sheehan · ‎06-05-2024

I am pasting the code here. But it doesn’t seem to be working. Also when I type in code and hit "preview store" it will preview with the code changes I just made, right?

TerenceKEANE · ‎06-06-2024

You need to place it right above the </head> tag, as shown in the picture. There are issues in the upper sections. Also, I recommend trying the “!important” property as well.

<style> 
.product-low-stock--root { 
font-style: italic!important;
} 
</style>

★ Looking for Dedicated Premium Coding Support? Join our unique "PREMIUM SUPPORT" service starting at 59 USD for 1 MONTH!
★ Get skilled Shopify developers at BUDGET-FRIENDLY RATES — explore Novajetsoft.com for a rapid quote!
☕ If my support was a lifeline for you, The COFFEE
would be the anchor keeping me steady!
★ For Quick response --> WhatsApp | Email --> [email protected] | Software Engineer - Specializing In Advanced E-Commerce Websites

Sheehan · ‎06-06-2024

This worked. Thank you for your help

TerenceKEANE · ‎06-06-2024

You are welcome.. It was just a small thing for me. 🙂

I'm not sure what level of assistance you're looking for here, but if you're seeking affordable, monthly, or long-term advanced help, we can also offer you the 'Shopify Premium Support' service that we provide to many others here. Our service is not hourly or per project, it's monthly. You can request as much assistance as you need. We can customize your theme according to your requirements.

There is no limit as a support request!

Generally, we provide superficial assistance here. The detailed help is provided to our clients through 'Premium Support.'

If you have an e-commerce store or website, working with someone who can provide continuous assistance will always be better for you.

In addition to quick solutions, we provide:

Fast Turnaround
Dedicated Advanced Front-End Coding Assistance with CSS and Javascript
Animated Coding Support
Free Advanced Apps ( 9 Apps)
Comprehensive On-Site and Off-Site SEO Reports ( and competitors' advertising keywords)
Expert Consulting
Unique Mobile Premium Features
Design and Frontend Management
Free Business Email

and much more...

Maybe you're tired of constantly seeking help here, so I wanted to write this. Assistance on the Shopify community is usually quite superficial.

If you're interested, you can check out the link in my signature. Feel free to reach out via private message or email if you have any questions. 🙏

Terence...

★ Looking for Dedicated Premium Coding Support? Join our unique "PREMIUM SUPPORT" service starting at 59 USD for 1 MONTH!
★ Get skilled Shopify developers at BUDGET-FRIENDLY RATES — explore Novajetsoft.com for a rapid quote!
☕ If my support was a lifeline for you, The COFFEE
would be the anchor keeping me steady!
★ For Quick response --> WhatsApp | Email --> [email protected] | Software Engineer - Specializing In Advanced E-Commerce Websites

BSSCommerce-HDL · ‎06-05-2024

Hi @Sheehan,
Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

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

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

product-low-stock-root.product-low-stock--root {
    font-style: italic !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 😍

Sale banner, pop ups: Customize your sale banner, pop-ups and create countdown bar to boost conversion rate.
Simicart: Transform your Shopify store into a stunning and fully functional mobile app with just a few simple steps.
Product Labels & Badges: Get more sales with striking labels, badges, and banners from our 10,000+ available templates.

BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

Change "Low Stock Notice" font to italic?

Change "Low Stock Notice" font to italic?

Community Blog Articles