Pagination not working on blog grid

by

If you want to show pagination in home page then it require one change like in following line of your code

 $paged = (get_query_var('paged')) ? get_query_var('paged') : 1;

You need to replace your query variable like paged (get_query_var('paged')) with page because in other pages we use paged but in home page for pagination we have to use page. So just replace above code line with this

 $paged = (get_query_var('page')) ? get_query_var('page') : 1;

See if that works.

UPDATE

To make post list page with pagination from beginning, first you have to make template in your theme and paste following code in there.

<?php
/*
Template Name: Archives 
*/
get_header();
?>
<div style="width:100%; padding:50px;">
    <?php
    $paged = get_query_var('page') ? get_query_var('page') : 1;
    $args = array('post_type' => 'post',
    'posts_per_page' => 10,
    'paged' => $paged
    );
    $loop = new WP_Query( $args );
    while ( $loop->have_posts() ) : $loop->the_post();
        ?>
            <li style="list-style:none;">
            <h3><a href="https://wordpress.stackexchange.com/questions/243130/<?php the_permalink() ?>" title="<?php the_title(); ?>"><font style="color:#666666;"><?php the_title();?></a><span style="/* color: #d9d9d9; */font-size: 12px;">&nbsp;(<?php echo get_the_date('d.m.Y');?>)</span></h3>
        <?php 
        /*****     Thumbnail     ******/
        the_post_thumbnail(
        array(120, 90),    //resolution of thumbnail image
            array(

                'class' => 'Enter_Class',    //CSS Class for thumbnail image if any
                'alt' => 'post thumbnail',   //Alternate text for thumbnail image
                'title' => 'my custom title' //title of thumbnail image
            )
        );
        /*******     Thumbnail Ends   ********/

        /***  Description of post  ***/
        ?> <p> <?php the_excerpt();?> <a href="https://wordpress.stackexchange.com/questions/243130/<?php the_permalink() ?>">Read More</a></p></font>
        </li><hr />
        <?php 
    endwhile; ?>

    <div class="class-name" style="float:left;padding:20px;">
        <?php
        // next_posts_link() usage with max_num_pages
        next_posts_link( 'Older Entries', $loop->max_num_pages );
        ?>
    </div>
    <div class="class-name" style="float:left;padding:20px;">
        <?php
        previous_posts_link( 'Newer Entries' );
        ?>
    </div>
    <?php 
    // clean up after the query and pagination
    wp_reset_postdata(); 
    ?>
</div>
<?php get_footer(); ?>

Few points need to know

  1. With the above code pagination will work only in home page. If you want to show pagination in inner page then you have to make change in one line of above code. If you want to show pagination in inner page or non static front page then look for following line of code

    $paged = get_query_var('page') ? get_query_var('page') : 1;

Just replace above line of code with this line

$paged = get_query_var('paged') ? get_query_var('paged') : 1;

The only difference between these lines has already been explain before this updated answer.

  1. You need to make formatting of your post list. Set Divs and classes/IDs inside code to make it look like your previous post list page.

UPDATE

How to add pagination in single.php

To add pagination in single.php, you just need two functions

  1. next_post_link(); To show Next Post link
  2. previous_post_link(); To show previous post link

These functions will display title of posts as link. For example if you show next_post_link(); then whoever the next post in queue, This function will display its title as link of the post And same goes to previous_post_link();. Then your pagination will be look like this

Title of Previous Post          Title of Next Post

How to Show Custom Text Instead of Title of Post as link

If you want to show custom text as link, For example you want your link appear something like this

Next Post          Previous Post

For that you have to specify custom text in function like this

next_post_link('%link', 'Next Post', TRUE);

In the above function custom text Next Post has been shown so the link text will appear as Next Post instead of post title.

Where to add these functions

Whereever you will add these functions in single.php file, pagination will appear there. But as per your single.php file you can add these function below or above comments. For exaple look for following code line in your single.php

<?php comments_template('', true); ?>

This line is responsible for comment box that appear on single post page.

So if you want to add pagination above comment box then add pagination functions above this line <?php comments_template('', true); ?> Like This

next_post_link('%link', 'Next', TRUE);
previous_post_link('%link', 'Prev', TRUE);
<?php comments_template('', true); ?>

And if you want to show pagination below comment box then add these two functions below this line <?php comments_template('', true); ?>.

And at last don’t forget to style your pagination. By style mean Position of next and previous post link. It would be better if you add these functions in saperate DIV like this

<div class="class-name" style="float:left;padding:20px;">  
<?php next_post_link('%link', 'Next Post', TRUE); ?>
</div>
<div class="class-name" style="float:left;padding:20px;">
<?php previous_post_link('%link', 'Previous Post', TRUE); ?>
</div>

Just add above code above or below comment functions and your pagination is ready.

UPDATE

To add post list with pagination in Static Front Page you need to edit your page.php if your static front page is from dashboard -> pages. page.php file is resposible for appearing all page in wordpress and single.php file is for posts detailed page.

To show pagination on static front page you need to use template code that I have shown you earlier in my previously updated answer (Custom template code). Code that you have used earlier in your custom teplate that same code will be use in page.php file to show pagination in static front page.

You need to add that code in your page.php file. But keep in mind if you will add that code in page.php file then pagination will appear in all of your pages in wordpress because page.php file’s content are use to show in all pages of wordpress. And you need pagination only in front page. So to show pagination only in front page you need to add one IF condition in that code.

Basically to show pagination in home page only you need one function named as is_home(). Use this function in IF condition like this

If(is_home()){

    enter code of custom teplate here

}

is_home() is use to check that current page is home page or not. If the current page is home page only then template code will run so that pagination will show only in front page.

Where ever you will add this code post list will appear with pagination on that place. To made neccessary changes in apprearance of list you need to understand code completely. So it is strongly recomended that to get you desire page look/appearance you must read all comments and description, only then you can edit code as per your need.

NOTE

In single.php we used this function to show pagination

next_post_link();

And in page.php we used this function for pagination

next_posts_link();

Only difference between these function is that, we use keyword post in function name for single.php and keyword posts is used for page.php.