Add Pagination to WordPress Theme Without Plugin

Adding pagination to a WordPress theme without plugins involves several steps. We'll go through these steps. Before adding pagination, subtheme I recommend you create a .

Adding CSS Codes to WordPress

Add the following CSS code to your theme's style.css file. You can customize the file to your liking.

/* Pagination */ .wp_paging { margin: 0 0 20px;    padding: 0; } .wp_paging ul { margin: 0;    padding: 0;    list-style: none; } .wp_paging ul li { margin: 0;    padding: 0;    display: inline; } .wp_paging ul li a { float: left;    display:block;    color: #666;    text-decoration: none;    margin-right: 5px;    padding: 5px 10px;    background-color: #FFFFFF;    border: 1px solid #999; } .wp_paging ul li a:hover { color: #090; } /* Pagination End */

Adding Functions to WordPress

Add the following function to your theme's functions.php file. You can customize the HTML code within the function.

/* Pagination */ function pagination($pages = &#039;&#039;, $range = 2) { $showitems = ($range * 2)+1; global $paged; if(empty($paged)) $paged = 1; if($pages == &#039;&#039;) { global $wp_query; $pages = $wp_query-&gt;max_num_pages; if(!$pages) { $pages = 1; } } if(1 != $pages) { echo &quot;<div class='wp_paging'><ul>&quot;; if($paged &gt; 2 &amp;&amp; $paged &gt; $range+1 &amp;&amp; $showitems &lt; $pages) echo &quot;<li><a href='/en/".get_pagenum_link(1)."/'>First</a></li>&quot;; if($paged &gt; 1 &amp;&amp; $showitems &lt; $pages) echo &quot;<li><a href='/en/".get_pagenum_link($paged - 1)."/'>Previous</a></li>&quot;; for ($i=1; $i <= $pages; $i++)
        {
            if (1 != $pages &&( !($i >= $paged+$range+1 || $i <= $paged-$range-1) || $pages <= $showitems ))
            {
                echo ($paged == $i)? "<li><a href='#'>&quot;.$i.&quot;</a></li>":"<li><a href='/en/".get_pagenum_link($i)."/'>&quot;.$i.&quot;</a></li>&quot;; } } if ($paged &lt; $pages &amp;&amp; $showitems &lt; $pages) echo &quot;<li><a href='/en/".get_pagenum_link($paged + 1)."/'>Next</a></li>&quot;; if ($paged &lt; $pages-1 &amp;&amp; $paged+$range-1 &lt; $pages &amp;&amp; $showitems &lt; $pages) echo &quot;<li><a href='/en/".get_pagenum_link($pages)."/'>End</a></li>&quot;; echo &quot;</ul><div class='cleaner'></div></div>&quot;; } } /* pagination */

Adding Pagination

We add the page to the desired location in the theme using the code below.

<?php pagination(); ?>