Shopify themes, liquid, logos, and UX
Hi, we are trying to make the product titles font beneath our products bigger. Any help would be greatly appreciated!
https://sourcedbysab.com/ is the website 🙂
Solved! Go to the solution
This is an accepted solution.
Hey @sourcedbysab,
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.
18px is for desktop, 16px is for mobile. Change the values as you like. They can also be the same value if you want.
<style>
.product-block__title {
font-size: 18px !important;
}
@media only screen and (max-width: 989px) {
.product-block__title {
font-size: 16px !important;
}
}
</style>
Screenshot is for reference only, the correct code to paste is the one shown above.
This is an accepted solution.
oh sorry for that issue
can you please try this code
1. Go to Online Store->Theme->Edit code
2. Asset->/styles.css ->paste below code at the bottom of the file.
@media (min-width: 768px) {.product-block__title {font-size: 20px;} }
This is an accepted solution.
Hey @sourcedbysab,
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.
18px is for desktop, 16px is for mobile. Change the values as you like. They can also be the same value if you want.
<style>
.product-block__title {
font-size: 18px !important;
}
@media only screen and (max-width: 989px) {
.product-block__title {
font-size: 16px !important;
}
}
</style>
Screenshot is for reference only, the correct code to paste is the one shown above.
Thank you so much this worked! but now the price looks kind of small 😅 is there any chance you could show me the code to increase the price font?
Hey @sourcedbysab,
Don't delete the previous one, just add this before it.
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.
16px is for desktop, 14px is for mobile. Change the values as you like. They can also be the same value if you want.
span.product-price__item.product-price__amount.theme-money {
font-size: 16px !important;
}
@media only screen and (max-width: 989px) {
span.product-price__item.product-price__amount.theme-money {
font-size: 14px !important;
}
}
Screenshot is for reference only, the correct code to paste is the one shown above.
This is an accepted solution.
oh sorry for that issue
can you please try this code
1. Go to Online Store->Theme->Edit code
2. Asset->/styles.css ->paste below code at the bottom of the file.
@media (min-width: 768px) {.product-block__title {font-size: 20px;} }
Thank you Ketan
Starting a B2B store is a big undertaking that requires careful planning and execution. W...
By JasonH Sep 23, 2024By investing 30 minutes of your time, you can unlock the potential for increased sales,...
By Jacqui Sep 11, 2024We appreciate the diverse ways you participate in and engage with the Shopify Communi...
By JasonH Sep 9, 2024