워드프레스 차일드 테마 플러그인 Child Theme Configurator

워드프레스에서 테마를 편집해서 사용하려면 차일드 테마, 즉 자식 테마를 사용해야 하는 거 아시죠? 그런데 직접 수동으로 차일드 테마를 제작하기에 어려운 분들이 있죠. 그런 경우에는 워드프레스 차일드 테마 플러그인을 활용하면 손쉽게 자식 테마를 만들 수 있습니다.

워드프레스 차일드 테마 플러그인을 사용하는 이유

지난 포스팅 워드프레스 자식 테마 만들기에서 차일드 테마를 직접 만드는 방법에 대해서 알아보았습니다. 그런데 ftp나 sftp 등을 사용해서 직접 테마 파일들을 서버에 업로드하기 어려운 분들이 있습니다. 그런 경우에는 자식 테마 제작을 위해 사용하는 플러그인을 사용해서 문제를 해결하면 됩니다.

워드프레스 차일드 테마 플러그인 설치

Child Theme Configurator는 2023년 3월 20일 기준으로 30만개 이상의 사이트에 활성 설치가 돼 있다고 합니다. 아직 최신 버전의 워드프레스 6.1.1에서 테스트 하지는 않은 것으로 보이지만, 제가 이용해 봤을 때에는 별 문제가 없었습니다.

그림 1. 워드프레스 차일드 테마 플러그인 Child Theme Configurator 설치
그림 1. 워드프레스 차일드 테마 플러그인 Child Theme Configurator 설치

설치한 플러그인을 활성화 해 주면 사용할 준비가 다 된 겁니다.

워드프레스 자식 테마 만들기

좌측 메뉴에서 도구 > Child Themes로 들어가면 그림 2와 같은 화면을 만나게 됩니다. 새로운 자식 테마를 만들 것이므로 1번 Select an action에서 CREATE a new Child Theme을 선택하고 2번 Select a Parent Theme에서 자식 테마를 만들기 위한 부모 테마를 선택한 후, Analyze 버튼을 누릅니다.

그림 2. 새로운 자식 테마 만들기: 부모 테마 분석
그림 2. 새로운 자식 테마 만들기: 부모 테마 분석

그림 3과 같이 자식 테마를 만들 수 있다는 분석 결과가 확인되면, 아래에 추가적인 설정이 나타납니다.

그림 3. 자식 테마 생성 가능 분석결과
그림 3. 자식 테마 생성 가능 분석결과

4번 Name the new theme directory는 차일드테마를 관리할 디렉토리 이름을 설정하는 곳입니다. 기본적으로 알려주는 디렉토리를 사용하면 큰 문제가 없으므로 넘어갑니다. 별도의 디렉토리 이름을 지정하고 싶다면 변경해도 됩니다. 단, 기존에 이미 사용하는 테마 디렉토리와 중복되지 않게 설정하시기 바랍니다.

그림 4. 자식 테마 디렉토리 설정
그림 4. 자식 테마 디렉토리 설정

5번 Select where to save new styles에서는 새로운 스타일을 어디에 저장하여 관리할 것인지 물어봅니다. 주 스타일시트인 style.css를 이용할 것이라면 Primary Stylesheet (style.css)를 선택해 주면 됩니다. 만약 기본 스타일시트는 유지하고 별도의 스타일시트를 로드하는 방식으로 사용할 것이라면 Separate Stylesheet를 선택하면 됩니다. 여기에서는 일단 Primary Stylesheet (style.css)를 선택해 보겠습니다.

그림 4. 새로운 스타일 저장 위치
그림 4. 새로운 스타일 저장 위치

이제 다른 것들은 기본값으로 두고, 7번에서 테마의 이름과 테마의 주소, 저자 등의 정보를 원하는대로 입력해 주면 됩니다.

그림 5. 새로운 테마 정보 설정
그림 5. 새로운 테마 정보 설정

이제 마지막으로 9번에서 Create New Child Theme 버튼을 눌러주면 차일드 테마 GeneratePress Child 02가 생성됩니다.

그림 6. 새로운 워드프레스 자식 테마 만들기
그림 6. 새로운 워드프레스 자식 테마 만들기

이제 외모 > 테마 메뉴로 이동하면 아래 그림 7과 같이 새로 생성된 워드프레스 자식 테마를 확인할 수 있습니다. 활성화 하신 후 해당 자식 테마를 적절히 수정해서 사용하시면 되겠습니다.

그림 7. 새로 만들어진 자식 테마 GeneratePress Child 02
그림 7. 새로 만들어진 자식 테마 GeneratePress Child 02

관련 자료

워드프레스 플러그인 Child Theme Configurator 페이지Child Theme Configurator 홈페이지에서 플러그인에 대한 추가 정보를 확인할 수 있습니다.

같이 읽으면 좋은 글

Leave a Comment