Amazon10/19まで!プライム感謝祭開催中! セール会場へ

SWELL│特定のアーカイブページの記事一覧リストの表示を変更する方法

コードの適用範囲はSWELL 2.19.0のソースで確認しています。記事一覧リストの設定画面は2026年10月11日の撮影です。公開画面の比較画像には2024年4月の例と2026年10月3日の隔離環境での検証画像を載せています。撮影条件は各画像の説明を参照してください。

SWELLのアーカイブの記事一覧リストはカスタマイズから変更できます。

SWELLのカスタマイザーにある記事一覧リストのレイアウトと表示列数の設定。
2026年10月11日、Windows Chromeで撮影。記事一覧リスト設定の読取画面。カード型の選択とPC・スマホの表示列数を確認できます。

しかし特定の投稿記事タイプではカードじゃなくてテキストで表示したいということはないでしょうか?

たとえばアイキャッチ画像を表示したくないお知らせ(カスタム投稿タイプ:news)です。

カード型で表示されているお知らせアーカイブページの変更前の記事一覧。

こちらのアーカイブページだけをSWELLフックを使ってテキスト表示にしてみます。

フックを適用してテキスト表示に変更した後のアーカイブページ。

本記事ではこのカスタマイズ方法を紹介します。

目次

著者

WEB制作をしているデジタルノマド
WordPressのカスタマイズが好きで、色々と自作しています。

WordPressのカスタマイズに困ったらご相談ください!

SWELL│特定のアーカイブページの記事一覧リストの表示を変更する方法

やり方は簡単です。

swell_post_list_type_on_archiveのフックを使用します。

前提としてnewsというカスタム投稿タイプを作成して、アーカイブページも存在する前提にします。

プラグインCustom Post Type UIを使うと簡単です。

子テーマのfunctions.phpのPHP内、またはCode SnippetsのPHPスニペットへ、使う例を一度だけ追加してください。親テーマへの直接追加は避けます。newsは自分のカスタム投稿タイプ名へ置き換えてください。

エラーが怖い人はCode Snippetsのプラグインを入れて、そこにコードを挿入しましょう。

function motoki_swell_post_list_type_on_archive( $list_type, $archive_data ) {
    // 'news' カスタム投稿タイプのアーカイブページの場合のみ
    if ( is_post_type_archive( 'news' ) ) {
        // リストタイプを 'simple' に設定
        $list_type = 'simple';
    }
    return $list_type;
}

add_filter( 'swell_post_list_type_on_archive', 'motoki_swell_post_list_type_on_archive', 10, 2 );

対象のnewsアーカイブがテキスト型になり、ほかのアーカイブが元の形式のままか確認します。戻す場合は追加した関数とadd_filter、または該当スニペットを削除・無効化し、キャッシュを削除してください。

フックのコードを適用した後にテキスト表示へ切り替わったアーカイブの確認画面。

記事一覧リストの表示形式にしたい場合

記事一覧リストの表示形式にしたい場合は$list_type = 'simple';の記述を変更するだけです。

記事一覧リスト値
カード型card
リスト型list
リスト型(左右交互)list2
サムネイル型thumb
ブログ型big
テキスト型simple
記事一覧リストの表示形式

応用│特定のアーカイブページの記事一覧リストの表示を変更する方法

応用例を紹介します。

投稿一覧ページは別の設定を確認する

ここでいう「投稿ページ」は、設定→表示設定で指定する投稿一覧ページです。個別の記事ページではありません。SWELL 2.19.0のhome.phpはswell_post_list_type_on_archiveを呼び出さないため、このフック内のis_home()では投稿一覧の形式を変更できません。

投稿一覧の形式は、まずカスタマイザーの該当設定で変更してください。共通設定を変えるとほかの一覧にも影響する場合があります。「投稿一覧だけ」に限定するには一覧ごとの設定・テンプレートを確認する必要があります。

検索結果だけカード表示にしたい場合

検索クエリの投稿タイプがworksだけの場合にカード型へ変更します。URLの値を直接読む代わりに、WordPressが解釈したpost_typeを使います。文字列worksと、worksだけの配列に対応し、ほかの投稿タイプ・複数タイプ・未指定では元の形式を保ちます。worksを自分の投稿タイプ名へ置き換えてください。検索プラグイン独自の絞り込み方式では適用されない場合があります。

add_filter( 'swell_post_list_type_on_search', function( $list_type ) {
    $post_type = get_query_var( 'post_type' );
    if ( $post_type === 'works' || $post_type === [ 'works' ] ) {
        return 'card';
    }
    return $list_type;
} );

