Child Theme ( 차일드 테마 )

현재위치:/Child Theme ( 차일드 테마 )

출처 : Avada.KR

 

워드프레스를 설치하고, 기본설치안에 들어있는 테마 중에 2012테마를 선택해서 사이트를 꾸미기 시작했습니다.
그런데 사용하다보니… 여기저기 마음에 안드는것들이 보입니다. 조금씩만 바꿔주면 될거 같은데….. 또는 필요한 템플릿파일이 있는데…. (예를들어 특정 카테고리에만 다른 템플릿파일을 쓰고 싶은데.. 내가 선택한 2012테마에는 없어서 하나 만들어 쓰려할경우에….등등)
그래서 있는 실력, 없는실력 발휘해서 여기저기 손대기 시작합니다.
style.css파일 , index.php 파일, 내친김에 category.php파일을 수정하고, 나만의 category-apple.php파일도 만들어 놓고…. 잘 운영하다가 어느날 관리창을 보니 몇개의 업그레이드 표시가 있어서 무심코 버튼을 눌렀습니다….
그런데….. (이런… 2012테마는 왜 업그레이드 된거야…..!!!! )
수정해 놓았던 내용이 모두 날아가 버립니다. 모두….. 전부…….

위와 같은 사태를 막기위해서 자식테마라는 구조를 워드프레스는 만들어 놓았습니다.

기본개념은 내가사용하고 싶은 테마를 부모로 정하고,
자식테마를 만들어서 필요한 부분만 바꿔서 사용하도록 하는겁니다.

먼저 말하고 싶은 것은 자식테마를 만드는 방법은 아주 아주 쉽습니다.

그럼 바로 한번 만들어 보죠

