[워드프레스] 차일드 테마란? 만들어야 할까요? 그럼 어떻게?

워드프레스 CMS를 사용하면 테마는 필수로 사용하게 됩니다. 워드프레스 차일드 테마는 운영하는 워드프레스 사이트에서 필수 요소인지 먼저 생각해 볼 필요가 있습니다.

1. 차일드 테마란?

차일드 테마(Child Theme)는 워드프레스 프레임워크의 주요 기능 중 하나입니다. 사용 중인 테마 파일의 수정(커스터마이징)이 필요할 때 원본 테마(부모 테마) 대신 수정할 수 있게 만들어진 기능입니다. Child Theme는 기본 테마 업데이트가 되어도 Child Theme 폴더 내에서 설정한 CSS 및 PHP 파일 등이 그대로 유지되는 장점이 있습니다.

기본 테마가 업데이트 되었을 경우 따로 Child Theme에서 설정한 부분이 적용되지 않을 수 있습니다. 심한 경우 사이트가 깨질 수 있는 단점을 가지고 있습니다. 2022년 정도 시점을 기준으로 워드프레스 테마는 하위 테마가 필요하지 않은 경우가 많습니다. 사용자 지정 필터나 워드프레스 후크를 지원하는 테마가 많기 때문입니다. Child Theme는 실제론 개발자에게 해당되는 항목일 수 있습니다. 개발자에게 해당하는 항목은 두 가지 상황을 생각할 수 있습니다.

수행해야 하는 고급 테마 변경이 있으며 사용자 지정 프로그램을 통하거나 코드 스니펫을 추가하는 방법으로는 불가능합니다. 즉, 특정 부모 테마 파일을 자식 테마로 복사하고 편집하여 재정의하려는 경우입니다.
WooCommerce와 같은 플러그인을 세부적으로 사용자 지정하려면 플러그인 파일을 재정의해야 하며 이는 기술적으로 사용자 지정 플러그인을 사용하여 수행할 수 있지만 가장 일반적인 방법은 자식 테마를 사용하는 것입니다.

Child Theme 설치가 필요하다면 아래와 같은 방법으로 진행할 수 있습니다.

2. 워드프레스 차일드 테마(Child Theme) 설치 방법

2.1 신규 디렉토리 생성

SSH 또는 FTP와 같은 프로그램을 이용해서 ‘wp-content/theme’ 폴더에 새 폴더를 생성합니다. 부모 테마(원본)와 자식 테마는 동일한 ‘theme’ 폴더 내에 있습니다.

부모 테마가 제너레이트프레스(generatepress)라면 디렉토리 명은 ‘generatepress’이며 이름은 상관 없지만 보통 ‘generatepress_child’로 디렉토리를 생성합니다.

2.2 ‘style.css‘ 파일 생성

‘generatepress_child’ 폴더 ”style.css‘ 파일을 생성합니다.

/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Template:     generatepress
 Author: generatepress WP
 Author URI: https://www.generatepress.com
 Description:  Default GeneratePress child theme

 Version:      0.1
License: GNU General Public License v3.0 (or later)
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: generatepress_child
*/

Theme Name: 원하는 이름을 입력하면 됩니다.
Template: 부모 테마 폴더 명을 입력합니다.

Theme Name 및 Template는 필수 값이며 나머지는 추가 옵션입니다.

2.3 ‘functions.php‘ 파일 생성

생성한 ‘functions.php‘ 파일에 아래 코드를 입력합니다.

function wptalk_enqueue_styles() {
    $parent_style = 'parent-style';
    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style',
    get_stylesheet_directory_uri() . '/style.css',
    array( $parent_style ),
        wp_get_theme()->get('Version')
    );
}
add_action( 'wp_enqueue_scripts', 'wptalk_enqueue_styles' );