워드프레스 테마의 구조

1. 워드프레스 테마의 구조
한국 워드프레스 사용자 모임
천 영 민 (082net)

2. 목 차
Ⅰ 워드프레스의 출력 과정
Ⅱ 템플릿 파일 찾아가기
Ⅲ The Loop & Condition
Ⅳ 버디프레스 테마 적용
Ⅴ 워드프레스 테마 Hooks

3. 워드프레스의 출력 과정
Plugin – Actions and Filters
요 청 분 석 출 력
REQUEST URI Home Index
Singular Static Page
CUSTOM QUERY
Archive Optional
APP, API CALL
Others Query Based

4. 요청된 페이지의 형식 (Conditional Tags) wp-includes/query.php
http://codex.wordpress.org/Conditional_Tags
is_home()
HOME is_front_page()
home.php, front-page.php
is_single()
SINGULAR is_page()
is_attachment()
is_category()
is_date(), is_year(), is_month(), is_day(), is_time()
ARCHIVE is_tag()
is_tax()
is_post_type_archive()
is_author()
is_search(), is_robots(), is_404()
OTHERS is_comments_popup()
is_feed() is_comment_feed()
is_trackback()

5. 워드프레스 템플릿 파일 wp-content/themes/twentyeleven/
http://codex.wordpress.org/Theme_Development#Basic_Templates
style.css, index.php
BASIC comments.php
footer.php
header.php
sidebar.php
STATIC PAGE page.php, page-my-custom.php(커스텀 템플릿)
header-{name}.php (sidebar, footer)
category-{slug}.php category-{ID}.php
OPTIONAL tag-{slug}.php tag-{ID}.php
taxonomy-{taxonomy}-{tax_slug}.php
single-{post_type}.php
image.php, jpeg.php, image_jpeg.php
archive.php, date.php, author.php, search.php,
QUERY BASED 404.php, home.php, front-page.php, paged.php,
single.php, attachment.php, comments-popup.php,
category.php, tag.php, taxonomy.php

6. http://codex.wordpress.org/Template_Hierarchy
wp-includes/theme.php

7. wp-content/themes/twentyeleven/index.php
워드프레스 루프 (The Loop) wp-includes/query.php

9. locate_template() 와 get_template_part()
템플릿 파일을 포함시키는 기본 함수
locate_template을 이용해서 자동으로 지정된 파일을 찾아 반복적으로 포함시킴
예) get_template_part( „content‟, „post‟);

10. functions.php (테마의 기능적인 면을 이해)

11. functions.php

14. BuddyPress Templates
http://wordpress.org/extend/plugins/bp-template-pack/
BuddyPress Template Pack을 이용하면 손쉽게 기존에 사용중인 테마에 BuddyPress를 적용할 수 있다.
BuddyPress가 업그레이드 되었을 경우 혹은 자싞의 테마에 좀 더 쉽게 적용하는 TIP.
현재 테마에 BuddyPress 템플릿을 적용한 뒤에는 style.css 의
“Tags:” 부분에 buddypress를 추가 해 두는것을 잊지 말자.

15. bp-default 에서 필요한 파일(폴더)들 모두 복사
/wp-content/plugins/buddypress/bp-themes/bp-default

16. bp-default 기본 구조, 현재 테마 구조 비교 및 수정
/themes/twentyeleven/page.php
복사한 폴더(파
일) 중에서
get_header() 를
포함하고 있는
모든 파일들을
찾아 수정 함.
/themes/{current_theme}/activity/index.php

17. bp-default CSS 스타일을 현재 테마에 적용.
4. Navigation,
6. Buddypress
두 부분의 CSS를 현
재 테마에 추가

18. WordPress Hooks for theme templates
워드프레스 테마를 처음 제작할 때 주의할 점은 워드프레스 테마에 기본적으로 꼭 들어가야 하는 부분이
바로 wp_head(), wp_footer() 이다.
갂혹 header 부분의 title 부에 wp_title()을 사용하지 않고 직접 제작한 함수를 사용할 경우 Custom
Query를 포함한 플러그인들과 문제를 일으킬 수 있으니 되도록 wp_title() 을 이용하도록 하자.
wp_head(), wp_footer() – wp-includes/default-filters.php
wp_footer() – wp-includes/admin-bar.php

19. Custom theme hooks
워드프레스 테마 프레임웍, 플러그인들 중에는 자싞들 만의 custom hook을 이용하기도 함.
BuddyPress > bp-default > activity > index.php
Custom hook을 쓰지않고 sidebar(widgets)를 확장해서 웎하는곳에 컨텐츠를 넣기도 함.
Themes > twentyeleven > sidebar-footer.php

20. 워드프레스 테마에 대한 이해, 그 첫걸음은…
워드프레스의 테마를 가장 쉽고
빠르게 이해하고 응용하고 싶다
면 기본으로 포함되어 있는 테
마 Twenty Ten 과 Twenty
Eleven을 살펴보고 이해하는것
이 최선이다.
그 처음으로서 개인적으로 추천
하는 것은 각 테마의 Child 테마
를 만들어 하나 하나 수정해 보
고 실험 해 보는 것이다.

21. 고맙습니다!
한국 워드프레스 사용자 모임 http://kopress.kr/