LoginSignup
0
0

More than 1 year has passed since last update.

カテゴリ別お知らせ機能をつくる時にやること

Last updated at Posted at 2022-03-31

1.wordpress化
2.index.phpのお知らせを表示したい部分に以下を記述、カスタムフィールドでそれぞれのカテゴリを作って、スラッグの部分にカテゴリの名前(当てたいCSSを書く)、それぞれのスラッグ名のクラスにCSSを当てたものを用意するとカテゴリ別に色分けできる

<?php query_posts('showposts=3'); ?>
				<?php if (have_posts()) :while (have_posts()) : the_post(); ?>	
					
					
					
				<?php
				$cat = get_the_category();
				$catname = $cat[0]->cat_name; //カテゴリー名
				$catslug = $cat[0]->slug; //スラッグ名
				?>
			
						
				<li class="link_area">
					
					<a href="<?php the_permalink();?>">
						<aside class="<?php echo $catslug; ?>"><?php echo $catname; ?></aside>
						
						
						<time><?php the_time('Y. m. d');?></time>
						<h3 class="h"><?php the_title();?></h3>
						<p><?php
						if(mb_strlen($post->post_content,'UTF-8')>200){
							$content= str_replace('\n', '', mb_substr(strip_tags($post-> post_content), 0, 80,'UTF-8'));
							echo $content.'……';
						}else{
							echo str_replace('\n', '', strip_tags($post->post_content));
						}
						?></p>
											</a>
				</li>
				<?php endwhile;endif;?>
				<?php wp_reset_query(); ?>

3.single.phpに以下を記述

<?php //クエリー渡す
                    $paged = get_query_var('paged', 1);
                    $args = array(
                        'paged' => $paged,
                        'post_type' => 'post',
                    );
                    $query = new WP_Query($args);
                ?>
		
		
		
        
         <?php if (have_posts()) :while (have_posts()) : the_post(); ?>
			
			<?php
				$cat = get_the_category();
				$catname = $cat[0]->cat_name; //カテゴリー名
				$catslug = $cat[0]->slug; //スラッグ名
				?>
		
			
				<div class="col-12">
					<div class="news_item">
						<div class="date_wrap">
							<h2 class="category <?php echo $catslug; ?>">
								<?php echo $catname; ?>
							</h2>

							<div class="date">
								<?php echo get_post_time('Y.m.d');?>
							</div>
						</div>
						
						<h2 class="news_ttl font-M"><?php the_title();?></h2>
						
						
						
						<p class="news_p">
							<?php the_content(); ?>
						</p>
						
					</div>		
				</div>
			<hr class="archive_hr">
		
		
          <?php endwhile;endif;?>
			
                    <ul class="pager">
                        <li class="before_link link">
                        <?php previous_post_link('%link', '« 前へ');  ?>
                        </li>
					
						<li><a href="<?php echo $root_url ?>" class="return_home btn">ホームへ戻る</a></li>
					
						
                        <li  class="after_link link">
                        <?php next_post_link('%link', '次へ »'); ?>
                        </li>
                    </ul>
           
  1. archive.phpに以下を記述

<?php //クエリー渡す
                    $paged = get_query_var('paged', 1);
                    $args = array(
                        'paged' => $paged,
                        'post_type' => 'post',
                    );
                    $query = new WP_Query($args);
                ?>
		
		
		
        
         <?php if (have_posts()) :while (have_posts()) : the_post(); ?>
			
			<?php
				$cat = get_the_category();
				$catname = $cat[0]->cat_name; //カテゴリー名
				$catslug = $cat[0]->slug; //スラッグ名
				?>
		
			
				<div class="col-12">
					<div class="news_item">
						<div class="date_wrap">
							<h2 class="category <?php echo $catslug; ?>">
								<?php echo $catname; ?>
							</h2>

							<div class="date">
								<?php echo get_post_time('Y.m.d');?>
							</div>
						</div>
						
						<h2 class="news_ttl font-M"><?php the_title();?></h2>
						
						
						
						<p class="news_p">
							<?php the_content(); ?>
						</p>
						
					</div>		
				</div>
			<hr class="archive_hr">
		
		
          <?php endwhile;endif;?>
			
                    <ul class="pager">
                        <li class="before_link link">
                        <?php previous_post_link('%link', '« 前へ');  ?>
                        </li>
					
						<li><a href="<?php echo $root_url ?>" class="return_home btn">ホームへ戻る</a></li>
					
						
                        <li  class="after_link link">
                        <?php next_post_link('%link', '次へ »'); ?>
                        </li>
                    </ul>

WP-PAGEnavというプラグインを入れてくださいやり方は別記事参照(ページネーションを作るより)

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0