WordPress | 固定ページに『記事一覧(ページネーション付き)』を、ショートコードで設置出来るようにしたい

以下について、どなたかご教授いただきたいです。よろしくお願いいたしますm(_ _)m

やりたいこと

・固定ページに記事一覧を設置したい
・『1・2・3...10』のようなページネーションもあわせて設定したい
・編集画面からショートコードで設置できるようにしたい
・プラグインを使わずに実装したい

現在の状態

OK
・記事一覧が表示できる
・設定したショートコードが使用出来る

NG
・ページネーションが表示されない

試したこと

https://plusers.net/wordpress_theme_5
(記事一覧は表示されたが、ページネーションが表示されない)

作業環境

バージョン： WordPress 5.2.4
テーマ：_s(underscores)
※別途、子テーマを使って編集

ソースコード

function.php

//---------------------------------------------------------------------------
// ショートコードを追加する
// 記述例
// [myphp file='hoge']
//---------------------------------------------------------------------------
function my_php_Include($params = array())
{
    extract(shortcode_atts(array('file' => 'default'), $params));
    ob_start();
    include(STYLESHEETPATH . "/component/$file.php");
    return ob_get_clean();
}
add_shortcode('myphp', 'my_php_Include');


//---------------------------------------------------------------------------
// ページネーション用に関数を定義する
//---------------------------------------------------------------------------
function the_pagination()
{
    global $st_query;
    $bignum = 999999999;
    if ($st_query->max_num_pages <= 1)
        return;
    echo '<nav class="pagination">';
    echo paginate_links(array(
        'base'         => str_replace($bignum, '%#%', esc_url(get_pagenum_link($bignum))),
        'format'       => '',
        'current'      => max(1, get_query_var('paged')),
        'total'        => $st_query->max_num_pages,
        'prev_text'    => '&larr;',
        'next_text'    => '&rarr;',
        'type'         => 'list',
        'end_size'     => 3,
        'mid_size'     => 3
    ));
    echo '</nav>';
}

component/loop-content.php

<!--投稿(post) or 固定ページ(page) | 表示数を指定 -->
<!--[myphp file='loop-content'] -->
<?php
$args = array(
    'post_type' => 'post',
    'posts_per_page' => 3,
    'paged' => (get_query_var('paged')) ? get_query_var('paged') : 1
);
$st_query = new WP_Query($args);
?>

<?php if ($st_query->have_posts()) : ?>
    <?php while ($st_query->have_posts()) : $st_query->the_post(); ?>
        <!-- 記事があったときの処理 -->
        <article <?php post_class('article-list'); ?>>
            <a href="<?php the_permalink(); ?>">
                <div class="img-wrap">
                    <!--画像を追加-->
                    <?php if (has_post_thumbnail()) : ?>
                        <?php the_post_thumbnail('medium'); ?>
                    <?php else : ?>
                        <img src="<?php echo get_stylesheet_directory_uri(); ?>/common/no-image.gif" alt="no-img" />
                    <?php endif; ?>
                    <!--カテゴリ-->
                    <?php if (!is_category() && has_category()) : ?>
                        <span class="cat-data">
                            <?php
                                        $postcat = get_the_category();
                                        echo $postcat[0]->name;
                                        ?>
                        </span>
                    <?php endif; ?>
                </div>
                <!--end img-warp-->
                <div class="text">
                    <!--タイトル-->
                    <h2><?php the_title(); ?></h2>

                    <!--投稿日を表示-->
                    <span class="article-date">
                        <i class="far fa-clock"></i>
                        <time datetime="<?php echo get_the_date('Y-m-d'); ?>">
                            <?php echo get_the_date(); ?>
                        </time>
                    </span>
                    <!--著者を表示-->
                    <span class="article-author">
                        <i class="fas fa-user"></i><?php the_author(); ?>
                    </span>
                    <!--抜粋-->
                    <?php the_excerpt(); ?>
                </div>
                <!--end text-->
            </a>
        </article>
    <?php endwhile; ?>
    <div class="pagination">
        <!-- ページネーション -->
        <?php echo paginate_links(array(
                'type' => 'list',
                'mid_size' => '1',
                'prev_text' => '<i class="fas fa-angle-left"></i>',
                'next_text' => '<i class="fas fa-angle-right"></i>'
            )); ?>
    </div>
<?php else : ?>
    <!-- 記事がなかった時の処理 -->
    <p>記事はありません</p>
<?php endif; ?>