여러분이 사용하고 계신 브라우저는 HTML5를 지원하지 않기 때문에 몇몇 요소가 제대로 보이도록 JScript를 사용하고 있습니다. 하지만 여러분의 브라우저 설정에서 스크립트 기능이 꺼져있으므로, 현재 페이지를 제대로 확인하시려면 스크립트 기능을 켜주셔야 합니다. 워드프레스 테마 제작 – 12편 - search.php, searchform.php 만들기
워드프레스 테마 제작 – 12편 – search.php, searchform.php 만들기
2년전 작성
2년전 수정

워드프레스에 검색창 searchform.php 파일, 검색 결과 페이지 search.php 파일을 만들어보자.

워드프레스 search.php, searchform.php

검색창이 없으면 포스트를 찾고 싶을 때 다 뒤져야되서 귀찮다.

워드프레스 search.php, searchform.php

searchform.php 파일 만들기

검색창을 만들 때 검색폼을 만들고 검색 결과 화면을 따로 만들어야 다른 페이지에서도 검색폼을 불러오기가 수월하다.

searchform.php 예시
<form method="get" action="<?php echo esc_url(home_url('/')); ?>">
	<input type="text" name="s" placeholder="검색어를 입력해주세요." />
	<input type="submit" value="검색" />
</form>
사용된 코드 설명
esc_url(home_url(‘/’));
:
url을 확인하고 정리하는 함수.
input type=”text” name=”s” placeholder=”검색어를 입력해주세요.”
:
text 입력할 수 있는 창에 이름은 반드시 “s”로 설정, placeholder는 text 입력창에 보여줄 문구를 입력한다.

여기에는 header와 sidebar, footer가 들어가면 안된다.
정말 딱 검색창만 들어가게끔 폼을 만들어야한다.

search.php 파일 만들기

search.php 예시
<?php
	get_header();
?>

<h3><?php echo '검색어 : '.get_search_query(); ?></h3>
<?php get_search_form(); ?>

<?php
	if ( have_posts() ) :
		while ( have_posts() ) :
			the_post();

			global $post;
			$category = get_the_category($post->ID);
			echo $category[0]->name;
?>
	<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
<?php
			the_time('Y-m-d');
		endwhile;
	else : 
		echo '검색 결과를 찾을 수 없습니다.';

	endif;
?>
<?php
	global $wp_query;
	$big = 999999999;
	echo paginate_links(
		array(
			'base' => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ),
			'format' => '?paged=%#%',
			'current' => max( 1, get_query_var('paged') ),
			'total' => $wp_query->max_num_pages,
			'prev_next' => false,
		)
	);
?>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
사용된 코드 설명
get_search_query();
:
입력한 검색어 불러오는 함수.
get_search_form();
:
검색폼 불러오는 함수.

테마 적용

워드프레스 테마 제작 - 12편 - search.php 적용

문제 없이 출력 잘 되는것 확인된다.

참고
관련 포스트

Mingg`s Diary
밍구
공부 목적 블로그