ワイズリマインダー

検索結果ページを作成

search.php

<?php get_header();?>
<main>
 
<div id="main">

<h2>検索結果：約<?php echo $wp_query->found_posts;?>件</h2>


<div id="searchInfo">キーワード：<?php echo esc_html(get_search_query(false));?></div>


<?php if(have_posts()):?><!-- have_posts -->
 
<div id="child_items">
<?php while(have_posts()):the_post();?>
  
<article class="type-post">
<?php if(has_post_thumbnail()):?>
   
<div class="thumb"><a href="<?php the_permalink();?>"><?php the_post_thumbnail(array(100, 80));?></a></div>

<?php else:?>
   
<div class="thumb"><a href="<?php the_permalink();?>"><img src="<?php bloginfo('template_url');?>/img/noimage.png" width="100" height="80"></a></div>

<?php endif;?>
   
<div class="title"><a href="<?php the_permalink();?>"><?php the_title();?></a></div>

   <time datetime="<?php the_time('Y-m-d'); ?>"><?php the_time('Y.m.d H:i'); ?></time>
   <?php the_tags('
<ul>
<li>', '</li>
<li>', '</li>
</ul>

');?>
  </article>

<?php endwhile;?>
 </div>

<!-- child_items END -->
<?php endif;?><!-- have_posts END -->

<?php
$prev = get_previous_posts_link('≪新しい投稿ページへ');
$next = get_next_posts_link('古い投稿ページへ≫');
if($prev || $next){
  echo "
<ul class=\"paging\">\n";
  if($prev) echo " 
<li>{$prev}</li>

\n";
  if($next) echo " 
<li>{$next}</li>

\n";
  echo "</ul>

\n";
};
?>

 </div>

<!-- main END -->
<?php get_sidebar();?>
</main>
<?php get_footer();?>

style.css

#searchInfo{
	padding:4px 8px;
	font-size:12px;
	line-height:14px;
	background-color:#e6e6e6;
}

#child_items > article{
	box-sizing:border-box;
	padding-top:20px;
	padding-bottom:20px;
	border-bottom:1px solid #f2f2f2;
	width:100%;
	height:120px;
	position:relative;
}
#child_items > article > div.title{
	position:absolute;
	top:20px;
	left:0;
	box-sizing:border-box;
	width:100%;
	padding-left:120px;
	text-overflow:ellipsis;
	overflow:hidden;
	white-space:nowrap;
}
#child_items > article > div.title > a{
	text-decoration:none;
	color:black;
	font-size:18px;
	line-height:18px;
}
#child_items > article > div.title > a:hover{
	color:#0080a2;
}
#child_items > article > time{
	position:absolute;
	top:45px;
	left:120px;
	color:#999999;
	font-size:11px;
	line-height:11px;
}
#child_items > article > ul{
	position:absolute;
	top:78px;
	left:120px;
	margin:0;
	padding:0;
	list-style-type:none;
}
#child_items > article > ul:after{
	content:"";
	clear:both;
	height:0;
	display:block;
	visibility:hidden;
}
#child_items > article > ul > li{
	margin-left:5px;
	padding:5px;
	font-size:12px;
	line-height:12px;
	float:left;
	background-color:#b3b3b3;
}
#child_items > article > ul > li:first-child{
	margin-left:0;
}
#child_items > article > ul > li > a{
	color:white;
	text-decoration:none;
}

• ≪新しい記事へ
• 古い記事へ≫

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください。