'테마 파일 분석'에 해당되는 글 2건

스타터 테마 언더스코어스 분석

워드프레스 제작진이 워드프레스 사용자 및 테마 개발자들을 위해서 배포하고 있는 스타터 테마인 언더스코어스 테마를 구성하는 템플릿 파일(PHP 파일)들을 살펴보고 분석합니다. 테마 계층 구조를 통해서 알게 된 지식을 떠올리면 테마를 구성하고 있는 PHP 파일들의 용도를 쉽게 예상할 수 있을 것입니다.

_S 테마 다운로드

링크 : 언더스코어스 홈페이지

언더스코어스 홈페이지언더스코어스 홈페이지

Advanced Options를 열어서 생성할 테마에 대한 정보를 보다 자세히 입력할 수도 있습니다.

확장 옵션확장 옵션을 통해 테마 정보 입력 가능

입력란에 테마 이름으로 사용할 단어를 넣고 GENERATE 버튼을 클릭하여 테마 파일을 다운로드 받습니다.

테마 파일 다운로드지정한 이름의 _S 스타터 테마 생성 및 다운로드

_S 테마 설치

다운로드 받은 _S 테마 파일을 워드프레스에 설치합니다.

_S 테마 추가_S 테마 파일 설치

_S테마 파일이 등록된 것을 확인합니다. 썸네일 이미지 파일(screenshot.png)이 비어있기 때문에 아직 그림이 나타나지는 않습니다.

테마 관리 화면테마 관리 화면에서 _S 테마 설치 확인

테마를 활성화하고 Theme Editor에서 구성 파일을 봅니다.

테마 구성 파일_S 테마 구성 파일 전체

_S 테마 파일 구조 및 역할

_S를 구성하고 있는 파일들은 워드프레스 테마 구성 파일들 중에서 Primary Template 들이 주로 사용되었고, 커스텀 템플릿 파일을 불러오는 방식으로 여러 형식의 컨텐츠를 표시합니다.

    [ROOT] 디렉토리
  • 404.php : 페이지가 없는 경우 출력되는 에러 페이지 템플릿
  • archive.php : 아카이브(전체 글 목록) 템플릿
  • comments.php : 댓글 출력 템플릿
  • footer.php : 푸터 출력 템플릿
  • functions.php : 함수 정의 템플릿 - 기능 구현
  • header.php : 헤더 출력 템플릿
  • index.php : 인덱스 템플릿
  • page.php : 개별 페이지 출력 템플릿
  • rtl.css : 우측~좌측 글쓰기 언어용 스타일시트
  • screenshot.png : 테마 모양 미리보기용 스크린샷 파일
  • search.php : 검색 결과 페이지 출력 템플릿
  • sidebar.php : 사이드바 출력 템플릿
  • single.php : 개별 글 출력 템플릿
  • style.css : 스타일 시트
    [inc] 디렉토리
    참고 : inc = include
  • custom-header.php : 헤더 이미지 추가 기능
  • customizer.php : 테마 사용자 정의 옵션
  • extras.php : 테마 템플릿 독립 사용자 정의 기능
  • jetpack.php : 제트팩 호환성 파일 (무한 스크롤을 위한 테마 지원 추가)
  • template-tags.php : 이 테마를 위한 사용자 정의 템플릿 태그들
    [js] 디렉토리
    참고 : js = javascript
  • customizer.js : 테마 사용자 정의 기능 향상
  • navigation.js : 작은 화면용 내비게이션 및 드롭다운 지원
  • skip-link-focus-fix.js : 키보드 내비게이션을 위한 사용성 향상
    [languages] 디렉토리
    언어 파일 디렉토리
  • readme.txt : 언어 파일 도움말
  • 테마명.pot : 언어 파일 - poeditor 라는 프로그램에서 편집 가능
    [layouts] 디렉토리
    페이지 레이아웃 스타일 디렉토리
  • content-sidebar.css : 컨텐츠 좌측, 사이드바 우측 스타일
  • sidebar-content.css : 사이드바 좌측, 컨텐츠 우측 스타일
    [template-parts] 디렉토리
    개별 컨텐츠(페이지, 글 등) 템플릿 파일 디렉토리
  • content-none.php : 컨텐츠가 없는 경우 사용되는 템플릿(search.php, archive.php, index.php에서 연동)
  • content-page.php : 컨텐츠가 정적 페이지인 경우 사용되는 템플릿(page.php에서 연동)
  • content-search.php : 컨텐츠가 검색 결과 페이지인 경우 사용되는 템플릿(search.php에서 연동)
  • content-single.php : 컨텐츠가 개별 글인 경우 사용되는 템플릿(single.php에서 연동)
  • content.php : 컨텐츠가 archive, index 인 경우 사용되는 템플릿
블로그 이미지

환타73

디지털 콘텐츠 제작 및 연구 & 개발. 온오프라인 강의.

,

워드프레스 테마 파일 기능별 분류

테마 계층 구조에서는 홈페이지의 컨텐츠가 출력되는 일련의 흐름을 기준으로 설명했고, 이번에는 기능별로 파일들을 묶어서 살펴봅니다. 최하단에 있는 "계층 필터" 항목은 PHP 프로그래밍에 사용되는 것이므로 프로그래밍 지식이 없으신 분은 우선은 무시하셔도 됩니다.

참고 : 설명에 있는 "템플릿 파일"은 테마를 구성하는 "PHP 파일"과 같은 뜻이라고 생각하면 됩니다.

홈페이지 표시

