워드프레스 테마 만들기: index.php, header.php 그리고 footer.php

  1. 워드프레스 테마를 만들기 위해서는 index.php 파일이 반드시 필요합니다.
  2. 하지만 index.php 파일로 표시되는 부분중 상단과 하단에 고정적으로 표시 되는 부분이 있는데,
  3. 상단 고정 내용은 header.php 파일로 뽑아내고,
  4. 하단 고정 내용은 footer.php 파일로 뽑아내면 됩니다.

앞선 포스트에서 워드프레스 테마 만들기의 필수 구성 요소로 소개한 index.php 파일에 대해 조금 더 자세히 알아볼까 합니다.

어떤 내용을 보여줄까: index.php

index.php 는 실제 이 테마가 어떤 내용을 보여줄지에 대한 정보를 담고 있습니다. 따라서 기본적인 HTML 문서의 구조가 이 안에 담겨야 합니다.

기본적인 HTML 문서의 구조

<html>
    <head>

    </head>
    <body>

        <!-- 실제 사용자에게 보여질 내용들 -->

        ...

        <footer>

        </footer>
    </body>
</html>

정말 아무 내용도 들어 있지 않은 HTML 문서의 기본 구조입니다. 바로 이 내용이 index.php 에 담겨야 하는 것입니다.

header.php 와 footer.php

하지만 조금만 더 생각 해보면 일반적으로 위 문서구조에서 주석 처리된 실제 사용자에게 보여지는 내용만 계속 달라질 뿐, <body> 윗 부분과 <footer> 아랫 부분은 계속해서 같은 내용일 것입니다.

따라서 이는 header.phpfooter.php 에 각각 담아 둔 뒤 필요할때만 불러와 쓰면 됩니다. 그렇게 되면 index.php, header.php, footer.php 로 나눠진 위 구조는 아래와 같습니다.

<!-- header.php -->
<html>
    <head>

    </head>
    <body>
<!-- index.php -->

    <?php get_header(); ?>

        <!-- 실제 사용자에게 보여질 내용들 -->

        ...
    <?php get_footer(); ?>
<!-- footer.php -->

        <footer>

        </footer>
    </body>
</html>

get_header 와 get_footer

눈치 채셨겠지만, 위 분할된 HTML 문서 구조에서 index.php 파일에 get_header 와 get_footer 라는 함수가 사용 되었습니다.

get_header 는 문서 본문보다 앞에 header.php 파일을 불러와 출력하는 것이고, get_footer 함수는 문서 본문 이후에 footer.php 파일을 불러와 출력 하는 것입니다.

왜 header.php 와 footer.php 를 따로 불러와서 사용할까

이렇게 구조를 짜는 이유는 간단합니다.

우리는 간단하게 index.php 파일만 만들었지만, 워드프레스에서 블로그의 다양한 내용을 보여주기 위해서는 개별 포스트를 보여주기 위한 single.php, 포스트가 아닌 페이지를 보여주기 위한 page.php, 카테고리를 보여주기위한 category.php 등 다양한 파일들이 사용됩니다. 물론 각 파일이 출력하는 내용의 이전에는 당연히 header.php 의 내용이 선두에 와야 하고 본문에 이어 footer.php 의 내용이 따라 붙어야 합니다.

따라서 우리는 위에서 나열한 각 파일이 항상 get_header 함수로 시작해 get_footer 함수로 끝나도록 해야 하는 것입니다.


아주 간단한 내용이지만 글로 풀어쓰니 굉장히 길어지네요. 계속 화이팅 합시다.