表示形式を変えたい一覧を区別する

一覧の種類この記事の例での対応
newsの投稿タイプアーカイブswell_post_list_type_on_archiveでsimpleへ変更
カテゴリー・タグの一覧別の分類用フックが必要
表示設定の投稿ページこのフックは呼ばれないため共通設定を確認
worksだけを検索する結果検索用の掲載例でcardへ変更
本文内の投稿リストブロックそのブロックの表示設定を確認

最初に変更したいページの種類を確認します。newsの個別記事とnewsの一覧は別のページです。投稿タイプの登録でアーカイブが有効になっていることを確認してから、その一覧URLを開きます。URL末尾だけで判断せず、登録元の設定と実際の一覧を対応させてください。

検索用の例はworksだけが対象の場合に限ります。検索語を入れただけの全体検索やpostとworksの混合検索では元の形式が残ります。対象の一覧、対象外のカテゴリー一覧、通常の検索結果を比較してください。検索に出す投稿タイプの設定自体を変える例ではないため、検索条件は登録元や検索機能側で確認します。

保存した一覧設定と対象外の一覧を比較する

「外観 → カスタマイズ → 記事一覧リスト」でPCとスマホの一覧形式を選び、「公開」を押します。

検証では両方をリスト型に保存したうえで、この記事の2つのフィルターを適用しました。

newsの投稿タイプアーカイブだけがテキスト型になり、カテゴリー一覧は保存したリスト型を維持しました。

worksだけに絞った検索はカード型になり、newsの検索は保存したリスト型を維持しました。

比較するときは対象の一覧だけでなく、変更しないカテゴリー一覧や別の投稿タイプの検索も開きます。

カスタム投稿の個別記事ではなく、投稿タイプのアーカイブURLを使って確認してください。

記事内の2つのコードは、アーカイブ用と検索用で役割が異なります。

元に戻すときは追加したフィルターを停止し、カスタマイザーで保存した一覧形式へ戻ったことを確認します。

newsアーカイブをテキスト型に変更した表示
2026年10月3日撮影/WordPress 7.1.2・SWELL 2.19.0/newsアーカイブにテキスト型を適用。

スマホでも変更対象と対象外を比較する

確認するページ今回のMobile表示
newsアーカイブテキスト型・2記事
カテゴリー一覧保存したリスト型・2記事
worksだけの検索カード型・1記事
newsだけの検索保存したリスト型・2記事

同じ設定とコードで、PCの一覧に加えてMobile表示でも4種類を比較しました。news一覧のリンクからEnterキーで個別記事へ移動できることも確認しています。

スマホだけ形式が違う場合は、「記事一覧リスト」のスマホ設定を先に確認します。アーカイブ用と検索用のコードを重ねて書き換える必要はありません。

newsアーカイブだけをテキスト型に変更したスマホ幅の実画面
2026年10月3日撮影/WordPress 7.1.2・SWELL 2.19.0の隔離環境/カスタマイザーのMobile表示、本文幅385px。newsアーカイブをテキスト型で表示。
works検索だけをカード型に変更したスマホ幅の実画面
2026年10月3日撮影/WordPress 7.1.2・SWELL 2.19.0の隔離環境/カスタマイザーのMobile表示、本文幅385px。worksだけの検索をカード型で表示。

複数の投稿タイプを含む検索結果で表示形式を比較する

検索条件実際の表示
postとworksの混合指定通常投稿2件と制作事例1件がリスト表示
worksだけを配列で指定制作事例1件がカード表示

投稿タイプの指定には、文字列だけでなく配列が渡される場合があります。

本記事のフィルターは、worksだけの指定とpost・worksの混合指定を区別します。

投稿タイプを絞った検索を用意し、post_type[]=post&post_type[]=worksと、post_type[]=worksを比較してください。

検索画面側が投稿タイプ指定を受け付けていることが前提です。

このコード自体が検索対象を選択するフォームを追加するわけではありません。

WordPress 7.1.2・SWELL 2.19.0の隔離環境で実検索を開き、混合指定は保存済みのリスト形式、worksだけの配列指定はカード形式になることを確認しました。

制作事例リンクをEnterで開き、対象記事へ到達することも確認しています。

検索条件を戻すときはURLの投稿タイプ指定を外します。

形式の変更を取り消すときは、今回追加したフィルターを無効にしてください。

画像はPCの混合検索結果です。

スマホ表示と実サイトのキャッシュ反映は別途確認が必要です。

postとworksを指定した実検索のリスト表示
postとworksを指定した実検索のリスト表示。2026年10月3日、隔離したWordPress 7.1.2 / SWELL 2.19.0のPC画面で撮影。

検索対象の変更と表示形式の変更を合わせる

worksだけを指定したのに通常投稿の一覧が出る場合は、表示形式のフィルターより先に検索対象を確認します。

pre_get_postsでpost_typeをpostとpageへ上書きしていると、本記事のworks条件には一致しません。

検索対象を変更する基本例は、対象が未指定のときだけpostとpageを設定する構成です。

隔離したWordPress 7.1.2 / SWELL 2.19.0の実クエリと本記事の検索用フィルターを併用し、worksだけの指定はカード型、postとの混合指定は保存済みの形式になることを確認しました。

本記事のコードは検索対象そのものを変更しません。

フォームから渡った指定と、pre_get_posts実行後のpost_typeを照合してから表示形式を確認してください。

今回の比較はPHPでの取得結果とフィルター出力であり、変更後のPC・スマホ表示や実サイトのキャッシュ反映は別に確認が必要です。

まとめ

このようにカスタマイズで設定されているけど、特定の投稿タイプでは変更したいというカスタマイズにはフックが便利です。

気になった方はぜひ、参考にしてください。

カテゴリー・タグは別のフックを使います。使い分けはSWELLのフック一覧と使い方で確認してください。

よくある質問:SWELLで特定のアーカイブの記事一覧の表示を変えるとき

特定のアーカイブだけ、記事一覧の表示形式を変えられますか?

記事では、swell_post_list_type_on_archiveのフックを使って、特定のアーカイブページだけの表示形式を変更します。記事の例は、アイキャッチ画像を表示したくないお知らせ(カスタム投稿タイプnews)のアーカイブを、テキスト表示にするものです。

事前に何を用意しておく必要がありますか?

記事では、newsというカスタム投稿タイプを作成し、アーカイブページも存在する前提です。プラグインCustom Post Type UIを使うと簡単です。投稿タイプの登録でアーカイブが有効になっていることを確認してから、その一覧URLを開きます。

コードは、どこに追加しますか?

記事では、子テーマのfunctions.phpのPHP内、またはCode SnippetsのPHPスニペットへ、使う例を一度だけ追加します。親テーマへの直接追加は避けます。

カテゴリーやタグの一覧も、このフックで変えられますか?

記事の対応表では、カテゴリー・タグの一覧は別の分類用フックが必要です。また、本文内の投稿リストブロックは、そのブロックの表示設定を確認します。

設定→表示設定で指定した「投稿ページ」の一覧にも使えますか?

使えません。記事では、SWELL 2.19.0のhome.phpはswell_post_list_type_on_archiveを呼び出さないため、このフック内のis_home()では投稿一覧の形式を変更できません。まずカスタマイザーの該当設定で変更しますが、共通設定を変えるとほかの一覧にも影響する場合があります。

検索結果だけカード表示にすることはできますか?

記事の応用例では、検索クエリの投稿タイプがworksだけの場合にカード型へ変更します。ほかの投稿タイプ・複数タイプ・未指定では元の形式を保ちます。検索プラグイン独自の絞り込み方式では適用されない場合があります。

投稿と制作事例を混ぜた検索結果は、どう表示されますか?

記事では、postとworksの混合指定では、保存済みのリスト形式のままです。記事の隔離環境での検証では、通常投稿2件と制作事例1件がリスト表示されました。このコード自体は検索対象を選択するフォームを追加するわけではなく、検索画面側が投稿タイプ指定を受け付けていることが前提です。

スマホだけ形式が違うときは、どうしますか?

記事では、「記事一覧リスト」のスマホ設定を先に確認します。アーカイブ用と検索用のコードを重ねて書き換える必要はありません。スマホ表示と実サイトのキャッシュ反映は、別途確認が必要です。形式の変更を取り消すときは、今回追加したフィルターを無効にします。

  • URLをコピーしました!

実装を任せたい方へ

SWELLのカスタマイズ代行

記事のコードをそのまま使うのが不安な場合や、サイトに合わせた調整が必要な場合は当社が実装します。1時間 ¥8,000〜(税込)。テーマ更新に強い書き方で納品します。

WAZAの有料記事のサブスクリプションも開始しました。

サービス

Service

WordPressサイトのカスタマイズのサービスに関心がありましたら、ぜひ詳細をご覧ください。

目次