Ecommerce Shopify WordPress Discussion

How To Change The Font Size Of The "In-Stock" Text

Hi, I'm asking for advice on how to change the size and color of the text, it's the inscription "in stock" and the price of the product? Thank you Solved! Go to the solution
Hi, I'm asking for advice on how to change the size and color of the text, it's the inscription "in stock" and the price of the product? Thank you Solved! Go to the solution

December 28, 2023

Thank you very much, I'm done! ?

December 28, 2023

I believe css files should be inside assets directory. From source code i would guess you should have screen.css file. It might be enough to just put this code at the end of this file Expertise in: Shopify Design Changes | Shopify Custom Coding | Custom Modifications

December 28, 2023

I know I'm asking you a lot of questions, I'm sorry. But I don't know where to put this code. I know I have to click on "edit code" but then I don't know which section to put it in. Thank you

December 28, 2023

Take a look at stock element. Right now this stock text inherited font-size from body. Currently 14px is default, you could increase or decrease it. You could add this code to your css file: .stock { font-size: 14px; } Copy Expertise in: Shopify Design Changes | Shopify Custom Coding | Custom Modifications

December 28, 2023

Yes, https://vyprodame.cz/ Pass: 0000

December 28, 2023

Can you give me a link of your store and I will take a look which element you should modify? Expertise in: Shopify Design Changes | Shopify Custom Coding | Custom Modifications

December 28, 2023

Hi, thank you! I found the color change in the theme settings, but unfortunately the font size is not there, I found the code (screenshot) but I don't know how to find it in the code editor. Thank you ?

December 28, 2023

Yes, you could visit this link and learn more about theme settings from shopify: https://help.shopify.com/en/manual/online-store/themes/theme-structure/theme-settings If you couldn't find any useful settings in your theme, you would need to modify your theme files. I am web developer, so it would be easy for me to do it, not sure if you have experience with modifying theme files. if first option does not work, I would just use inspect element in your browser while having mouse cursor on price text, see what tag it uses and search it in your theme files and modify font-size attribute in .css file. Let me know if you need some more help ? Expertise in: Shopify Design Changes | Shopify Custom Coding | Custom Modifications

December 28, 2023

Hi, thanks for the quick reply, can I ask you for more details on how to do this? I'm an amateur at this. Thank you!

December 28, 2023

Hello, you could modify css file in your theme or check your theme settings, it might have this feature already created Expertise in: Shopify Design Changes | Shopify Custom Coding | Custom Modifications

December 28, 2023

I believe css files should be inside assets directory. From source code i would guess you should have screen.css file. It might be enough to just put this code at the end of this file Expertise in: Shopify Design Changes | Shopify Custom Coding | Custom Modifications View solution in original post

December 28, 2023

Hello, You can throw in some custom CSS you just need to go to your theme customizer and while in your customizer click through until you get to that product page. Once you are on that page select click anywhere in that page to select the page. The vast majority of themes have a section you can scroll down to that says Custom CSS. It looks like this: Click it. You can try adding this code: .stock { font-size: 16px; } Copy This is just a generic size, you did not state a size nor a color so we can't really give you exactly what you want but you can play around with the sizes. Now for the color you would add in the line it in like this: .stock { font-size: 16px; color: black; } Copy Again changing the color to whatever you want. Now for the price, we can't see the class name for that in your photo ( it cuts off ) but the same way you got the class from the QTY you can get it from the price. You might even be able to just try .price-item as the selector or .price So then the whole code would look like this: .stock { font-size: 16px; color: black } .price { font-size: 16px; color: green; } Copy Your URL would help us know for sure. Alternatively... You can also try adding this globally or in your css file located in your assets folder. It is usually named something like base.css or main.css or something along those lines. Globally in your <header> section is usually located in your theme file or your index.js file. If you put it in that file within your header tags you would need to wrap the css in <style> tags like this: <style> .stock { font-size: 16px; color: black } .price { font-size: 16px; color: green; } </style> Copy Beaux Barker Developer

December 28, 2023

TurboCommerce make the better internet purchasing globaly

Turbo Multi-language Translator

Make the better internet purchasing globaly

Turbosify SEO Speed Booster

5.0 (7) • Free plan available
Get better conversions by improving store loading speed Installed

Turbo Multi-language Chat - AI Customer service in one hand

TurboCommerce make the better internet purchasing globaly
Our products

The help you need, when you need it

App by Turbo Engine

3 apps • 5.0 average rating

Turbosify Speed Booster

5.0 (7)
Get better conversions by optimizing shopify store Google page speed Installed

Turbosify Translator for Wordpress Woocommerce

5.0 (74) • Free Wordpress Woocommerce Plugin
Translate your wordpress website to multiple language within 1 click, no configuration needed, no No technical required

Grow your business here

Whether you want to sell products down the street or around the world, we have all the tools you need.