Add buttons to pagination

how can i add the bootsrap buttons to
this

<?php 
$page_no   = isset( $_GET['page'] ) ? $_GET['page'] : 1 ;
$limit     = 3;
$offset    = ( $page_no-1 )*$limit;
$query     = " SELECT * FROM post LEFT JOIN category ON post.category = category.category_id LEFT JOIN  users ON post.author = users.id LIMIT " . $offset . " , " . $limit ;


$result    = mysqli_query( $link, $query );
$num       = mysqli_num_rows( $result );


?>


<?php
                          
                        if( $num>0 ){
                            
                            while( $blog = mysqli_fetch_assoc($result) ) :

                        ?>


<?php
                            endwhile;
                            }
                          
                        $q             = " select * FROM post ";
                        $res           = mysqli_query( $link, $q );
                        $num           = mysqli_num_rows( $res );
                        $total_pages   = ceil( $num/$limit ) ;
                        echo "<ul class='pagination'>" ;
                        echo  $page_no>1 ?  " <li><a href=' news.php?page=". ($page_no-1) . " '>Prev</a></li> " : "";
                        for( $i=1 ; $i<=$total_pages ; $i++){
                          $active = $page_no==$i ? "active" : "";
                          echo " <li class='" . $active . "'><a href='news.php?page=". $i ."'>" . $i . "</a></li> ";
                        }
                         echo  $total_pages>$page_no ?  " <li><a href=' news.php?page=". ($page_no+1) . " '>Next</a></li> " : "";



                        echo "  </ul>" ;


                      ?>


Bootstrap4 has a default pagination component that you could alter to match your drawing.

Here’s a very quick mock up.

You should be able to deconstruct that into your php without too much effort.

Thank you

i just dont know how to separate this code

thats the problem



<?php
                           endwhile;
                           }
                         
                       $q             = " select * FROM post ";
                       $res           = mysqli_query( $link, $q );
                       $num           = mysqli_num_rows( $res );
                       $total_pages   = ceil( $num/$limit ) ;
                       echo "<ul class='pagination'>" ;
                       echo  $page_no>1 ?  " <li><a href=' news.php?page=". ($page_no-1) . " '>Prev</a></li> " : "";
                       for( $i=1 ; $i<=$total_pages ; $i++){
                         $active = $page_no==$i ? "active" : "";
                         echo " <li class='" . $active . "'><a href='news.php?page=". $i ."'>" . $i . "</a></li> ";
                       }
                        echo  $total_pages>$page_no ?  " <li><a href=' news.php?page=". ($page_no+1) . " '>Next</a></li> " : "";



                       echo "  </ul>" ;


                     ?>

That’s a PHP question not an html/css question.

The only changes you have to make to that php code is to add in the new classnames that I gave in my example. I don’t do php at all but it looks pretty straight forward to me following your example code.


                       echo "<ul class='pagination my-pagination'>" ;
                       echo  $page_no>1 ?  " <li class='page-item'><a class='page-link previous' href=' news.php?page=". ($page_no-1) . " '>Prev</a></li> " : "";
                       for( $i=1 ; $i<=$total_pages ; $i++){
                         $active = $page_no==$i ? "active" : "";
                         echo " <li class='page-item " . $active . "'><a  class='page-link' href='news.php?page=". $i ."'>" . $i . "</a></li> ";
                       }
                        echo  $total_pages>$page_no ?  " <li class='page-item'><a class='page-link next' href=' news.php?page=". ($page_no+1) . " '>Next</a></li> " : "";

                       echo "  </ul>" ;

Reduced case will show like this.

I will move this thread to PHP anyway for confirmation and tidying up. :slight_smile:

1 Like

Thank You

just was not sure how to handle it

but it worked fine

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.