[Resolved] Changing color of pagination controls

[Author]

Posts

[alanB-6]

Tell us what you are trying to do?
I am trying to change the Pagination controls to match the color of the site I have made a search on site for previous support request but cannot find a solution.

I have made an attempt via site inspector to target the correct items for CSS and come up with the following

.wpv-filter-pagination-link{
background-color: rgb(75,115,36);
}

.wpv-filter-previous-link{
background-color: #4b7324;
}

.wpv-filter-next-link{
background-color: #4b7324;
}
And have tried both hex and RGB values.

Is there any documentation that you are following?

Is there a similar example that we can see?
hidden link
What is the link to your site?
hidden link

[Shane]

Hi Alan,

Thank you for contacting our support forum.

To change the color of the active link you need to use this css.

.pagination > .active > span{
background-color: rgb(75,115,36) !important;
    border-color: rgb(75,115,36) !important;
}

.pagination > li > a{
color: #337ab7 !important;
}

Please try this and let me know if it helps.

Thanks,
Shane

[alanB-6]

Thanks for that Shane that works in part..

What do I need to outer lines to the same color

[alanB-6]

Also when you click on next or previous or specific page whilst it switches is there any way to stop it flashing back to blue?

[Shane]

Hi Alan,

This is actually because we are overwriting the css for bootstrap later in the load process of the page.

What you can do to help with this is to use the AJAX pagination instead of a full page reload.

Thanks,
Shane