사이트 전면 페이지 혹은 정적 페이지를 통해 출력되는 블로그 글 인덱스 페이지 표시에 사용되는 템플릿 파일입니다. 주의점으로는 사이트 전면 페이지의 경우 전면페이지 템플릿이 블로그 인덱스 페이지(home) 템플릿보다 우선한다는 것입니다.

  1. home.php : 읽기 설정 - 전면 페이지 - 블로그에 설정된 페이지에 연동되어서 출력
  2. index.php : 필수 테마 파일

전면 페이지 표시

정적 페이지나 블로그 글 인덱스가 출력되는 전면 페이지를 통해 사이트 전면 페이지 표시에 사용되는 템플릿 파일입니다.

  1. front-page.php : 읽기 설정과 관계 없이 사용가능
  2. 정적 페이지 표시 규칙 : 읽기 설정 - 정적인 페이지 - 전면 페이지가 설정되어 있는 경우
  3. 홈 페이지 표시 규칙 : 읽기 설정 - 정적인 페이지 - 글 페이지가 설정되어 있는 경우

개별 글 표시

개별 글 표시에 사용되는 템플릿 파일입니다.

  1. single-$posttype.php : 글 유형에 따라 해당 글 표시(single-product.php)
  2. single.php
  3. index.php

페이지 표시

정적 페이지 표시에 사용되는 템플릿 파일입니다.

  1. 사용자 템플릿 파일 : 페이지 템플릿 정의가 되어 있는 PHP파일
  2. page-$slug.php : 페이지의 슬러그명을 통해 해당 페이지 표시(page-recent-news.php)
  3. page-$id.php : 페이지의 ID를 통해 해당 페이지 표시(page-6.php)
  4. page.php
  5. index.php

카테고리 표시

카테고리 아카이브 표시에 사용되는 템플릿 파일입니다.

  1. category-$slug.php : 카테고리의 슬러그명을 통해 해당 카테고리 아카이브 표시(category-news.php)
  2. category-$id.php : 카테고리의 ID를 통해 해당 카테고리 아카이브 표시(category-6.php)
  3. category.php
  4. archive.php
  5. index.php

태그 표시

태그 아카이브 표시에 사용되는 템플릿 파일입니다.

  1. tag-$slug.php : 태그의 슬러그명을 통해 해당 태그 아카이브 표시(tag-sometag.php)
  2. tag-$id.php : 태그의 ID를 통해 해당 태그 아카이브 표시(tag-6.php)
  3. tag.php
  4. archive.php
  5. index.php

사용자 분류 표시

사용자 분류 아카이브 표시에 사용되는 템플릿 파일입니다.

  1. taxonomy-$taxonomy-$term.php : 사용자 분류명과 소분류명(항)을 통해 해당 아카이브 표시(texonomy-post_format-post-format-link.php)
  2. taxonomy-$taxonomy.php : 사용자 분류명을 통해 해당 아카이브 표시(taxonomy-sometax.php)
  3. taxonomy.php : 사용자 분류를 통해 아카이브 표시
  4. archive.php
  5. index.php

사용자 글 유형(Custom Post Type) 아카이브 표시

사용자 글 유형 아카이브 표시에 사용되는 템플릿 파일입니다.

  1. archive-$posttype.php : 사용자 글 유형 아카이브 표시(archive-product.php)
  2. archive.php
  3. index.php

사용자 글 유형의 개별 페이지를 표시는 "개별 글 표시"를 참조합니다.

글쓴이 표시

글쓴이 아카이브 표시에 사용되는 템플릿 파일입니다.

  1. author-$nicename.php : 글쓴이의 nicename을 통해 해당 글쓴이 아카이브 표시(author-rami.php)
  2. author-$id.php : 글쓴이의 ID를 통해 해당 글쓴이 아카이브 표시(author-6.php)
  3. author.php
  4. archive.php
  5. index.php

날짜별 표시

날짜별 아카이브 표시에 사용되는 템플릿 파일입니다.

  1. date.php
  2. archive.php
  3. index.php

검색 결과 표시

검색 결과 아카이브 표시에 사용되는 템플릿 파일입니다.

  1. search.php
  2. index.php

404(결과 없음) 표시

서버 404 에러 표시에 사용되는 템플릿 파일입니다.

  1. 404.php
  2. index.php

첨부 파일 표시

개별 첨부 파일 페이지 표시에 사용되는 템플릿 파일입니다.

  1. $mimetype.php : 첨부 파일의 종류에 해당하는 페이지 표시(image.php, video.php, application.php). 예 : text/plain 의 경우 다음의 순서로 참조.
    1. text.php
    2. plain.php
    3. textplain.php
  2. $subtype.php : 첨부 파일의 확장자에 해당하는 페이지 표시(jpg.php, mp4.php)
  3. $mimetype-$subtype.php : 첨부파일의 종류 및 확장자에 해당하는 페이지 표시(image-jpg.php, video-mp4.php)
  4. attachment.php
  5. single.php
  6. index.php

계층 필터

워드프레스의 템플릿 시스템은 계층적으로 필터를 적용할 수 있습니다. 필터링을 위한 필터 이름은 "{$type}_template"를 사용합니다. PHP 프로그래밍에 사용할 수 있습니다.

    필터 리스트
  • index_template
  • 404_template
  • archive_template
  • author_template
  • category_template
  • tag_template
  • taxonomy_template
  • date_template
  • home_template
  • front_page_template
  • page_template
  • paged_template
  • search_template
  • single_template
  • text_template, plain_template, text_plain_template (all mime types)
  • attachment_template
  • comments_popup
블로그 이미지

환타73

디지털 콘텐츠 제작 및 연구 & 개발. 온오프라인 강의.

,