サイトアイコン WATASHI.xyz

WordPressのテーマ制作の際に使用する自作ショートコードのひな形

WordPressで固定ページ内で記事の一覧を取得したいなどの関数を使用する際はショートコードを自作し、管理画面の固定ページ編集画面にショートコードを挿入すると運用的に楽になります。

なぜ楽になるのか?

自作ショートコードのひな形は以下のようになります。
ショートコードに引数をもてるようにするとさらに便利になります。

if ( ! function_exists( 'hogeFunc' ) ) :
function hogeFunc( $atts ) {
    extract( shortcode_atts( array (
        // ここに引数のキーとデフォル値をセット
        'num' => 0,
    ), $atts ) );

    return $num * 2;
}
add_shortcode( 'hoge', 'hogeFunc' );
endif;

↓使いかた

編集画面でショートコードをこのように入れると引数の10に2をかけた20が表示されます

[hoge num=10]

ショートコードからテンプレートを呼び出したいときは以下のようにします。

if ( ! function_exists( 'fugaFunc' ) ) :
function fugaFunc( $atts ) {
    extract( shortcode_atts( array (
        // ここに引数のキーとデフォル値をセット
        'num' => 0,
    ), $atts ) );

    ob_start();
    get_template_part( 'foo', 'bar' );
    $template = ob_get_contents();
    ob_end_clean();
    return $template;
}
add_shortcode( 'fuga', 'fugaFunc' );
endif;

↓使いかた

編集画面でショートコードをこのように入れるとテンプレートファイルの内容が表示されます

[fuga num=10]

ショートコードを活用して運用時のサイト変更時にテーマファイルをなるべく触らなくてよい方向にもっていきたいものです。

モバイルバージョンを終了