Increase font-size of pagination in shop page

Dear,

I had a feedback from a customer (and I noticed actually many customers) who didn’t notice the pagination at the shop page. So I’m trying to increase the font-size of those pagination. But I’m not sure which one of the css class I’m supposed to add. See screenshot.

span.page-numbers.current {
font-size : XX px
}

OR

.woocommerce-pagination li .page-numbers {
font-size : XX px
}

Thanks

fount it it’s ok thanks

Actually no I didn’t manage to find it, I tried the following

.woocommerce-pagination li .page-numbers {
	font-size: 18px;
	padding-right: 10px;
	padding-right: 10px;
	padding-top: 5px;
	padding-bottom: 5px;
}

but it’s causing an issue of arrows, which I don’t know where it comes from. you have any idea how I could better increase the size of the shop page pagination?

thanks

Attachments:

You must be logged in to view attached files.

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

body .woocommerce-pagination li .next:before, 
body .woocommerce-pagination li .prev:before {
    font-size: 20px;
}

Change “20” for any size you need.

Best Regards

Hi,

Thanks for the help, I tried the code but modifies only the arrow (see screenshot).

How about the numbers?

Thanks

Attachments:

You must be logged in to view attached files.

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

body .woocommerce-pagination li .page-numbers {
    min-width: 34px;
    height: 34px;
    font-size: 30px;
    line-height: 32px;
}

Change the values as per your needs.

Best Regards

[Author]

Posts