WP_Query don't show pagination for frontpage - wordpress

Question

Can someone take a look on my code ? I can't figure why post pagination not showing, although when I type page/2 in browser url, the list of post works properly.
<?php
/**
* Template Name: Frontpage
*
* #package Bootstrap Canvas WP
* #since Bootstrap Canvas WP 1.0
*/
get_header(); ?>
<?php
$paged = ( get_query_var('page') ) ? get_query_var('page') : 1;
$args = array('post_type' => 'post', 'orderby' => 'ASC', 'paged' => $paged, 'posts_per_page' => 9 );
$loop = new WP_Query($args);
$count = 0;
?>
<div class="row">
<div class="col-sm-12 blog-main pt-3 pb-5">
<?php if ($loop->have_posts()) : while ($loop->have_posts()) : $loop->the_post(); ?>
<?php $count++ ?>
<?php $date_format = get_option( 'date_format' ); ?>
<?php if($count == 1) : ?>
<div class="row">
<?php endif ?>
<?php if(($count == 1) || ($count == 9)) : ?>
<div id="post-<?php the_ID(); ?>" class="col-sm-12 col-md-8 col-xl-8 np-big">
<?php endif ?>
<?php if($count == 2 || $count == 7) : ?>
<div class="col-sm-12 col-md-4 col-xl-4 np-small">
<?php endif ?>
<?php if($count > 1 && $count < 4 || $count > 6 && $count <= 9 ) : ?>
<div id="post-<?php the_ID(); ?>" class="col-sm-12 col-md-12 col-xl-12">
<?php elseif ($count >= 4) : ?>
<?php if ($count == 5) : ?>
<div id="post-<?php the_ID(); ?>" class="col-sm-12 col-md-4 col-xl-4 np-small">
<?php else : ?>
<div id="post-<?php the_ID(); ?>" class="col-sm-12 col-md-4 col-xl-4">
<?php endif ?>
<?php endif ?>
<a href="<?php echo get_the_permalink(); ?>"><div class="post-bg-home" style="background: linear-gradient( rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7) ), url(<?php echo get_the_post_thumbnail_url() ?>);">
<h2><?php echo get_the_title(); ?></h2>
<p class="data"><?php echo the_time( $date_format ); ?></p>
</div></a>
<?php if($count == 1) : ?>
</div>
<?php endif ?>
<?php if($count > 1 ) : ?>
</div>
<?php endif ?>
<?php if($count == 3 || $count == 8) : ?>
</div>
<?php endif ?>
<?php endwhile; ?>
</div>
</div>
<div class="paginacja col-sm-12 col-md-12 col-xl-12">
<hr class="paginacja-hr">
<?php the_posts_pagination(); ?>
</div>
<?php else : ?>
<div <?php post_class(); ?> id="post-<?php the_ID(); ?>">
<h1>Not Found</h1>
</div>
<?php endif; ?>
</div><!-- /.blog-main -->
</div><!-- /.row -->
<?php get_footer(); ?>

Answer 1

Try this code
<?php
$paged = ( get_query_var('page') ) ? get_query_var('page') : 1;
$args = array('post_type' => 'post', 'orderby' => 'ASC', 'paged' => $paged, 'posts_per_page' => 3 );
$loop = new WP_Query($args);
$count = 0;
?>
<div class="row">
<div class="col-sm-12 blog-main pt-3 pb-5">
<?php if ($loop->have_posts()) : while ($loop->have_posts()) : $loop->the_post(); ?>
<?php $count++ ?>
<?php $date_format = get_option( 'date_format' ); ?>
<?php if($count == 1) : ?>
<div class="row">
<?php endif ?>
<?php if(($count == 1) || ($count == 9)) : ?>
<div id="post-<?php the_ID(); ?>" class="col-sm-12 col-md-8 col-xl-8 np-big">
<?php endif ?>
<?php if($count == 2 || $count == 7) : ?>
<div class="col-sm-12 col-md-4 col-xl-4 np-small">
<?php endif ?>
<?php if($count > 1 && $count < 4 || $count > 6 && $count <= 9 ) : ?>
<div id="post-<?php the_ID(); ?>" class="col-sm-12 col-md-12 col-xl-12">
<?php elseif ($count >= 4) : ?>
<?php if ($count == 5) : ?>
<div id="post-<?php the_ID(); ?>" class="col-sm-12 col-md-4 col-xl-4 np-small">
<?php else : ?>
<div id="post-<?php the_ID(); ?>" class="col-sm-12 col-md-4 col-xl-4">
<?php endif ?>
<?php endif ?>
<a href="<?php echo get_the_permalink(); ?>"><div class="post-bg-home" style="background: linear-gradient( rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7) ), url(<?php echo get_the_post_thumbnail_url() ?>);">
<h2><?php echo get_the_title(); ?></h2>
<p class="data"><?php echo the_time( $date_format ); ?></p>
</div></a>
<?php if($count == 1) : ?>
</div>
<?php endif ?>
<?php if($count > 1 ) : ?>
</div>
<?php endif ?>
<?php if($count == 3 || $count == 8) : ?>
</div>
<?php endif ?>
<?php endwhile; ?>
</div>
</div>
<div class="paginacja col-sm-12 col-md-12 col-xl-12">
<hr class="paginacja-hr">
<?php $GLOBALS['wp_query']->max_num_pages = $loop->max_num_pages;
the_posts_pagination( array(
'mid_size' => 1,
'prev_text' => __( 'Back', 'green' ),
'next_text' => __( 'Next', 'green' ),
'screen_reader_text' => __( 'Posts navigation' )
) ); ?>
</div>
<?php else : ?>
<div <?php post_class(); ?> id="post-<?php the_ID(); ?>">
<h1>Not Found</h1>
</div>
<?php endif; ?>
</div><!-- /.blog-main -->
</div><!-- /.row -->
<?php get_footer(); ?>