WordPressで記事タイトルだけの一覧を表示する方法を解説。WPCodeプラグインを使って完成

WordPressのホーム画面は、初期状態だと「タイトル＋アイキャッチ画像＋本文の抜粋」がずらりと並ぶ形になっています。読み物としてはこれで良いのですが、記事数が増えてくると困ったことが起きます。

「あの記事、どこにあったっけ？」と探すのに、延々とスクロールする羽目になる。

サイトマップ的に「タイトルだけがずらっと並んだ一覧ページ」があれば、一目で全記事を見渡せます。この記事では、プラグインでコードを1つ登録するだけで、記事タイトルだけの一覧を、1ページ100件ずつ・ページ送り付きで表示する方法を解説します。専門知識は不要で、コピペで動きます。

この記事でできるようになること

記事タイトルだけが並んだシンプルな一覧ページを作れる
1ページ100件ずつ表示し、下部に「1 2 3 … 次へ」のページ送りが付く
通し番号（1, 2, 3…）が付くので、記事数が一目でわかる
固定ページでも、トップページでも設置できる
テーマを更新しても消えない

実際にこちらのリンクをごらんください

記事一覧

なぜテーマを直接編集しないのか

やり方を調べると「index.php を書き換えましょう」という解説をよく見かけます。しかしこの方法には落とし穴があります。テーマをアップデートすると、書いた内容が全部消えます。

そこで今回はショートコードという仕組みを使います。

という短い呪文を記事に書くだけで一覧が表示される、という形にしておくのです。こうしておけばテーマから独立するので、テーマを変えても更新しても壊れません。

手順1：プラグイン「WPCode」を入れる

コードを安全に追加するためのプラグインです。直接 functions.php を編集すると、セミコロン1つの打ち間違いでサイトが真っ白になることがありますが、WPCodeならエラーを自動検知して止めてくれます。

管理画面の「プラグイン → 新規追加」を開く
検索欄に「WPCode」と入力
「Insert Headers and Footers + Custom Code Snippets — WPCode」をインストールして有効化

手順2：コードをスニペットとして登録する

左メニューの「Code Snippets → + Add Snippet」をクリック
「Add Your Custom Code (New Snippet)」の下にある「Use snippet」を選ぶ
タイトル欄に分かりやすい名前を入れる（例：タイトル一覧ショートコード）
右上の「コードタイプ」を「PHP スニペット」に変更する
コード欄に、下記のコードをそのまま貼り付ける

if ( ! function_exists( 'title_list_shortcode' ) ) {
    function title_list_shortcode( $atts ) {
        $atts = shortcode_atts( array(
            'per_page'  => 100,      // 1ページあたりの件数
            'post_type' => 'post',   // 投稿タイプ
            'order'     => 'DESC',   // DESC=新しい順 / ASC=古い順
            'orderby'   => 'date',
        ), $atts, 'title_list' );

        $per_page = max( 1, intval( $atts['per_page'] ) );

        // ページ番号は ?tlpage=2 のようなパラメータで管理（固定ページでも404にならない）
        $paged = isset( $_GET['tlpage'] ) ? max( 1, intval( $_GET['tlpage'] ) ) : 1;

        $q = new WP_Query( array(
            'post_type'           => $atts['post_type'],
            'posts_per_page'      => $per_page,
            'paged'               => $paged,
            'orderby'             => $atts['orderby'],
            'order'               => $atts['order'],
            'ignore_sticky_posts' => true,
        ) );

        if ( ! $q->have_posts() ) {
            wp_reset_postdata();
            return '<p>記事がありません。</p>';
        }

        $start = ( $paged - 1 ) * $per_page + 1; // 通し番号の開始値
        $out   = '<ol class="title-list" start="' . $start . '">';
        while ( $q->have_posts() ) {
            $q->the_post();
            $out .= '<li><a href="' . esc_url( get_permalink() ) . '">'
                  . esc_html( get_the_title() ) . '</a></li>';
        }
        $out .= '</ol>';

        // ページ送り
        if ( $q->max_num_pages > 1 ) {
            $out .= '<nav class="title-list-nav">';
            $out .= paginate_links( array(
                'base'      => esc_url_raw( add_query_arg( 'tlpage', '%#%' ) ),
                'format'    => '',
                'current'   => $paged,
                'total'     => $q->max_num_pages,
                'prev_text' => '« 前へ',
                'next_text' => '次へ »',
                'type'      => 'list',
            ) );
            $out .= '</nav>';
        }

        wp_reset_postdata();
        return $out;
    }
    add_shortcode( 'title_list', 'title_list_shortcode' );
}

