Styling of pagination

Sparkling
1

I’m very pleased with the Sparkling pagination, but I’m having some trouble styling it properly.

My site: www.test.bageglad.dk

I would like to have a different background color and font color for the active page (current).
I would also like to have a different background color on the other page numbers on hover.
I can only get it to work for my “next” link with the arrow.

Support much appreciated!

2

Hi @tjuel,

I hope you are well today and thank you for your question.

You can try achieving this by adding the following CSS code in the Custom CSS option of the latest version of Sparkling theme on the below path.

Admin Area -> Appearance -> Customize -> Sparkling Options -> Other -> Custom CSS

.pagination a:hover {
    color: #FFF;
    background-color: #3E9DAD;
}
span.page-numbers.current {
    color: #FFF;
    background-color: #3E9DAD;
}

Please change the color value in the above code to whatever you want to use by referring the following pages.

http://www.w3schools.com/html/html_colors.asp
http://www.w3schools.com/html/html_colorvalues.asp
http://www.w3schools.com/tags/ref_colorpicker.asp

Best Regards,
Movin