メインコンテンツに移動
ホーム

古松

メインナビゲーション

  • ホーム
  • ビデオ
  • ご連絡

パンくず

  • ホーム
  • WordPressのカスタムテンプレートでカテゴリー別の最新記事リンク一覧の表示方法

WordPressのカスタムテンプレートでカテゴリー別の最新記事リンク一覧の表示方法

やりたいこと:カテゴリー別の最新投稿リンクを10件表示させたいです

  • WordPressがカテゴリー別の投稿一覧表示ができます
    • フロントページに「カテゴリー」ウィジェットがありますが、カテゴリーを選択すれば、カテゴリー別の記事一覧が表示されます
    • この記事一覧がタイトル、コンテンツの一部が表示されています
  • ここでやりたいこと:カテゴリー別の投稿タイトルリンクを10件表示させたいです
    • 投稿のコンテンツ表示しない
    • タイトルにリンクをつける(クリックすると投稿詳細ページへ)

カスタムテンプレートでカテゴリー別の最新投稿リンクを10件表示させます

  • page.phpをコピーして、カスタムテンプレート(例:page-category.php)を作成します
    • ファイルの最初の部分でカスタムテンプレート名を付けます
      <?php
      /* Template Name: Category Page */
      ?>
    • WordPressのカスタムテンプレート名はコメント(/*  */)内で書きます
  • カスタムテンプレートがテーマのフォルダに配置します
    • ここでは、子テーマ(twentyseventeen-child)フォルダに入れます
      カスタムテンプレートをテーマフォルダに配置
  • カテゴリー(例:cat-1)別の投稿を10件取得します
    • ここで直接クエリで投稿一覧取得を行います
      <?php
      	$args = array(
      		'post_type'=>'post',
      		'orderby' => 'date',
      		'order' => 'DESC',
      		'posts_per_page' => 10,
      		'category_name' => 'cat-1',
      		'paged' => get_query_var('paged') ,
      	);
      	query_posts($args); 
      ?>
    • 投稿取得する関数:query_posts($args) を利用
    • 引数:'category_name' => 'cat-1' はカテゴリーのスラッグ名の使用を注意してください
      カテゴリー別の投稿一覧取得:query_posts()関数の使用
  • 固定ページを作成して、作成したカスタムテンプレートを選択すれば、カテゴリー別の投稿一覧が表示されます
    • 固定ページのタイトルが表示されません
    • 固定ページのコンテンツが入力されても、表示されません
    • 固定ページのURLだけの利用となります
  • カスタムテンプレートのコードは以下のようです
    <?php
    /**
     * Template Name: Category Page
     */
    
    get_header(); ?>
    
    <div class="wrap">
    	<div id="primary" class="content-area">
    		<main id="main" class="site-main" role="main">
    
    			<?php
    				$args = array(
    					'post_type'=>'post',
    					'orderby' => 'date',
    					'order' => 'DESC',
    					'posts_per_page' => 10,
    					'category_name' => 'cat-1',
    					'paged' => get_query_var('paged') ,
    				);
    				query_posts($args); 
    			?>
    			<?php if(have_posts() ) : ?>
    				<?php while(have_posts()) : the_post(); ?>
    					<div>
    						<div>
    							<a href="<?php the_permalink() ?>"><?php the_title(); ?></a>
    						</div>
    					</div>
    				<?php endwhile; ?>
    			<?php endif; ?>	
    			
    		</main><!-- #main -->
    	</div><!-- #primary -->
    </div><!-- .wrap -->
    
    <?php get_footer();
    

     

検索フォーム

カテゴリ別

  • laravel
  • drupal
  • javascript
  • windows
  • html
  • mysql
  • php
  • apache
  • css
  • SEO
  • video
  • wordpress
  • linux
  • python
  • Electron
  • Visual Studio Code

google ads