ここが一番のつまずきポイント：「場所」の設定

コードを貼ったら、下にスクロールして「挿入」というセクションを開きます。

挿入方法：「自動挿入」を選ぶ
場所：初期値は「サイト全体のヘッダー」になっています。これを「どこでも実行（Run Everywhere）」に必ず変更してください

ここを直さないと、ショートコードが登録されず、いつまで経っても動きません。筆者もここで一度つまずきました。最後に、右上のトグルを「無効」から「有効」に切り替え、「更新」ボタンを押します。

手順3：固定ページに設置する

「固定ページ → 新規追加」でページを作る
タイトルを「記事一覧」などにする
本文に次の1行を書くだけ

[title_list]

これで公開すれば完成です。実際にページを開いて、タイトルがずらっと並んでいれば成功です。

カスタマイズ：件数や並び順を変える

ショートコードにオプションを付けるだけで、挙動を変えられます。

書き方	効果
WordPressで記事タイトルだけの一覧を表示する方法を解説。WPCodeプラグインを使って完成【2026年最新版】USBとは?歴史・種類・技術をわかりやすく徹底解説【技術仕様比較】HDMIとDisplayPortの違いとは？伝送アーキテクチャ、バージョン判別の限界からシグナル特性まで徹底解説 HDMIケーブルの種類・バージョンの見分け方！DPとの違いも解説音楽保存で後悔しない！音声エンコードの最適解（MP3・AAC・FLAC）とFFmpegによる高音質抽出＆自動タグ付けを徹底解説 10ギガ光回線の罠！なぜCAT7ではなく「CAT6A」のLANケーブルが正解・最良なのか？【2026年最新版】NFC、FeliCa、おサイフケータイの違いとは？技術的仕組みからApple/Google Pay、レジでの言い方まで徹底解説！ Cursor完全ガイド：SpaceXが認めたAIネイティブエディタの概要・歴史・技術 AirTag（エアタグ）とは？：魔法のような紛失防止技術を解説 Cloudflareとは？概要と技術的な仕組み、専門用語まで徹底解説！ L2・L3・L2プラス・スイッチングハブ・ハブの違いとは？技術的な仕組みまで徹底解説！【完全版】Bluetoothの魔法を解剖する。なぜ「ペアリングなし」でもデバイスを見つけられるのか？【完全版】AirDropの魔法を解剖する。なぜAppleの転送は「速くて安全」なのか？【OpenAI公式】ターミナルで爆速開発！次世代AIエージェント「Codex（Codex CLI）」の凄さと技術の仕組みを徹底解説（Claude・Gemini・ChatGPTとの技術比較付き）【次世代AI】ブラウザを自由に操る「Playwright MCP」とは？仕組み・技術的凄さ・セキュリティまで徹底解説！【ブラックボックスを解剖】Firebaseの裏側はどうなっている？Googleの最強インフラを支える4つのディープなアーキテクチャ「動画のサムネ作るだけ」で特許の沼にハマった話（H.264 / HEVC編）【初心者向け】文字入力が爆速に！今さら聞けない「Markdown（マークダウン）」とは？ Google Chromeのメモリ消費が多いのはなぜ？今すぐできる対策まとめ【2026年最新】NVIDIAのAIチップ進化が止まらない！次世代「Vera Rubin」がもたらす衝撃の未来 PostgreSQLの発展形？「Supabase」で何ができるのか分かりやすく解説！ Claudeの裏側を解剖：憲法AIの仕組みからAPI設計、最新MCPトレンドまで徹底解説！【技術深掘り】OneDriveの裏側はどうなっている？Windows統合の仕組みからAPI、最新トレンドまで徹底解説！ Googleドライブの裏側はどうなっている？インフラ構造からAPI、最新トレンドまで徹底解説！【完全初心者向け】Googleドライブの使い方をわかりやすく解説！スマホ・PCでの基本操作まとめ Windows10で.exeの関連付けを解除する方法 docomoの急速充電器の端子が壊れたので100円ショップにあるＵＳＢケーブルを挿せるように改造してみた【悲報】ustream、無料ユーザのアーカイブ保存期限を３０日に変更。過去動画も消えちゃう！消える前にローカル保存しておこう！ガスコンロのリサイクル品、販売できないものもあるんだね twitterで古いツイートは期間を指定して見ることができます生放送サービス一覧と、ニコニコ生放送が一番と思っていたが今後配信はどうなる？ロウ付け？ハンダ付け？ 3DSのドラクエ10のログインできなかったり遅延がひどいのはなんで？水漏れした銅管のロウ付けしてみた【雀豪ｍｋ３オーバーホール（２）】保護パネル~マグネットリングをバラす！【雀豪ｍｋ３オーバーホール（１）】小コンベアから大コンベアにつながる乗換ブロック周辺をバラしてみたワロタｗ→【ニコニコ動画】Surface32台でレーザー射ってみた【料理作ってみた】ごちゃまぜシチューなんでニコ生公式放送「パチスロ獣王」がこんなにひどかったのか２０１３年俺的ランキングニコニコ生放送の座席について調べてみた Grand Theft Auto V(グランドセフトオート5)GTA5を買ったらグラがすごくマップがとんでもなく広くてワロタｗｗｗ開発費もとんでもないｗｗｗ【入門】はじめてのオブジェクト指向設計　勉強中 Canon MP640というwifi使えて写真もキレイでＣＤラベルプリントもできるプリンターが、あまり使ってないのに印刷中に電源が落ちてそのまま逝ったったｗｗｗスプレー缶を宅急便で送るときは注意！ネットで情報が交錯していたが佐川急便は発送可能、ヤマト運輸は不可能でした。複数無線回線(docomo,softbank,au,WiMAXなど)を使用して、WEBサーフィン、ダウンロード、ネット配信を安定して行うことができるDispatch ニコニコが２０１３年１２月３日に終了してしまう原宿バージョンにかわり、ＧＩＮＺＡバージョンがあまりに使いにくいことについて考える wordpress で amazonアフィリエイトを簡単に設置できるプラグインを導入してみた複数無線回線(docomo,softbank,au,WiMAXなど)を使用したＨＤハイビジョンライブ配信ができるシステムがすごい。業務用なので単体では配信できないのがあれですが・・・。ゆっくり解説】 Bluetoothの使い方【電子工作】麻雀イカサマ　元禄積み（オール伏せ牌＆大三元）ボーカロイドの最新人気ランキングを知りたければこれ！ニコニコ生放送月間VOCALOIDランキング COUNTDOWN 100。ランキングのうｐ先などのリストを公開しているところがあるぞ。１６ｃｈロジックアナライザ全自動麻雀卓”雀豪”のメカニズム動画全自動麻雀卓　”雀豪”　メンテナンス動画回路設計ＣＡＤ電子工作初心者がarduinoというユニットを使ってパチスロのコイン不要機を作ってみた型取りセットと樹脂ポチッたったｗ LCDの動作とライブラリ”shiftreglcd” audiuno と LCD とシフトレジスタ（74HC595) LCD動画うｐしてみた arduinoで４桁７セグＬＥＤカウンター arduinoのボタンを押すとカウントする	新しい順に100件ずつ（デフォルト）
WordPressで記事タイトルだけの一覧を表示する方法を解説。WPCodeプラグインを使って完成【2026年最新版】USBとは?歴史・種類・技術をわかりやすく徹底解説【技術仕様比較】HDMIとDisplayPortの違いとは？伝送アーキテクチャ、バージョン判別の限界からシグナル特性まで徹底解説 HDMIケーブルの種類・バージョンの見分け方！DPとの違いも解説音楽保存で後悔しない！音声エンコードの最適解（MP3・AAC・FLAC）とFFmpegによる高音質抽出＆自動タグ付けを徹底解説 10ギガ光回線の罠！なぜCAT7ではなく「CAT6A」のLANケーブルが正解・最良なのか？【2026年最新版】NFC、FeliCa、おサイフケータイの違いとは？技術的仕組みからApple/Google Pay、レジでの言い方まで徹底解説！ Cursor完全ガイド：SpaceXが認めたAIネイティブエディタの概要・歴史・技術 AirTag（エアタグ）とは？：魔法のような紛失防止技術を解説 Cloudflareとは？概要と技術的な仕組み、専門用語まで徹底解説！ L2・L3・L2プラス・スイッチングハブ・ハブの違いとは？技術的な仕組みまで徹底解説！【完全版】Bluetoothの魔法を解剖する。なぜ「ペアリングなし」でもデバイスを見つけられるのか？【完全版】AirDropの魔法を解剖する。なぜAppleの転送は「速くて安全」なのか？【OpenAI公式】ターミナルで爆速開発！次世代AIエージェント「Codex（Codex CLI）」の凄さと技術の仕組みを徹底解説（Claude・Gemini・ChatGPTとの技術比較付き）【次世代AI】ブラウザを自由に操る「Playwright MCP」とは？仕組み・技術的凄さ・セキュリティまで徹底解説！【ブラックボックスを解剖】Firebaseの裏側はどうなっている？Googleの最強インフラを支える4つのディープなアーキテクチャ「動画のサムネ作るだけ」で特許の沼にハマった話（H.264 / HEVC編）【初心者向け】文字入力が爆速に！今さら聞けない「Markdown（マークダウン）」とは？ Google Chromeのメモリ消費が多いのはなぜ？今すぐできる対策まとめ【2026年最新】NVIDIAのAIチップ進化が止まらない！次世代「Vera Rubin」がもたらす衝撃の未来 PostgreSQLの発展形？「Supabase」で何ができるのか分かりやすく解説！ Claudeの裏側を解剖：憲法AIの仕組みからAPI設計、最新MCPトレンドまで徹底解説！【技術深掘り】OneDriveの裏側はどうなっている？Windows統合の仕組みからAPI、最新トレンドまで徹底解説！ Googleドライブの裏側はどうなっている？インフラ構造からAPI、最新トレンドまで徹底解説！【完全初心者向け】Googleドライブの使い方をわかりやすく解説！スマホ・PCでの基本操作まとめ Windows10で.exeの関連付けを解除する方法 docomoの急速充電器の端子が壊れたので100円ショップにあるＵＳＢケーブルを挿せるように改造してみた【悲報】ustream、無料ユーザのアーカイブ保存期限を３０日に変更。過去動画も消えちゃう！消える前にローカル保存しておこう！ガスコンロのリサイクル品、販売できないものもあるんだね twitterで古いツイートは期間を指定して見ることができます生放送サービス一覧と、ニコニコ生放送が一番と思っていたが今後配信はどうなる？ロウ付け？ハンダ付け？ 3DSのドラクエ10のログインできなかったり遅延がひどいのはなんで？水漏れした銅管のロウ付けしてみた【雀豪ｍｋ３オーバーホール（２）】保護パネル~マグネットリングをバラす！【雀豪ｍｋ３オーバーホール（１）】小コンベアから大コンベアにつながる乗換ブロック周辺をバラしてみたワロタｗ→【ニコニコ動画】Surface32台でレーザー射ってみた【料理作ってみた】ごちゃまぜシチューなんでニコ生公式放送「パチスロ獣王」がこんなにひどかったのか２０１３年俺的ランキングニコニコ生放送の座席について調べてみた Grand Theft Auto V(グランドセフトオート5)GTA5を買ったらグラがすごくマップがとんでもなく広くてワロタｗｗｗ開発費もとんでもないｗｗｗ【入門】はじめてのオブジェクト指向設計　勉強中 Canon MP640というwifi使えて写真もキレイでＣＤラベルプリントもできるプリンターが、あまり使ってないのに印刷中に電源が落ちてそのまま逝ったったｗｗｗスプレー缶を宅急便で送るときは注意！ネットで情報が交錯していたが佐川急便は発送可能、ヤマト運輸は不可能でした。複数無線回線(docomo,softbank,au,WiMAXなど)を使用して、WEBサーフィン、ダウンロード、ネット配信を安定して行うことができるDispatch ニコニコが２０１３年１２月３日に終了してしまう原宿バージョンにかわり、ＧＩＮＺＡバージョンがあまりに使いにくいことについて考える wordpress で amazonアフィリエイトを簡単に設置できるプラグインを導入してみた複数無線回線(docomo,softbank,au,WiMAXなど)を使用したＨＤハイビジョンライブ配信ができるシステムがすごい。業務用なので単体では配信できないのがあれですが・・・。ゆっくり解説】 Bluetoothの使い方【電子工作】 1 2 次へ »	50件ずつ表示
arduinoのボタンを押すとカウントする arduinoで４桁７セグＬＥＤカウンター LCD動画うｐしてみた audiuno と LCD とシフトレジスタ（74HC595) LCDの動作とライブラリ”shiftreglcd” 型取りセットと樹脂ポチッたったｗ電子工作初心者がarduinoというユニットを使ってパチスロのコイン不要機を作ってみた回路設計ＣＡＤ全自動麻雀卓　”雀豪”　メンテナンス動画全自動麻雀卓”雀豪”のメカニズム動画１６ｃｈロジックアナライザボーカロイドの最新人気ランキングを知りたければこれ！ニコニコ生放送月間VOCALOIDランキング COUNTDOWN 100。ランキングのうｐ先などのリストを公開しているところがあるぞ。麻雀イカサマ　元禄積み（オール伏せ牌＆大三元）ゆっくり解説】 Bluetoothの使い方【電子工作】複数無線回線(docomo,softbank,au,WiMAXなど)を使用したＨＤハイビジョンライブ配信ができるシステムがすごい。業務用なので単体では配信できないのがあれですが・・・。 wordpress で amazonアフィリエイトを簡単に設置できるプラグインを導入してみたニコニコが２０１３年１２月３日に終了してしまう原宿バージョンにかわり、ＧＩＮＺＡバージョンがあまりに使いにくいことについて考える複数無線回線(docomo,softbank,au,WiMAXなど)を使用して、WEBサーフィン、ダウンロード、ネット配信を安定して行うことができるDispatch スプレー缶を宅急便で送るときは注意！ネットで情報が交錯していたが佐川急便は発送可能、ヤマト運輸は不可能でした。 Canon MP640というwifi使えて写真もキレイでＣＤラベルプリントもできるプリンターが、あまり使ってないのに印刷中に電源が落ちてそのまま逝ったったｗｗｗ【入門】はじめてのオブジェクト指向設計　勉強中 Grand Theft Auto V(グランドセフトオート5)GTA5を買ったらグラがすごくマップがとんでもなく広くてワロタｗｗｗ開発費もとんでもないｗｗｗニコニコ生放送の座席について調べてみた２０１３年俺的ランキングなんでニコ生公式放送「パチスロ獣王」がこんなにひどかったのか【料理作ってみた】ごちゃまぜシチューワロタｗ→【ニコニコ動画】Surface32台でレーザー射ってみた【雀豪ｍｋ３オーバーホール（１）】小コンベアから大コンベアにつながる乗換ブロック周辺をバラしてみた【雀豪ｍｋ３オーバーホール（２）】保護パネル~マグネットリングをバラす！水漏れした銅管のロウ付けしてみた 3DSのドラクエ10のログインできなかったり遅延がひどいのはなんで？ロウ付け？ハンダ付け？生放送サービス一覧と、ニコニコ生放送が一番と思っていたが今後配信はどうなる？ twitterで古いツイートは期間を指定して見ることができますガスコンロのリサイクル品、販売できないものもあるんだね【悲報】ustream、無料ユーザのアーカイブ保存期限を３０日に変更。過去動画も消えちゃう！消える前にローカル保存しておこう！ docomoの急速充電器の端子が壊れたので100円ショップにあるＵＳＢケーブルを挿せるように改造してみた Windows10で.exeの関連付けを解除する方法【完全初心者向け】Googleドライブの使い方をわかりやすく解説！スマホ・PCでの基本操作まとめ Googleドライブの裏側はどうなっている？インフラ構造からAPI、最新トレンドまで徹底解説！【技術深掘り】OneDriveの裏側はどうなっている？Windows統合の仕組みからAPI、最新トレンドまで徹底解説！ Claudeの裏側を解剖：憲法AIの仕組みからAPI設計、最新MCPトレンドまで徹底解説！ PostgreSQLの発展形？「Supabase」で何ができるのか分かりやすく解説！【2026年最新】NVIDIAのAIチップ進化が止まらない！次世代「Vera Rubin」がもたらす衝撃の未来 Google Chromeのメモリ消費が多いのはなぜ？今すぐできる対策まとめ【初心者向け】文字入力が爆速に！今さら聞けない「Markdown（マークダウン）」とは？「動画のサムネ作るだけ」で特許の沼にハマった話（H.264 / HEVC編）【ブラックボックスを解剖】Firebaseの裏側はどうなっている？Googleの最強インフラを支える4つのディープなアーキテクチャ【次世代AI】ブラウザを自由に操る「Playwright MCP」とは？仕組み・技術的凄さ・セキュリティまで徹底解説！【OpenAI公式】ターミナルで爆速開発！次世代AIエージェント「Codex（Codex CLI）」の凄さと技術の仕組みを徹底解説（Claude・Gemini・ChatGPTとの技術比較付き）【完全版】AirDropの魔法を解剖する。なぜAppleの転送は「速くて安全」なのか？【完全版】Bluetoothの魔法を解剖する。なぜ「ペアリングなし」でもデバイスを見つけられるのか？ L2・L3・L2プラス・スイッチングハブ・ハブの違いとは？技術的な仕組みまで徹底解説！ Cloudflareとは？概要と技術的な仕組み、専門用語まで徹底解説！ AirTag（エアタグ）とは？：魔法のような紛失防止技術を解説 Cursor完全ガイド：SpaceXが認めたAIネイティブエディタの概要・歴史・技術【2026年最新版】NFC、FeliCa、おサイフケータイの違いとは？技術的仕組みからApple/Google Pay、レジでの言い方まで徹底解説！ 10ギガ光回線の罠！なぜCAT7ではなく「CAT6A」のLANケーブルが正解・最良なのか？音楽保存で後悔しない！音声エンコードの最適解（MP3・AAC・FLAC）とFFmpegによる高音質抽出＆自動タグ付けを徹底解説 HDMIケーブルの種類・バージョンの見分け方！DPとの違いも解説【技術仕様比較】HDMIとDisplayPortの違いとは？伝送アーキテクチャ、バージョン判別の限界からシグナル特性まで徹底解説【2026年最新版】USBとは?歴史・種類・技術をわかりやすく徹底解説 WordPressで記事タイトルだけの一覧を表示する方法を解説。WPCodeプラグインを使って完成	古い記事から順に表示
２０１３年俺的ランキング１６ｃｈロジックアナライザ麻雀イカサマ　元禄積み（オール伏せ牌＆大三元）音楽保存で後悔しない！音声エンコードの最適解（MP3・AAC・FLAC）とFFmpegによる高音質抽出＆自動タグ付けを徹底解説電子工作初心者がarduinoというユニットを使ってパチスロのコイン不要機を作ってみた複数無線回線(docomo,softbank,au,WiMAXなど)を使用して、WEBサーフィン、ダウンロード、ネット配信を安定して行うことができるDispatch 複数無線回線(docomo,softbank,au,WiMAXなど)を使用したＨＤハイビジョンライブ配信ができるシステムがすごい。業務用なので単体では配信できないのがあれですが・・・。生放送サービス一覧と、ニコニコ生放送が一番と思っていたが今後配信はどうなる？水漏れした銅管のロウ付けしてみた型取りセットと樹脂ポチッたったｗ回路設計ＣＡＤ全自動麻雀卓　”雀豪”　メンテナンス動画全自動麻雀卓”雀豪”のメカニズム動画ワロタｗ→【ニコニコ動画】Surface32台でレーザー射ってみたロウ付け？ハンダ付け？ボーカロイドの最新人気ランキングを知りたければこれ！ニコニコ生放送月間VOCALOIDランキング COUNTDOWN 100。ランキングのうｐ先などのリストを公開しているところがあるぞ。ニコニコ生放送の座席について調べてみたニコニコが２０１３年１２月３日に終了してしまう原宿バージョンにかわり、ＧＩＮＺＡバージョンがあまりに使いにくいことについて考えるスプレー缶を宅急便で送るときは注意！ネットで情報が交錯していたが佐川急便は発送可能、ヤマト運輸は不可能でした。ガスコンロのリサイクル品、販売できないものもあるんだねゆっくり解説】 Bluetoothの使い方【電子工作】なんでニコ生公式放送「パチスロ獣王」がこんなにひどかったのか【雀豪ｍｋ３オーバーホール（２）】保護パネル~マグネットリングをバラす！【雀豪ｍｋ３オーバーホール（１）】小コンベアから大コンベアにつながる乗換ブロック周辺をバラしてみた【次世代AI】ブラウザを自由に操る「Playwright MCP」とは？仕組み・技術的凄さ・セキュリティまで徹底解説！【料理作ってみた】ごちゃまぜシチュー【技術深掘り】OneDriveの裏側はどうなっている？Windows統合の仕組みからAPI、最新トレンドまで徹底解説！【技術仕様比較】HDMIとDisplayPortの違いとは？伝送アーキテクチャ、バージョン判別の限界からシグナル特性まで徹底解説【悲報】ustream、無料ユーザのアーカイブ保存期限を３０日に変更。過去動画も消えちゃう！消える前にローカル保存しておこう！【完全版】Bluetoothの魔法を解剖する。なぜ「ペアリングなし」でもデバイスを見つけられるのか？【完全版】AirDropの魔法を解剖する。なぜAppleの転送は「速くて安全」なのか？【完全初心者向け】Googleドライブの使い方をわかりやすく解説！スマホ・PCでの基本操作まとめ【初心者向け】文字入力が爆速に！今さら聞けない「Markdown（マークダウン）」とは？【入門】はじめてのオブジェクト指向設計　勉強中【ブラックボックスを解剖】Firebaseの裏側はどうなっている？Googleの最強インフラを支える4つのディープなアーキテクチャ【OpenAI公式】ターミナルで爆速開発！次世代AIエージェント「Codex（Codex CLI）」の凄さと技術の仕組みを徹底解説（Claude・Gemini・ChatGPTとの技術比較付き）【2026年最新版】USBとは?歴史・種類・技術をわかりやすく徹底解説【2026年最新版】NFC、FeliCa、おサイフケータイの違いとは？技術的仕組みからApple/Google Pay、レジでの言い方まで徹底解説！【2026年最新】NVIDIAのAIチップ進化が止まらない！次世代「Vera Rubin」がもたらす衝撃の未来「動画のサムネ作るだけ」で特許の沼にハマった話（H.264 / HEVC編） WordPressで記事タイトルだけの一覧を表示する方法を解説。WPCodeプラグインを使って完成 wordpress で amazonアフィリエイトを簡単に設置できるプラグインを導入してみた Windows10で.exeの関連付けを解除する方法 twitterで古いツイートは期間を指定して見ることができます PostgreSQLの発展形？「Supabase」で何ができるのか分かりやすく解説！ LCD動画うｐしてみた LCDの動作とライブラリ”shiftreglcd” L2・L3・L2プラス・スイッチングハブ・ハブの違いとは？技術的な仕組みまで徹底解説！ HDMIケーブルの種類・バージョンの見分け方！DPとの違いも解説 Grand Theft Auto V(グランドセフトオート5)GTA5を買ったらグラがすごくマップがとんでもなく広くてワロタｗｗｗ開発費もとんでもないｗｗｗ Googleドライブの裏側はどうなっている？インフラ構造からAPI、最新トレンドまで徹底解説！ Google Chromeのメモリ消費が多いのはなぜ？今すぐできる対策まとめ docomoの急速充電器の端子が壊れたので100円ショップにあるＵＳＢケーブルを挿せるように改造してみた Cursor完全ガイド：SpaceXが認めたAIネイティブエディタの概要・歴史・技術 Cloudflareとは？概要と技術的な仕組み、専門用語まで徹底解説！ Claudeの裏側を解剖：憲法AIの仕組みからAPI設計、最新MCPトレンドまで徹底解説！ Canon MP640というwifi使えて写真もキレイでＣＤラベルプリントもできるプリンターが、あまり使ってないのに印刷中に電源が落ちてそのまま逝ったったｗｗｗ audiuno と LCD とシフトレジスタ（74HC595) arduinoのボタンを押すとカウントする arduinoで４桁７セグＬＥＤカウンター AirTag（エアタグ）とは？：魔法のような紛失防止技術を解説 3DSのドラクエ10のログインできなかったり遅延がひどいのはなんで？ 10ギガ光回線の罠！なぜCAT7ではなく「CAT6A」のLANケーブルが正解・最良なのか？	タイトルの五十音・アルファベット順
`記事一覧 about`	投稿ではなく固定ページの一覧

