빠르고 깔끔한 테마 개발을 위한 Twig 템플릿 엔진

워드프레스 테마의 소스를 수정하려고 파일을 열었다가 HTML과 PHP 코드가 뒤죽박죽 섞여 있어 분석하는데 많은 시간을 쏟았던 경험이 있으시다면 이번 포스트에서 소개하는 Twig 템플릿 엔진을 참고해보세요.

Twig 템플릿 엔진

The flexible, fast, and secure
template engine for PHP – http://twig.sensiolabs.org

워드프레스 웹사이트에서 보여지는 페이지의 구조를 아주 간단하게 설명하자면 잘 짜여진 골격(템플릿) 안에 각종 데이터가(글, 날짜, 카테고리, 태그 등) 표시되는 것입니다. 데이터를 템플릿에 표시하기 위해 PHP언어를 사용하기 때문에 테마 소스가 복잡하게 보이는 것이죠.

아래는 포스트 썸네일의 ID를 받아서 이미지의 URL을 찾고 img 태그로 그 이미지를 표시하는 코드입니다. 워드프레스에서 유용한 API를 제공하기 때문에 쉽게 포스트의 이미지를 불러올 수 있지만 HTML태그와 섞여 있어 한 눈에 들어오지가 않죠.

위의 코드에서 PHP와 HTML 템플릿을 분리하고 데이터만 HTML 템플릿에 전달하면 조금 더 템플릿이 깔끔해질 것 같습니다. 이럴 때 Twig을 이용하면 위의 코드를 아래와 같이 깔끔하고 이해하기 쉽게 변경할 수 있습니다.

앞에서는 보이지 않지만 뒷단에서 열심히 필요한 데이터 작업을 끝내고 전면의 템플릿에 데이터를 전달해주는 역할을 Twig이 하고 있는 것입니다.

Twig을 사용한 개발

Twig을 사용하기 위해서는 http://twig.sensiolabs.org/ 에서 인스톨을 하고 워드프레스 테마에 직접 적용할 수도 있지만 감사하게도 워드프레스에서 Twig을 사용할 수 있도록 만들어진 플러그인 및 테마가 있습니다.

Timber 플러그인 + ( 플러그인에 스타터 테마 포함 )

SPRIG 스타터 테마
sprig

마치며

Twig템플릿 엔진을 사용하면 테마 개발에도 도움이 되지만 차후 테마 관리 측면에서 매우 편리함을 느낄 수 있습니다. 혹시 Twig을 처음 접해보신 분들도 스타터 테마를 예제로 삼아서 소스를 조금씩 수정하시다 보면 금방 사용방법을 익히실 수 있으실거에요. 그럼 오늘도 즐거운 블로깅 하세요!

글쓴이

HwangC

안녕하세요! 여러분의 편안한 워드프레스 안내자 황씨입니다.

“빠르고 깔끔한 테마 개발을 위한 Twig 템플릿 엔진”에 대한 2개의 생각

  1. 와우~~ 이런 것이 있네요?
    저같은 비개발자야 테마 개발까지 할 필요가 없는 것이 좋은 점이기도 하지만 마음껏 수정하고 싶으신 분들께는 좋은 도구임에 틀림 없어 보입니다.

답글 남기기

이메일은 공개되지 않습니다. 필수 입력창은 * 로 표시되어 있습니다.