워드프레스 테마가 담겨있는 곳에 ( http://나의도메인/wp-contents/themes/ )
폴더 하나를 만듭니다.
폴더의 이름은 부모로 삼고싶은 테마하나를 선택해서 자식이라고 덧붙이면 됩니다. (사실 아무이름이나 되는데..
구별하기 좋으라고요..)

예를 들어 워드프레스를 막 설치하고, 테마 폴더 내에 twentytwelve 테마를 부모테마로 선택한후,
자식테마를 만들기 위해서 12-child 라는 폴더를 만든다면, 아래와 같을겁니다.

child_theme_01

( index.php 파일은 보안을 위해서 만들어 놓은거랍니다. )

위의 12-child 폴더는 비어있는거죠….

저안에 파일 하나를 만들어 넣을 겁니다.

새 문서를 만들어서

라고 입력하고, style.css 라는 이름으로 저장합니다.

다 만들었습니다 !

이제 워드프레스 관리자 창으로 가서 appearance – themes 로 들어가 보시면,
방금 내가 만든 테마가 보일겁니다.

‘activate’를 누르세요. ( 테마가 바뀔 겁니다. 방금전에 내가 만든 테마로…)
그런데 이를 어쩌죠 사이트가 난리가 났습니다.
이상해져 버린거죠. 콘텐츠랑 있을건 다 있는데… 줄도 안서있고 엉망이죠…..

다시 새문서를 하나 만듭니다. ( 이전에 @import 를 사용했던 방식은 이제 더 이상 좋은 방법이 아닙니다. )
그 문서에 다음과 같이 입력하고 12-child 폴더 안에 functions.php 파일 이라는 이름으로 저장합니다.

설명

1.자식테마를 만들때 꼭 필요한 파일은 딱 두개 바로 style.css 와 functions.php 입니다.
이 파일이 꼭 있어야 자식테마로 인식합니다.

2.위의 style.css 파일에는 꼭 부모가 누구인지 선언해 주어야 합니다.
template: twentytwelve (요렇게요 , 나의 부모는 twentytwelve 이다 라고요 , 여기서 부모의 이름은 부모로 삼을 테마의 ‘폴더명’ 입니다.)

3.그럼 이때부터 자식 폴더 (12-child) 는 템플릿파일을 찾을때 우선순위를 갖습니다.

우선순위 : Template Hierarchy 참조

( ex.1
index.php파일이 필요하면 먼저 12-child 폴더를 확인해서, 있으면 사용하고,
없으면 부모의 폴더로(twentytwelve) 가서 index.php 파일을 찾아 사용합니다.

ex.2
‘apple’ 이라는 태그를 누군가가 눌러서, 템플릿 파일을 찾는다면,
먼저 12-child 폴더에서 tag-apple.php 파일을 찾고 없으면,
twentytwelve 폴더에서 tag-apple.php 파일을 찾고 없으면,

12-child 폴더에서 tag-134.php 파일을 찾고 없으면,
twentytwelve 폴더에서 tag-134.php 파일을 찾고 없으면,

12-child 폴더에서 category.php 파일을 찾고 없으면,
twentytwelve 폴더에서 category.php 파일을 찾고 없으면,

12-child 폴더에서 archive.php 파일을 찾고 없으면,
twentytwelve 폴더에서 archive.php 파일을 찾고 없으면,

12-child 폴더에서 index.php 파일을 찾고 없으면,
twentytwelve 폴더에서 마지막으로 index.php 파일을 찾아서 .. 보여 줍니다.

4. 12-child 폴더에 파일이 존재한다면, 부모 폴더의 같은 파일은 사용하지 않습니다.

이것이 중요합니다.

자식폴더내에 style.css 파일이 있으니 부모테마폴더의 멀쩡한 style.css 파일은 놔두고, 이것을 가져다가 쓰게 되고 , 이 파일 은 선언만 했을뿐 아무런 스타일정의가 없으니… 처음에 올렸을때 사이트가 엉망이 되어버린겁니다.
스타일 시트가 하나도 들어가지 않은 원시 사이트가 된거죠.

5. 그래서 이를 방지하기위해 functions.php 파일안에 자식테마가 로드됨과 동시에 부모테마안에 있는 style.css 파일을 가져오라고 명령을 넣습니다. ( 코드2 )

6. 이제 바꾸고 싶은(커스터마이징) 스타일이 있다면 차일드 폴더의 style.css 파일 아래에 적어 넣으면 됩니다.

7. 부모 폴더내에 마음에 안드는 템플릿파일을 그대로 복사해 와서 자식폴더내에 붙여넣은후에 수정합니다.
수정된 파일은 자식폴더에 있으므로 먼저 사용되어질거고, 부모폴더의 파일은 사용되지 않습니다.

8. 부모테마폴더내에 존재하지 않는 특별한 템플릿 파일이 필요하다면, 따로 만들어서 자식테마폴더에 넣으면 됩니다. 이 글 맨위의 예를 보면 category-apple.php 파일이 되겠죠.

9. 자식테마내의 모든 파일은 부모테마내 동일한 이름의파일을 덮어씁니다.
딱 하나만 빼고요, 바로 functions.php 파일 입니다.

이 functions.php 파일은 부모테마의 것에 자식테마의 것을 추가(add) 합니다.
필요한 추가 함수가 있을경우 자식테마의 functions.php에 추가만 하면 됩니다. 그럼 style.css 나 다른 템플릿 파일들처럼 차일드에 있으면 부모폴더의 것을 완전히 덮어쓰는것이 아니라, 부모테마의 functions.php + 자식테마의 functions.php 가 됩니다.

( 이거 하나만 이렇게 되도록 하는 이유는, 기본적으로 자식테마폴더내의 functions.php파일을 먼저 로딩 하는 구조로 만들어서 이후에 로딩되는 부모테마폴더의 functions.php 안에있는 함수를 상황에 따라서 제어하여 커스터마이징 하기 위해서입니다. )

자식테마의 단점

부모테마의 템플릿을 수정하여 , 자식테마의 템플릿에서 사용하고 있는 동안, 해당 파일 내에 중요한 결함이 있던것을 테마 개발자가 수정하여 , 업데이트 한 경우… 자식테마에서는 어떤 부분이 수정되었는지 알수가 없습니다. 만약 보안에 관한 치명적 결함이 있다면 … 나만의 템플릿파일을 사용하는 동안은 무방비 상태가 되는거죠.

혹시 위와 같은 작업후에도 차일드 테마의 style.css 파일이 로드되지 않는다면…

보통 차일드테마의 스타일시트는 자동으로 로드됩니다.
그런데 위의 작업을 거쳤음에도 차일드 테마의 커스텀 스타일시트가 작동하지 않는 경우가 생긴다면 코드2의 내용을 아래와 같이 바꿉니다.
부모테마의 style.css가 문서에 입력된후 차일드테마의 style.css 파일을 문서에 입력하라는 명령문들입니다.

뭐 이런 식이 되겠지만….
어차피 나만 쓸건데… 아무려면 어떻겠습니까 .. ^^;;

| 2017-04-25T18:28:42+00:00 2015 5 31|Tags: |0 개의 댓글

글쓴이 :

WordPress WPBOX !

댓글 쓰기