複数の指定を組み合わせることもできます。

[title_list per_page="50" order="ASC"]

見た目を整えるCSS

そのままでもリストとして表示されますが、行間やページ送りのボタンを整えると格段に読みやすくなります。「外観 → カスタマイズ → 追加CSS」に貼り付けてください。

.title-list { line-height: 1.9; padding-left: 2.2em; }
.title-list li { margin: .2em 0; }

.title-list-nav ul {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: .4em;
    padding: 1em 0;
}
.title-list-nav a,
.title-list-nav span {
    display: inline-block;
    padding: .3em .7em;
    border: 1px solid #ccc;
    border-radius: 4px;
    text-decoration: none;
}
.title-list-nav .current span {
    background: #333;
    color: #fff;
    border-color: #333;
}

応用：トップページを丸ごとタイトル一覧にする

「抜粋やサムネイルはいらない。ホームは純粋なタイトル一覧にしたい」という場合は、次の設定を行います。

上記の手順で固定ページ（例：「記事一覧」）を作っておく
「設定 → 表示設定」を開く
「ホームページの表示」で「固定ページ」を選択
「ホームページ」に、作った固定ページを指定
「変更を保存」をクリック

これでトップページがタイトル一覧に切り替わります。

トラブルシューティング

エラー：Cannot redeclare title_list_shortcode()

