워드프레스 테마, 플러그인 업데이트 겁내지 말자! 차일드 테마(wordpress child theme) 만들기

angdry-

히빈드라이 웹사이트는 워드프레스라는 메인 플랫폼에 테마와 각종 플러그인을 이용해 제작되었습니다.
테마, 일부 플러그인등은 html과 css 그리고 php등을 수정하여 사용하고 있습니다.
히빈드라이의 아이덴티티를 위해 적절한 디자인 퀄리티를 구현하기 위함입니다.

히빈드라이가 사용중인 테마와 플러그인등이 배포자가 모두 달라 디자인 톤앤매너가 모두 다르기 때문에 서로 맞춰주는 작업이 필요한것이죠.
사용중인 플러그인이 10여종이 훌쩍 넘어가므로 꽤 고달픈 시간이었습니다.
특히 업데이트가 빈번한 플러그인들은 돔 구조가 달라지거나 css class가 달라져 처음부터 다시 해야 했죠.

그래도 진득히 진도를 뺄 수 있었던 주요한 원인은 제가 child-theme를 만들어 유지했기 때문입니다.

child-theme(차일드테마)는 원본 소스를 유지한채 제가 수정한 소스가 뒤에 로딩되어 새로운 스타일이 적용될 수 있도록 돕습니다.
즉, 테마나 플러그인이 새롭게 업데이트 되어 원본소스가 변경되는 일이 있더라도 차일드 테마를 작업을 해두면 제가 작업한 디자인이나 기능들이
덮어씌어지는 일이 발생하지 않는다는 이야기입니다.
테마의 h1 스타일이 font-size: 20px 인데 내가 차일드 테마에서 font-size: 30px로 수정하여 변경 해두었다면 테마가 아무리 업데이트 되어 h1 스타일이 변경되더라도 내가 설정해둔 30px이 유지된다는 뜻입니다.

워드프레스를 이용하여 웹사이트를 운영하려면 필수라는 의미이죠.

자 그럼 차일드 테마를 어떻게 만드는지 알아보겠습니다.
우선 사용중인 테마에 종속되는 차일드테마라는것을 인식시켜주기 위해 폴더를 정해진 규칙에 맞게 생성합니다.
저는 jupiter테마를 사용중이므로 같은 레벨에 jupiter-child라는 폴더를 만듭니다.

그리고 만들어야 할 필수 파일은 style.css입니다.
functions.php와 그 외 템플릿 파일은 옵션입니다.
우커머스의 통화 기호를 원으로 수정하고 우커머스 업데이트에 관계 없이 계속 유지되는것을 원하신다면 functions.php파일 또한 만드시는것이 좋습니다.
style.css는 새롭게 만든 테마명-child 폴더 하위에 만들어주고 가장 윗 줄에 아래의 코드를 적어줍니다.

/*
Theme Name: Heebeandry theme
Theme URI: http: //heebeandry.com/
Description: Child theme for heebeandry
Author: HEEBEANDRY
Author URI: http: //heebeandry.com
Template: jupiter
Version: 1.0
*/

Theme Name 과 Template은 필수로 적어주셔야 합니다.
나머지는 본인의 입맛에 맞게 변경하여 사용하시면 되는데, Template에는 꼭 부모 테마명을 적어주셔야 합니다.
css의 가장 윗 줄 부분을 위 코드를 적어 사용하시면 아래의 이미지처럼 사용되어집니다.

그리고 만들 파일은 functions.php입니다.
앞서 말씀드린것 처럼 우커머스의 통화 기호를 원 으로 고정시킨다거나, 마이페이지나 체크아웃(결제페이지) 그리고 회원가입 페이지등에 성과 이름 필드를 하나로 합쳐 관리하려면 필수로 만드셔야 할 파일입니다.

functions.php의 특이한 점은 앞서 설명한 style.css처럼 덮어쓰기를 하진 않는다는 점입니다.
기존의 테마 functions나 플러그인, 워드프레스의 functions와 함께 로딩됩니다.
그리고 필수 파일이 아니므로 별도의 양식은 필요 없으며, <?php  ?>만 만들어 작업하시면 됩니다.

그 외에 파일들은 테마를 수정할 때 복사해서 사용하게 됩니다.
원본 테마의 파일을 그대로 복사하여 차일드테마 폴더 하위에 같은 위치로 붙여넣어 수정해 사용합니다.
차일드테마에 원본테마와 같은 파일이 존재하면 원본테마의 파일보다 차일드테마의 파일을 우선하여 로드하게 됩니다.

이는 우커머스의 템플릿 파일 또한 같은 방식으로 취급됩니다.
my-account 내용을 대폭 수정해야 한다면 차일드 테마를 이용하여 작업하게 됩니다.
저는 아래의 이미지처럼 차일드테마 파일을 생성 및 복사하여 관리중입니다.

위 이미지처럼 테마명-child 하위에 파일이 존재한다면, 해당 파일을 이용한 기능이나 페이지는 커스텀 했다는 의미로 보아도 무방합니다.
차일드 폴더 하위에 파일이 있다면 원본 파일은 무시하게 되는데, 쓸데없이 차일드 폴더에 복사해 넣어둔다면 테마나 플러그인이 아무리 업데이트 되어도 해당 내용을 반영하지 않기때문입니다.
즉, 차일드 폴더 내 파일은 주기적으로 관리가 필요합니다.

물론 향후 업데이트가 예정되지 않거나 앞으로 쭈욱 업데이트를 하지 않을 생각이라면 큰 문제는 없겠습니다만, 그러려면 워드프레스의 장점이 없어지는것과 마찬가지겠죠.
차일드테마 만드는 방법은 여기까지입니다.
아마 다음 게시물은 우커머스 my account 풀 커스텀 편이 될 것 같습니다.
성과 이름 필드를 합쳐 사용하는것과 다운로드 필드 삭제하기, 레프트메뉴 추가해서 사용하기등이 포함될 예정입니다.

그럼 다음시간이 뵙겠습니다.
감사합니다.

본 게시물은 아래의 웹사이트를 참조하여 작성하였습니다.
https://codex.wordpress.org/

Leave a Comment

0

Start typing and press Enter to search

구버전 웹 브라우저를 사용하고 계시는군요.

히빈드라이 웹사이트는 보안을 위해 구버전 웹브라우저의 지원을 중단합니다.
구버전 웹브라우저 사용으로 인한 불이익을 보장하지 않습니다.웹브라우저 업데이트하기

×