Envira Gallery Documentation

Documentation, Reference Materials and Tutorials for Envira Gallery

How to Hide the Pagination Navigation Using CSS

Have you ever wanted to hide the pagination navigation for an Envira Gallery? This tutorial will walk you through the steps you need to do exactly that!


Install and Activate the CSS Addon

Please follow our instructions on how to install and activate addons.

In this instance, you’ll be activating the Envira CSS Addon.


Getting the Envira Gallery ID

The next step you’ll need will be to get the gallery ID number so that when you create your CSS, you’ll include that ID. This will mean you won’t make this change for every paginated gallery on your site.

To do this, edit the gallery you want to make these changes for and look at the shortcode in the sidebar. The sidebar shows you a gallery id number in the shortcode, that is the number we’ll need in our CSS.

Get the gallery ID number


Entering the CSS on the Misc Tab

The final step to tie it all together is to add the CSS to the Misc Tab. While your editing your gallery, click on the Misc Tab, the last input box on that page is called Custom Gallery CSS. Here is where we’ll be adding our CSS.

Copy and paste this CSS into that Custom Gallery CSS box.

div#envira-gallery-wrap-1490 .envira-pagination {
    display: none;
}

You’ll need to change the 1490 above to match the id of your gallery.

Finally click Update on the gallery to save the changes and you’re all done!

Would you like to check out more styling ideas for Envira’s Pagination Addon? Why not check out our article on How to Style Pagination Links?