Cannot redeclare title_list_shortcode() (previously declared in ...)

これは「同じ関数が2回定義されている」という意味です。原因はほぼ次のどれかです。

WPCodeに同じスニペットを2つ作ってしまった
コード欄に同じコードを2回貼り付けてしまった
WPCodeと functions.php の両方に貼ってしまった

「Code Snippets」の一覧を開き、重複しているスニペットを削除してください。コード欄を最下部までスクロールし、同じ内容が2回続いていないかも確認しましょう。なお、上で紹介したコードは全体を if ( ! function_exists( ... ) ) で囲んであるため、万一重複してもこのエラーで停止しません。ただし重複そのものは管理が混乱するので、必ず片方を消しておきましょう。

ショートコードがそのまま文字で表示される

という文字列がページにそのまま出てしまう場合は、コードが読み込まれていません。WPCodeで次の2点を確認してください。

「場所」が「どこでも実行」になっているか（「サイト全体のヘッダー」のままではないか）
スニペットが「有効」になっているか

2ページ目を開くと404になる

今回のコードはページ番号を ?tlpage=2 というURLパラメータで管理しているため、通常この問題は起きません。もし /page/2/ 形式に変えて404になった場合は、パーマリンク設定と固定ページの相性が原因です。パラメータ方式のまま使うのが安全です。

まとめ

記事数が増えてきたブログほど、タイトル一覧ページの価値は高まります。読者にとっての導線になるのはもちろん、自分自身が過去記事を探すときにも重宝します。5分で設置できるので、ぜひ試してみてください。