【Wordpressテーマ作成】ショートコードを自作する

2021-8-23

meko

環境

Wordpress 5.7.1
Copy

ショートコード

ショートコードは簡素に書くと、

function shortcode() {
    // anything
}
add_shortcode("code_name", "shortcode");
Copy

と書くだけで作成できます

ショートコードのサンプル

投稿一覧を取得して、ページネーションをつけてページに返す例です
表示したいページで[post-list]と書くと表示できます

<?php
function post_list($atts) {
        $atts = shortcode_atts(array(
                "id" => 0,
			), $atts, "post-list");
            extract($atts);
        $html = "";
        $paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
        $posts = get_posts(array(
            "paged" => $paged,
            "category_name" => $id,
        ));
        $html .= '
                <div class="posts">
                    <div class="list">
                        <ul>
            ';
        foreach ( $posts as $post ) {
            setup_postdata( $post );
            $html .= '
                <li class="news-post">
                    <a href='. get_the_permalink($post -> ID).'">'
                        .'<span class="date">'.get_the_date("Y年m月d日", $post -> ID).'</span>'
                        .'<span class="post-title">'.get_the_title($post -> ID).'</span>'.
                    `</a>
                </li>
            `;
        }
        $html .= "</ul></div>";

        //  pagelist

        $html .= `<div class="page-navigation">`;
        global $wp_rewrite;
        $paginate_base = get_pagenum_link(1);
        if(strpos($paginate_base, '?') || !$wp_rewrite->using_permalinks()){
            $paginate_format = '';
            $paginate_base = add_query_arg('paged','%#%');
        }else{
            $paginate_format = (substr($paginate_base,-1,1) == '/' ? '' : '/') .user_trailingslashit('page/%#%/','paged');
            $paginate_base .= '%_%';
        }       
        $html .= paginate_links(array(
            'base' => $paginate_base,
            'format' => $paginate_format,
            'total' => ceil(get_category(get_category_by_slug( $id );) -> count / 5),
            'mid_size' => 1,
            'current' => ($paged ? $paged : 1),
            'prev_text' => '<',
            'next_text' => '>',
        ));
        $html .= "</div></div>";
        return $html;
}
add_shortcode("post-list", "post_list");
?>
Copy

参考

公式の資料