アーカイブレイアウトをPCとモバイルで切り替えるカスタマイズ

アーカイブページの一覧レイアウト設定で選択できる「カードタイプ」と「リストタイプ」をPCとモバイルで切り替えるカスタマイズのサンプルコードについて紹介します。

※このカスタマイズはyStandard v4.3.0以降で利用できます

ys_get_archive_type フックを使ってカスタマイズ

ある条件によってアーカイブページの一覧レイアウトをカスタマイズするためにはys_get_archive_typeフィルターフックを使用します。

add_filter( 'ys_get_archive_type', function ( $type ) {
    $type = 'card';
    if ( ys_is_mobile() ) {
        // モバイルレイアウトのみ list タイプ.
        $type = 'list';
    }

    return $type;
} );

上の例ではPCではカードタイプ、モバイルではリストタイプで表示されます。

他にも特定のカテゴリーだけタイプを変える…といったカスタマイズもできるので、運営スタイルに合わせてカスタマイズしてみてください。

※サンプルコードは子テーマのfunctions.phpなどに追記してください。
※PHPのカスタマイズではコードの書き間違えなどでエラーが発生した場合、サイトが表示できなくなる場合があります。必ずテスト環境で動作を確認してから本番サイトへ反映することをおすすめします。