본문 바로가기
지속가능티끌/웹,워드프레스

워드프레스 테마 만들기 8편. 검색창 템플릿 searchform.php 추가하기.

by 리치굿맨 2014. 10. 30.

 

 

본 글은 "워드프레스 테마 만들기" 시리즈 글 8편이며, 7편에 연결된 내용임.

 

워드프레스 테마 만들기 7편. archive.php, 404,php, search.php추가. 보기 -> http://igotit.tistory.com/141  

 

 

 

 

 

개요.

   
 

본 테마만들기 8편에서는 테마에 검색창 템플릿인 searchform.php 를 추가한다. 이전의 템플릿과 달리 검색창에서는 <form> </form> 태그가 필요하다.

 

 

 

 

 

1. searchform.php 만들기.

   
 

searchform.php 는 검색폼 표현하는 용도이다.

워드프레스 기본 검색폼은 아래 그림의 검색 : 에디트박스 버튼 으로 구성된 간단한 폼이 제공된다.

참고 : 워드프레스의 기본 검색폼 템플릿은 별도의 템플릿 파일로 되어있지 않고 wp-includes/general-templates.php 내에 일부분 (라인 235 에 있음 )에 검색폼이 코드로써 정의가 되어있다.


 

검색폼이 보이는 모습을 테마에서 직접 제공하려면 searchform.php 를 만들어서 테마에 추가하면된다.

 

searchform.php 만드는 방법 codex 설명 -> http://codex.wordpress.org/Function_Reference/get_search_form

 

1. searchform.php 만들기.

searchform.php 파일을 새로 만들고 아래와 같이 코드 작성하여 테마 폴더에 넣는다.

붉은색으로 된 부분은 필수에 해당한다.

 

<p>----검색폼시작 ---- </p>
<form method="get" action="<?php echo esc_url(home_url('/')); ?>">
<input type="text" name="s"/>
<input type="submit" value="Search" />
</form>
<p>----검색폼끝 ---- </p>

 

다른 템플릿과는 달리, 검색폼은 header, footer 등이 포함되지 않음에 주의한다. 보통 검색폼은 다른 템플릿(이미 헤더와 푸터등이 있는) 내에서 호출되어 부분적으로 검색창과 버튼을 가진 html form 만 포함되기 때문에 hrader, footer 를 포함하면 안된다.

get method인 <fom> </fomr> 으로 감싸면서, 폼이 제출될때 타겟주소를 사이트의 베이스 URL로 하는 것이 esc_url(home_url('/'));

코드의 <input type="text" name="s"/> 는 텍스트 박스를 만들고 이름을 s 로 지정하는것. 이름은 반드시 s로 해야 정상 처리됨.

코드의 <input type="submit" value="Search" /> 는 폼의 버튼이고 이것이 눌러지면 action 으로 연결되게 된다. 버튼에 보이는 글자는 Search 로 하였다.


 
2. 사이트에서 정상동작 확인하기.

앞의 1에서 만든 searchform.php 를 테마 폴더에 넣어두고, 사이트에서 검색창에서 보이는 모습과 검색을 수행해보면 정상작동한다.

아래 그림은 검색창의 모습.


 

 

- searchform.php 를 테마에 추가하였다.

 

 

 

 

정리 - 현재까지 만들어진 Skeleton 테마의 파일들.

 

본 테마만들기 8편까지 우리의 테마에 추가된 템플릿(php) 파일들은 아래그림과 같다.

 

 

1. index.php 와 style.css  :  테마만들기 시작 1편에서 만들어졌음 -> http://igotit.tistory.com/85

2. header.php, footer.php : 테마만들기 2편에서 추가됨. -> http://igotit.tistory.com/122

3. single.php : 테마 만들기 4편에서 추가됨. -> http://igotit.tistory.com/126

4. functions.php, page.php : 테마 만들기 5편에서 추가됨.. -> http://igotit.tistory.com/129

5. sidebar.php : 테마 만들기 6편에서 추가됨 -> http://igotit.tistory.com/135

6. archive.php, 404.php, search.php : 7편에서 추가됨. -> http://igotit.tistory.com/141

7. searchform.php : 본 8편에서 추가됨.

 

 

 

 

 

본 글이 포함된 통합 정리 글

 

WordPress 활용정보 정리 : http://igotit.tistory.com/23

 

 

163.

 


댓글0


   
현물 |선물 인버스 |선물 USDT     현물 | 선물 USDT |봇제작툴/카피트레이딩     현물 |선물 인버스 |선물 USDT     선물 인버스 |선물 USDT