워드프레스를 사용하면서 테마를 수정할일이 있는데.. 테마파일 자체를 수정해놓고 쓰다보면 나중에 테마를 업데이트 하거나 하면 수정사항을 엎어써버린다.
그렇다고 업데이트를 안하자니 그렇고.. 또 일일이 수정사항을 기억해놨다가 업데이트 할때마다 일일이 적용시켜주기도 그렇고..
이런부분을 보완하고자.. 워드프레스에서는 자식테마(차일드테마, child theme)를 제공한다.
차일드테마를 사용하면 기존 원테마를 건드릴 필요 없이 필요한 부분만 수정해서 사용할 수 있으므로 안정성, 편의성이 높아진다.
마치.. 객체지향 프로그래밍에서.. 부모 객체를 상속받아 자식객체에서 필요한 부분만 구현하는 개념이랑 비슷하달까..??
https://codex.wordpress.org/ko:Child_Themes
자세한 사항은 위 문서를 참고하시고.. 여기엔 간략하게만 적어놓는다.
(물론.. 내가 나중에 찾아보려고.. ^^;;;)
먼저 간단히 순서를 설명하면 다음과 같다.
- 테마디렉토리에 차일드테마용 디렉토리를 생성한다.(이름은 아무거나 상관 없음)
- 필요한 파일을 생성한다.(필수1, 옵션3)
- 끝..??
차근차근 설명해보자.
우선 워드프레스의 테마디렉토리 밑에 차일드테마 디렉토리를 생성한다.
보통 워드프레스 테마는 WP설치위치/wp-content/themes 에 위치한다.
# cd ~/public_html/wp/wp-content/themes # ls ./ index.php twentynineteen/ twentysixteen/ ../ twentyfifteen/ twentyseventeen/ # mkdir twentyseventeen-child (이름은 아무거나 상관없다.) # ls ./ index.php twentynineteen/ twentyseventeen-child/ ../ twentyfifteen/ twentyseventeen/ twentysixteen/
위의 예에서.. 나는 twentyseventeen 테마를 가져다 쓸것이므로 디렉토리 이름을 twentyseventeen-child 라고 지었다.
차일드 테마에는 아래와 같이 4개의 파일이 있을 수 있다.
- style.css (필수)
- functions.php (옵션)
- Template files (옵션)
- Other files (옵션)
나는 주로 functions.php 를 수정할 것이므로, style.css와 functions.php 두개만 생성할 것이다.
style.css 는 반드시 필요하며. 아래와 같은 해더정보가 필요하다. (위의 링크 https://codex.wordpress.org/ko:Child_Themes 에 있던 샘플이다.)
/* Theme Name: Twenty Eleven Child Theme URI: http: //example.com/ Description: Child theme for the Twenty Eleven theme Author: Your name here Author URI: http: //example.com/about/ Template: twentyeleven Version: 0.1.0 */
아.. 글이 길어지고 있다. 그냥 간략하게 필수적인것만 적기로 해야겠다. (어차피 내가 필요해서.. 내가 나중에 보려고 적는 글이니까..)
위의 style.css 헤더에서 꼭 필요한 부분은 2가지이다.
- Theme Name : child 테마의 이름
- Template : Parent테마의 디렉토리 ( 대소문자 구분)
그리고 놓치지 말아야할게..
style.css 는 기존 부모테마의 style.css 를 대체한다. 따라서 style.css에 필요한 모든 내용을 적어줘야 하는데.. 귀찮으니 그냥 부모 style.css 내용을 몽창 끌어(import)오자.
따라서.. 간단한 style.css는 다음과 같다.
/*
Theme Name: Twenty Seventeen Child
Template: twentyseventeen
*/
@import url("../twentyseventeen/style.css");
위와 같이 기본 형태를 꾸며놓고.. 필요한 경우 style을 추가로 지정해주면 된다.
functions.php는 부모 테마의 functions.php를 덮어쓰지 않고, 추가로 함께 로드된다. 따라서 필요한 내용만 추가로 적어주면 된다.
나같은 경우는 메인페이지에 특정 카테고리 글을 제외하고 불러오는 것과, <head></head>테그에 특정 스크립트(구글 광고..)를 넣는 내용을 추가했다.
# cat ~/public_html/wp/wp-content/themes/twentyseventeen-child/functions.php
<?php
/**
* 메인페이지에 특정카테고리 제외
*/
function exclude_category( $query ) {
if ( $query->is_home() && $query->is_main_query() ) {
$query->set( 'cat', '-4' );
}
}
add_action( 'pre_get_posts', 'exclude_category' );
/**
* Head Tag 에 구글 애드샌스 추가
*/
function child_theme_head_script() {
?>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script>
(adsbygoogle = window.adsbygoogle || []).push({
google_ad_client: "ca-pub-xxxxxxxxxxxxxxxxxx",
enable_page_level_ads: true
});
</script>
<?php
}
add_action( 'wp_head', 'child_theme_head_script' );
#
위 functions.php 에 실린 코드는 나중에 간단하게나마 따로 포스팅 할 예정이다. 했다.
[wordpress] 워드프레스 첫 화면에 특정카테고리 안나오게 하기(혹은 특정카테고리만 나오게 하기)
[wordpress] 워드프레스 사이트에서 <head> 태그에 내용 추가하기
그 외.. 나머지 옵션으로 필요한 것들 (Template feils, Other files)은 위 초반에 있는 링크에서 확인하시라..(지금의 나에겐 필요없어서.. 내 관심사 밖이다.)
참 불친절한 글이긴 하지만.. 여튼.. 참고하시면 대충 어떻게 돌아가는지는 알 수 있을 듯 하다.
