Solved

How can I make product titles bold and bigger on collection page using CSS?

ThomasECOM
Tourist
10 0 1

Hello everyone,

 

I'm using the Theme Shella and yould like to know how to change the product title on the collection page only in Bold and Bigger using CSS.

 

Anyone can have a look for me? https://mykarma.fr

  

 

Product name.png

 

 

Accepted Solution (1)
Nayabkhan
Excursionist
12 1 1

This is an accepted solution.

yes for this first you will have to go in code editor then you need to select collection.liquide file then find a class name from your theme for the text and use this code at the bottom of the page 

<style>
.classname{
font-weight:bolder;
font-size: 20px!important
}

</style>
If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on nayabkhann099@gmail.com regarding any help

View solution in original post

Replies 10 (10)

Nayabkhan
Excursionist
12 1 1

Can you please share your website link.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on nayabkhann099@gmail.com regarding any help
ThomasECOM
Tourist
10 0 1
Hello, my website link is https://mykarma.fr 😇🙏
Nayabkhan
Excursionist
12 1 1

 Okay thanks let me check 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on nayabkhann099@gmail.com regarding any help
ThomasECOM
Tourist
10 0 1

Is it possible to have the CSS to add instead? So I can understand and learn in case I need to update the theme. 

vcercelariu
Excursionist
17 0 5

Try adding this to your css file

.product-collection__title {

     font-weight: bold;

}
ThomasECOM
Tourist
10 0 1

This doesn't work unfortunately :S 

Nayabkhan
Excursionist
12 1 1

This is an accepted solution.

yes for this first you will have to go in code editor then you need to select collection.liquide file then find a class name from your theme for the text and use this code at the bottom of the page 

<style>
.classname{
font-weight:bolder;
font-size: 20px!important
}

</style>
If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on nayabkhann099@gmail.com regarding any help
vcercelariu
Excursionist
17 0 5

You will only have to add the line code to the CSS file, there is no need to edit the collection.liquide file

ThomasECOM
Tourist
10 0 1

@vcercelariu  Sure but isn't it more complicated to make it from the CSS file itself? 

vcercelariu
Excursionist
17 0 5

Not complicated at all, you just have to add the code line at the bottom of your CSS file.