Docs

[hyattcook1]

Hi,

I would love to change the ‘Next Page’ button to a darker color. This would make it much more visible against the white background.

Also, could you provide me with the technical name for the ‘Next Page’ button.. I don’t know what to call it.

Thank you for the continuous great support!

[Thai]

Hi There,

Please add the following CSS under Customizer > Custom > Global CSS:

.x-pagination a.prev-next {
    background-color: #000;
    color: #fff;
}

Hope it helps 🙂

[hyattcook1]

Hi,

Thanks so much for the quick reply!

This edits the button colors perfectly; however, is there any code to edit the very light grey border surrounding the buttons?

Thanks again.

[Rue Nel]

Hello Again,

To change the colors of the page navigation, you can make use of this code,

.x-pagination ul {
    background-color: #e5e5e5;
    border: solid 1px #000;
}

.x-pagination a, .x-pagination span {
    background-color: red;
    color: black;
}

.x-pagination a.prev-next {
    background-color: #000;
    color: #fff;
}

.x-pagination span.current {
    background-color: green;
    color: #fff;
}

Feel free to change the colors.

[hyattcook1]

Worked perfectly!

Thanks so much!

[Thai]

You’re most welcome 🙂

If you need anything else please let us know.

[Author]

Posts