WordPress Theme paginate_links Customization like Twitter Bootstrap Pagination

In two steps learn to build a WordPress Post Pagination without plugin.

WordPress only comes bundled with the “next page” and “previous page” links to navigate between different blog overview pages. For better user experience I would recommend to remove those links and replace them with a pagination like most people are using in their wordPress templates. I’ve been focusing a lot of my efforts on better way of implementing Twitter’s Bootstrap with WordPress themes.

Why should you use them?

  • Because they are easier to navigate and the user instantly knows how many posts and pages are available. Its simply good user experience.
  • Using a plugin for this task may be an overkill since you really only need to add a few lines of PHP and CSS to your theme.

Step 1 : The function

You just want to copy/paste the function into your theme feel free to do so, a more detailed description can be found bellow:

 

[code]function Meul Tech _get_bootstrap_paginate_links() {
ob_start();
?>

<div class="pages clearfix">
<?php global $wp_query; $current = max( 1, absint( get_query_var( ‘paged’ ) ) ); $pagination = paginate_links( array( ‘base’ => str_replace( PHP_INT_MAX, ‘%#%’, esc_url( get_pagenum_link( PHP_INT_MAX ) ) ),
‘format’ => ‘?paged=%#%’,
‘current’ => $current,
‘total’ => $wp_query->max_num_pages,
‘type’ => ‘array’,
‘prev_text’ => ‘<<‘, ‘next_text’ => ‘>>’,
) ); ?>
<?php if ( ! empty( $pagination ) ) : ?>

<ul class="pagination">
<?php foreach ( $pagination as $key => $page_link ) : ?>

<li class="paginated_link<?php if ( strpos( $page_link, ‘current’ ) !== false ) { echo ‘ active’; } ?>"><?php echo $page_link ?></li>

<?php endforeach ?>
</ul>

<?php endif ?>
</div>

<?php
$links = ob_get_clean();
return apply_filters( ‘Meul Tech _bootstap_paginate_links’, $links );
}
function Meul Tech _bootstap_paginate_links() {
echo Meul Tech _bootstap_paginate_links();
}[/code]

Step 2 : Pagination File

Now Call Function Meul Tech _bootstap_paginate_links() To display Pagination links. Mostly we will apply pagination in category.php or archive.php file.

[code]<?php Meul Tech _bootstap_paginate_links(); ?>[/code]

Don’t forget to share your doubts in the comment box and also share this post on social media and with your friends becaus“You share, I share, let’s make the world aware”.

You may want to take a look at the following related posts:

Also for more awesome tutorials, please don’t forget to like our facebook page Meul Tech .

Bonus: We also give training on following topics:

                      1. WordPress Training  in Mumbai .

2. Web Designing Training in Mumbai.

3. Bootstrap Training Course in Mumbai.

4. UI / UX Training.

5. IOS Training Institute in Mumbai.