Pagination button styling

Anonymous

#213933

Hi,

I need to style the pagination button so that it’s a rectangular button instead of a round circle which is too small for the text. How can I change this styling please? URL is http://milesandpartners.thriveweb.co.uk/our-team/

Thanks

Trevor

#213953

Your appear to be using our Shortcode Display Results method, and the default results.php code has support for the free WP PageNavi plugin, which allows a lot of options for navigation styling. Did you use that?

Anonymous

#213962

Hi Trevor,

Thank you for your response but this plugin doesn’t help me to achieve what I need. All I want is a button in the center of the page saying “see more experts” in a rectangle box. I can’t see how to change the CSS styling for the round button anywhere?

Anonymous

#214045

Hi Trevor,

Can you help me please ASAP as I need to deliver this project soon! Thank you.

Trevor

#214051

You have some style (not from our plugin) that is shaping the button:

#top .pagination .current, #top .pagination a, #top .fullsize .template-blog .pagination a {
    float: left;
    height: 35px;
    width: 35px;
    line-height: 35px;
    text-align: center;
    padding: 0;
    border-radius: 100px;
    margin-right: 3px;
    box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.2);
}

It is this part:

#top .pagination a {
    border-radius: 100px;
}

So, this should remove that:

#top .search-filter-results .pagination a {
    border-radius: 0;
}

Anonymous

#214065

Thank you that’s great Trevor!

Can I also ask how I alter the custom results.php code you wrote for Enfold so that it’s 4 columns instead of 3?

Thanks.

Trevor

#214067

This reply has been marked as private.

Anonymous

#214069

It was from this thread: https://support.searchandfilter.com/forums/topic/ajax-and-search-filter-pro/

Took me a while to find but it was so helpful!

Trevor

#214071

My guess is ….

In this:

if ( ( $gridRowPostCount == 3 ) || ( $gridRowPostCount == $gridTotalPostCount ) ) {?>
		</div>
		<?php }
   $gridRowPostCount++;
   if ( $gridRowPostCount == 4 ) $gridRowPostCount = 1; ?>

		<?php
	}

The 3 becomes 4 and the 4 becomes 5. Not tested though!!

Anonymous

#214082

Sorry it messes up the styling somewhat…

[Author]

Posts