WordPress 하위 테마에 대한 궁극적인 가이드

WordPress 생태계는 멋진 무료 및 프리미엄 테마로 가득 차 있지만, 모든 상자를 체크할 수 있는 완벽한 테마를 찾는 것은 매우 어렵습니다. 운 좋게도 WordPress에는 자식 테마라는 이 문제에 대한 솔루션이 있습니다. 그러니 걱정하지 마세요. 자식 테마를 사용하여 변경 사항을 적용하여 거의 완벽한 테마를 만들 수 있습니다.

WordPress 하위 테마는 약간의 사용자 정의 CSS 코드만큼 간단하거나 기존 상위 테마 템플릿을 덮어쓰고 추가 테마 기능을 수정하거나 추가할 수 있습니다. 이 기사에서 어린이 테마에 대해 알아야 할 모든 것을 설명할 것이므로 바로 가도록 하겠습니다.

어린이 테마란 무엇입니까?

자식 테마는 부모 테마라고 하는 다른 테마의 기능과 스타일을 상속하는 테마입니다. 자식 테마는 기존 테마를 수정하는 데 권장되는 방법입니다.

위의 공식 WordPress 정의는 훌륭하지만 이것이 의미하는 바를 더 자세히 살펴보겠습니다. 스타터(베어본) 하위 테마는 상위 테마와 모양과 기능이 완전히 동일합니다. 곧 시작 하위 테마를 만드는 방법을 보여 드리겠습니다. 하지만 지금은 시작 테마는 상위 테마의 모든 것을 상속하는 최소한의 하위 테마입니다. 그런 다음 하위 테마에 파일과 코드를 추가하면 상위 테마의 모양과 기능을 수정하거나 향상시켜 별도의 고유한 테마로 만들 수 있습니다.

자식 테마를 사용하면 좋은 점은 많고 실질적인 단점은 없으니, 왜 자식 테마를 사용해야 하는지 살펴보자.

왜 자식 테마를 사용해야 합니까?

더 나은 질문: 왜 자식 테마를 사용하지 않습니까? 나는 실제로 그것을 사용하지 않을 좋은 이유를 생각할 수 없지만, 자식 테마를 사용해야 하는 몇 가지 큰 이유를 알고 있습니다.

테마 업데이트 – 테마 코드를 직접 수정하고 나중에 해당 테마를 업데이트하면 이러한 모든 수정 사항이 손실됩니다. 이 이유만으로도 자식 테마를 사용하기 시작하기에 충분하다고 생각합니다. 테마 파일을 직접 편집한 다음 지원 티켓을 열어 테마 업데이트로 인해 작업이 중단되었다고 말하는 클라이언트가 몇 명 있었습니다. 어린이 테마를 사용했다면 모든 것이 괜찮을 것입니다. 테마 업데이트도 필요합니까? 네! 예: 테마 업데이트에 보안 수정 사항이 포함되어 있고 테마를 업데이트하지 않으면 WP 사이트가 해커의 잠재적 대상이 될 수 있습니다.

코드 구성 – 모든 변경 사항이 하위 테마 폴더에 배치되므로 어떤 변경 사항이 적용되었으며 어떻게 변경되었는지 명확하게 볼 수 있습니다. 나중에 변경해야 할 사항이 있는 경우 이러한 변경 사항을 어디에서 찾을 수 있는지 정확히 알 수 있으므로 많은 시간을 절약할 수 있습니다.

더 빠른 개발 – 하위 테마에서 상위 테마 스타일 및 기능을 확장하거나 재정의하는 것이 테마 업데이트로 덮어쓸 수 있는 수정된 테마 코드베이스를 유지 관리하는 것보다 훨씬 더 나은 옵션입니다. .

이전에 언급했듯이 하위 테마를 사용하지 않는 이유는 단 한 가지도 없으므로 가능한 한 빨리 초보자용 하위 테마를 설정하는 것이 좋습니다. 새 테마를 설치할 때 부모 테마를 사용자 지정할 즉각적인 계획이 없더라도 스타터 자식 테마도 만들고 대신 사용해야 합니다. 저를 믿으세요. 앞으로 몇 가지를 변경해야 할 때 하위 테마를 사용하고 있다는 사실에 기뻐할 것입니다.

참고로 WordPress 4.7은 사용자 정의 CSS 코드를 추가할 수 있는 사용자 정의 도구에 추가 CSS 편집기를 도입했습니다. 따라서 유일한 테마 수정이 약간의 사용자 정의 CSS 코드일 것이라고 확신한다면 하위 테마가 필요하지 않습니다. 추가 CSS 편집기를 사용하여 CSS 코드를 추가할 수 있습니다. 그러나 앞으로 테마를 추가로 변경하지 않을 것이라고 확신하십니까? 당신은?

초보자용 하위 테마를 만드는 방법은 무엇입니까?

이제 무엇을, 왜 그런지 알았으니 방법을 살펴보겠습니다. 이미 언급했듯이 초보자용 하위 테마는 매우 최소한의 하위 테마입니다. 상위 테마와 모양과 기능이 완전히 동일하지만 수정 및 개선을 위한 출발점이 됩니다.

이 예에서는 Adrenaline 상위 테마에 대한 초보 하위 테마를 만듭니다.

1. 폴더를 만들고 이름을 adrenaline-pt-child로 지정합니다. 가장 좋은 방법은 상위 테마 폴더 이름(adrenaline-pt)을 사용하고 그 끝에 '-child'를 추가하는 것이므로 어떤 테마가 하위 테마이고 어느 것이 상위 테마인지 명확하게 알 수 있습니다.
2. 하위 테마 폴더에 style.css 파일을 생성합니다. style.css 파일을 열고 이 코드를 붙여넣습니다(이 코드는 파일 상단에 있어야 함).
   

    /* Theme Name: Adrenaline Child Theme Theme URI: https://www.proteusthemes.com/wordpress-themes/adrenaline Description: Child theme for the Adrenaline theme Author: ProteusThemes Author URI: https://www.proteusthemes.com Template: adrenaline-pt Version: 1.0.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Tags: grid-layout, custom-background, custom-colors, custom-menu, featured-images, footer-widgets, full-width-template, microformats, sticky-post, theme-options, blog, e-commerce, entertainment, holiday Text Domain: adrenaline-pt-child */ /* Write your custom CSS code below */

3. 하위 테마 폴더에 functions.php 파일을 만듭니다. functions.php 파일을 열고 다음 코드를 붙여넣습니다.
   

    <?php add_action( 'wp_enqueue_scripts', 'enqueue_parent_theme_style' ); function enqueue_parent_theme_style() { wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' ); }

4. 선택적으로, 스크린샷.png(또는 .jpg)를 자식 테마 폴더에 추가할 수 있습니다. 그러면 모양 -> 테마 섹션에 미리보기 이미지로 표시됩니다(스크린샷 이미지는 1200x900픽셀 크기여야 함).

이것이 기본적인 초보자용 어린이 테마입니다. 설치하려면 이 폴더를 상위 테마 폴더 옆의 wp-content/themes/ 디렉토리에 배치해야 합니다. 또는 이 하위 테마 폴더에서 zip 파일을 만들고 Appearance -> Themes 의 WP 관리 대시보드를 통해 일반 WP 테마로 설치할 수도 있습니다.

위의 스니펫에서 코드를 설명하겠습니다.

style.css – "필수" 필드는 테마 이름 (자식 테마의 이름) 및 템플릿 (상위 테마의 폴더 이름)뿐입니다. 다른 필드는 선택 사항이며 자식 테마는 필드 없이 작동합니다. 그러나 이러한 메타 필드(테마 URI, 설명, 작성자, ...)는 "있으면 좋은" 것이며 WP admin -> 모양 -> 테마 에 표시되어 하위 테마를 보다 "완벽하게" 만듭니다.

functions.php – 자식 테마가 부모 테마와 같은 스타일을 가지려면 부모 테마 CSS 파일을 대기열에 넣어야 합니다. 권장되는 방법은 wp_enqueue_scripts 작업 후크를 사용하는 것입니다. 콜백 함수에서 wp_enqueue_style 함수를 사용하여 상위 테마 CSS 파일을 대기열에 넣습니다. 상위 테마가 여러 CSS 파일( style.css 뿐만 아니라)을 사용하는 경우 상위 테마 대기열에 넣는 기술에 따라 해당 파일도 대기열에 넣어야 할 수 있습니다.

Adrenaline 테마에서는 사용자 정의 WooCommerce CSS 파일도 사용하므로 하위 테마에서도 대기열에 넣는 것이 가장 좋습니다. 여기서 주의해야 합니다. wp_enqueue_style 함수의 핸들 매개변수 이름을 상위 테마와 동일하게 지정해야 하기 때문입니다(예: adrenaline-woocommerce ). 이렇게 하면 자식 테마 CSS 파일이 마지막에 대기열에 추가되고 문제 없이 모든 부모 테마 스타일을 덮어쓸 수 있습니다. 다음은 아드레날린 테마에 대한 업데이트된 functions.php 파일입니다.

 <?php add_action( 'wp_enqueue_scripts', 'enqueue_parent_theme_style' ); function enqueue_parent_theme_style() { wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' ); /** * Enqueue additional parent theme CSS files. * Watch out to name the "handle" parameter the same as it is named * in the parent theme, otherwise the file might be enqueued twice. * In this example the parent handle name for this CSS file was * "adrenaline-woocommerce" */ wp_enqueue_style( 'adrenaline-woocommerce', get_template_directory_uri() . '/woocommerce.css' ); }

이 시점에서 나는 부모 스타일을 자식 테마에 추가하는 예전 방식이 CSS @import 규칙을 사용했다는 것을 언급하고 싶습니다. style.css 의 @import 규칙을 사용하여 상위 테마 CSS 파일을 가져오는 하위 테마를 사용하는 경우 상위 테마 CSS 파일이 functions.php 의 대기열에 있는 위의 예제로 전환하는 것이 좋습니다. 파일을 제거하고 style.css 에서 @import 규칙을 제거합니다. @import 규칙의 문제는 wp_enqueue_scripts 후크를 통해 상위 CSS 파일을 대기열에 넣는 것보다 훨씬 느리다는 것입니다. 여기에서 이 문제에 대한 자세한 내용을 읽을 수 있습니다.

"자식 테마를 만들기 위한 플러그인이 있어야 합니다..."라고 생각할 수도 있습니다. 예, 있습니다. 이미 구성된 상위 테마에서 하위 테마로 전환 섹션에서 이 플러그인을 살펴보겠습니다.

상위 및 하위 테마 템플릿 파일은 어떻게 작동합니까?

하위 테마를 사용자 지정하는 방법에 대한 예제를 계속하기 전에 WordPress 템플릿 계층 구조가 작동하는 방식을 간단히 살펴보겠습니다.

WordPress는 템플릿 파일을 사용하여 웹사이트 방문자가 보는 실제 HTML 페이지를 만듭니다. 더 잘 알려진 WordPress 템플릿 파일은 다음과 같습니다. header.php , footer.php , index.php , single.php , page.php , … 예를 들어 블로그 페이지를 방문하면 index.php 템플릿 파일이 사용됩니다. 블로그 게시물 목록을 표시합니다. 일부 템플릿 파일은 모듈식이며 재사용할 수 있습니다. 예를 들어 header.php 는 일반적으로 모든 WordPress 페이지에서 사용됩니다.

일부 템플릿 파일은 다른 것보다 더 구체적이며 WordPress에서 더 높은 우선 순위로 간주됩니다. 예를 들어 테마에 singular.php 와 page.php 템플릿이 있고 방문자가 일반 WordPress 페이지를 보는 경우 page.php 템플릿이 페이지를 생성하는 데 사용됩니다. 이것은 page.php 템플릿 파일이 WordPress 템플릿 계층의 singular.php 템플릿보다 더 구체적이기 때문에 발생합니다. 테마에서 page.php 파일을 제거하면 singular.php 템플릿이 사용됩니다. 이 주제에 대해 더 자세히 설명하고 몇 가지 예가 있는 WordPress 템플릿 계층 문서를 살펴봐야 합니다.

확인해야 할 또 다른 리소스는 WordPress 템플릿 계층 구조의 대화형 시각화입니다.

따라서 방문한 페이지 유형에 따라 방문자가 보는 페이지를 생성하는 데 다른 템플릿 파일이 사용됩니다. 이것은 사이트를 사용자 정의하기 위해 하위 테마에서 변경하거나 추가해야 하는 템플릿 파일을 파악하는 데 도움이 되기 때문에 중요합니다.

WordPress는 템플릿 계층 구조에 따라 항상 찾을 수 있는 가장 관련성이 높은 템플릿 파일을 사용합니다. 자식 테마를 사용하는 경우 템플릿 파일이 자식 테마에 없으면 먼저 자식 테마에서 이러한 템플릿 파일을 찾은 다음 부모 테마로 대체합니다. 또한 하위 테마가 상위 테마보다 더 구체적인 템플릿 파일(WordPress 템플릿 계층 구조에서)을 사용하는 경우 해당 파일을 대신 사용합니다.

자녀 테마를 사용자 정의하는 방법?

아드레날린 하위 테마 예제를 계속 진행하여 사용자 정의하는 방법을 살펴보겠습니다. 다음 사용 사례를 다룹니다.

• 사용자 정의 스타일 추가 및 상위 스타일 덮어쓰기,
• 사용자 정의 기능 추가 및 상위 기능 덮어쓰기,
  • 새로운 기능 추가,
  • 상위 기능 덮어쓰기,
  • 새 템플릿 파일 추가,
  • 상위 템플릿 파일 덮어쓰기

사용자 정의 스타일 추가 및 상위 스타일 덮어쓰기

모든 사용자 정의 CSS 코드는 하위 테마의 style.css 파일에 추가되어야 합니다.

일부 텍스트에 대한 경고 스타일을 자식 테마에 추가하고 싶다고 가정해 보겠습니다. WordPress 페이지의 일부 텍스트와 함께 warning 클래스가 있는 div HTML 요소가 있으며 이 요소에 적절한 스타일을 추가하려고 합니다. 이 예제를 위해 작성한 사용자 정의 CSS 코드는 style.css 파일의 자식 테마 헤더 주석 아래에 있어야 합니다(항상 파일 맨 위에 있음). 사용자 정의 CSS 코드가 있는 style.css 파일은 다음과 같습니다.

 /* Theme Name: Adrenaline Child Theme Theme URI: https://www.proteusthemes.com/wordpress-themes/adrenaline Description: Child theme for the Adrenaline theme Author: ProteusThemes Author URI: https://www.proteusthemes.com Template: adrenaline-pt Version: 1.0.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Tags: grid-layout, custom-background, custom-colors, custom-menu, featured-images, footer-widgets, full-width-template, microformats, sticky-post, theme-options, blog, e-commerce, entertainment, holiday Text Domain: adrenaline-pt-child */ .warning { margin: 1rem 0; background-color: #fcf8e3; border-color: #faf2cc; color: #8a6d3b; padding: 0.75rem 1.25rem; border: 1px solid transparent; border-radius: 0.25rem; }

하위 테마에 사용자 정의 CSS 코드를 추가하는 것보다 더 중요한 것은 상위 테마 스타일을 덮어쓰는 것입니다. 상위 테마의 전체적인 모양이 마음에 들 수도 있지만 아이콘 색상과 같은 몇 가지 사항을 변경하고 싶을 수도 있습니다. 예를 들어 Adrenaline 홈 페이지 헤더의 장바구니 아이콘 색상을 덮어씁니다. 이 아이콘 색상은 기본 색상의 사용자 지정 설정에 따라 변경되지만 고유한 색상을 부여하고 싶다고 가정해 보겠습니다.

이 상위 테마 스타일을 덮어쓰려면 상위 테마에서 이 아이콘의 색상을 설정하는 CSS 선택기를 찾아야 합니다. Chrome 개발 도구로 CSS 선택기를 찾을 수 있습니다. 다음은 이를 수행하는 방법에 대한 간단한 비디오 자습서입니다. 올바른 CSS 선택기가 있으면 이 예제에서는 .header-info__link .fa 이며, 하위 테마의 style.css 파일에 코드를 배치해야 합니다. 이 덮어쓰기가 적용된 하위 테마 style.css 파일은 다음과 같습니다.

 /* Theme Name: Adrenaline Child Theme Theme URI: https://www.proteusthemes.com/wordpress-themes/adrenaline Description: Child theme for the Adrenaline theme Author: ProteusThemes Author URI: https://www.proteusthemes.com Template: adrenaline-pt Version: 1.0.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Tags: grid-layout, custom-background, custom-colors, custom-menu, featured-images, footer-widgets, full-width-template, microformats, sticky-post, theme-options, blog, e-commerce, entertainment, holiday Text Domain: adrenaline-pt-child */ .header-info__link .fa { color: #2ebd61; }

가장 어려운 부분은 대상에 맞는 올바른 CSS 선택기를 찾는 것입니다. 일단 완료되면 올바른 CSS 규칙을 적용하기만 하면 됩니다.

엄청난! 우리는 자식 테마에 몇 가지 사용자 정의 스타일을 적용했습니다. 하위 테마 style.css 파일에 사용자 정의 CSS 코드를 원하는 만큼 추가할 수 있습니다.

이제 하위 테마에 일부 기능을 추가하는 방법을 살펴보겠습니다.

사용자 지정 기능 추가 및 상위 기능 덮어쓰기

이것은 추가 기능으로 하위 테마를 개선하거나 변경하려는 상위 테마 기능을 덮어쓸 수 있는 흥미로운 부분입니다.

사용자 정의를 실현할 수 있는 방법에는 몇 가지가 있으므로 이를 살펴보겠습니다.

• 새로운 기능 추가,
• 상위 기능 덮어쓰기,
• 새 템플릿 파일 추가,
• 상위 템플릿 파일 덮어쓰기

새로운 기능 추가

자식 테마에 추가하려는 PHP 코드 형식의 모든 새로운 기능은 functions.php 파일에 넣어야 합니다. 많은 PHP 코드를 추가하는 경우 코드를 여러 PHP 파일로 추출한 다음 이러한 파일을 functions.php 파일에 요구하여 코드를 더 잘 구성해야 합니다.

예를 들어, 하위 테마에 단축 코드를 추가하는 경우 shortcodes.php 라는 파일을 만들고 해당 파일에 적절한 코드를 추가할 수 있습니다. 그런 다음 require_once get_stylesheet_directory() . '/shortcodes.php' 와 같이 functions.php 에 파일이 필요합니다. require_once get_stylesheet_directory() . '/shortcodes.php'

상위 기능 덮어쓰기

상위 테마 기능 중 일부를 수정해야 할 수도 있지만 상위 테마 코드를 직접 편집할 수 없으므로 어떻게든 하위 테마에서 이를 수행해야 합니다. 걱정하지 마세요. WordPress에는 이를 위한 시스템이 있습니다.

상위 기능을 수정하는 두 가지 방법이 있습니다. 첫 번째는 WordPress 작업 및 필터 후크 를 사용하는 것이고 두 번째는 플러그형 기능 을 사용하는 것입니다.

WordPress 작업 및 필터 후크 – 잘 코딩된 상위 테마를 사용하는 경우 테마 전체에 걸쳐 사용자 지정 WP 작업 및 필터를 찾을 수 있어야 합니다. do_action 및 apply_filters 함수에 대한 상위 테마를 검색해야 합니다. 예를 들어, Twenty twentyseventeen_front_page_sections 테마에서 이 사용자 정의 필터를 찾을 수 있습니다. 기본값은 4 입니다. 이 값은 이 테마의 첫 페이지에 정의된 섹션 수를 나타냅니다. Twenty Seventeen 하위 테마를 만들고 2개의 섹션만 갖고 싶다면 다음 코드를 하위 테마 functions.php 파일에 배치합니다.

 <?php add_action( 'wp_enqueue_scripts', 'enqueue_parent_theme_style' ); function enqueue_parent_theme_style() { wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' ); } // Custom Twenty Seventeen front page sections filter example. add_filter( 'twentyseventeen_front_page_sections', 'twentyseventeen_child_front_page_sections' ); function twentyseventeen_child_front_page_sections() { return 2; }

플러그형 기능 – 플러그형 기능이란 무엇입니까? 그것들은 일반적인 PHP 함수이지만 이 이름을 가진 함수가 이미 존재하는지 확인하기 위해 if 문으로 래핑됩니다. 그들은 다음과 같이 보입니다.

 <?php if ( ! function_exists( 'some_function_name' ) ) { function some_function_name() { // Function code goes here. } }

테마가 이러한 플러그형 기능을 사용하는 경우 하위 function.php 파일에서 동일한 이름과 변경된 코드로 함수를 정의하여 하위 테마에서 해당 코드를 덮어쓸 수 있습니다. 워드프레스 부트스트랩 프로세스에서 자식 테마 functions.php 파일은 부모 테마 functions.php 파일보다 먼저 로드되기 때문에 이 플러그인 가능한 기능 방법이 가능합니다. 또한 상위 테마 함수가 플러그 가능하지 않은 경우 동일한 이름을 가진 두 함수가 심각한 PHP 오류를 발생시키므로 덮어쓸 수 없습니다.

플러그인 기능은 초기에 WordPress 코어에서 사용되었으며 필터로 대체되었습니다.

새 템플릿 파일 추가

상위 테마에 없는 새 WordPress 템플릿 파일을 하위 테마에 추가하는 것은 쉽습니다. 템플릿 파일을 자식 테마의 루트에 배치하기만 하면 됩니다.

예를 들어, 상위 테마에 특정 카테고리의 게시물 표시를 담당하는 category.php 템플릿 파일이 없는 경우, category.php 템플릿 파일을 하위 테마 폴더의 루트( functions.php ). WordPress는 이제 이 category.php 파일을 사용하여 카테고리 페이지를 표시합니다.

하위 테마에 보다 구체적인 템플릿 파일을 추가하여 해당 페이지의 더 작은 부분을 차지할 수도 있습니다.

예를 들어 상위 테마에 작성자, 카테고리, 분류, 날짜 및 태그 페이지를 표시하기 위한 상위 템플릿 파일인 archive.php 템플릿이 있지만 보다 구체적인 템플릿인 author.php 템플릿은 없는 경우 WordPress 템플릿 계층 구조를 사용하면 이 author.php 템플릿을 자식 테마에 추가하고 작성자 페이지의 레이아웃을 변경할 수 있습니다. 이렇게 하면 카테고리, 분류, 날짜 및 태그 페이지의 레이아웃과 표시를 그대로 두고 작성자 페이지만 변경할 수 있습니다.

상위 템플릿 파일 덮어쓰기

상위 테마 기능 덮어쓰기의 마지막이자 아마도 가장 일반적인 용도는 상위 테마 템플릿 파일을 덮어쓰는 것입니다.

이전에 만든 Adrenaline 자식 테마의 페이지 템플릿에서 무언가를 변경하려면 부모 테마에서 page.php 파일을 자식 테마 폴더로 복사하고 원하는 대로 변경해야 합니다.

단일 게시물에 표시되는 작성자와 날짜를 변경하려면 single.php 파일을 하위 테마로 복사하고 해당 파일에서 변경합니다.

상위 테마 템플릿을 덮어쓰는 것은 기존 상위 테마 템플릿 파일을 약간 수정하여 원하는 모든 것을 변경할 수 있지만 상위 테마를 그대로 유지하고 업데이트를 안전하게 유지하기 때문에 매우 강력합니다.

이미 구성된 상위 테마에서 하위 테마로 전환

하위 테마가 없는 기존 WordPress 사이트가 있고 하위 테마 사용을 시작하려는 경우 몇 가지 주의할 사항이 있습니다.

플러그인을 사용하여 자동으로 자식 테마를 만들거나 수동으로 만들 수 있습니다. 지금 당장은 아마도 "예, 플러그인입니다! 자동으로 할 수 있다면 누가 수동으로 무엇이든 하고 싶겠습니까?” 글쎄, 당신은 틀리지 않았지만 자식 테마에 대해 더 알고 싶기 때문에 먼저 수동 단계를 살펴볼 것입니다.

하위 테마로 수동 전환

먼저 상위 테마의 하위 테마를 만들고 상위 테마의 코드에서 직접 수정하거나 추가한 내용을 하위 테마로 추출합니다. 이렇게 하면 상위 테마가 업데이트에 안전하고 사용자 정의 코드가 하위 테마에 깔끔하게 정리됩니다.

이제 하위 테마를 활성화한 후 첫 페이지를 보면 일부 항목이 이상하거나 깨져 보일 수 있습니다. 이 혼란의 원인은 WordPress가 하위 테마를 새로운 별도의 테마로 보고 모든 테마 설정이 기본값으로 재설정되기 때문입니다. 그 결과 위젯이 사이드바 위치를 전환하고(바닥글 사이드바의 위젯이 헤더 섹션 등으로 끝날 수 있음) 사용자 정의 설정이 테마 기본값으로 재설정됩니다.

위젯 – 위젯 문제를 해결하려면 모양 -> 위젯 으로 이동하여 올바른 사이드바에서 위젯의 위치를 ​​조정(끌어서 놓기)하십시오.

사용자 지정 설정 – 상위 테마에서 이미 설정한 사용자 지정 설정을 마이그레이션하는 쉬운 방법이 있습니다. 사용자 지정 프로그램 내보내기/가져오기 플러그인은 사용하기 매우 쉽고 상위 테마 사용자 지정 프로그램 설정을 가져오므로 수동으로 설정할 필요가 없습니다. 다음 지침에 따라 사용자 지정 설정을 하위 테마로 마이그레이션합니다.

테마가 다른 테마 옵션 프레임워크를 사용하는 경우 해당 프레임워크도 다시 구성해야 할 수 있습니다.

이러한 작업을 수행하면 하위 테마가 상위 테마와 동일하게 표시되지만 추가 수정 및 정기적인 상위 테마 업데이트를 위한 준비가 된 것입니다.

이제 문제가 무엇인지 이해했으므로 하위 테마로 전환할 때 문제를 해결하는 방법과 플러그인을 사용하여 더 쉽게 하위 테마로 전환하는 방법을 살펴보겠습니다.

하위 테마로 자동 전환(플러그인 사용)

자식 테마로 전환하기 위해 몇 가지 작업을 수행해야 하므로 "자동"이라는 단어가 너무 많을 수 있지만 수동으로 수행하는 것보다 훨씬 쉽고 빠릅니다.

내가 테스트한 최고의 하위 테마 생성기 플러그인은 하위 테마 구성기 플러그인입니다. 이를 통해 하위 테마를 만들고 상위 테마의 모든 테마 설정을 한 번에 마이그레이션할 수 있습니다. 굉장해!

다음은 이 플러그인을 사용하여 하위 테마로 전환하는 방법에 대한 빠른 자습서입니다.

1. WP 사이트에 Child Theme Configurator 플러그인을 설치하고 활성화합니다.
2. 도구 -> 하위 테마 로 이동합니다.
3. 첫 번째 단계에서 "새 하위 테마 만들기" 옵션을 선택하고 올바른 상위 테마를 선택했는지 확인한 다음 분석 버튼을 클릭합니다.
4. 플러그인이 분석을 마친 후에는 상위 테마에 따라 표시되는 모든 추가 옵션을 보고 조정할 수 있지만 기본 설정은 일반적으로 괜찮습니다.
5. 하위 테마 속성 표시/숨기기 버튼을 클릭하고 하위 테마 이름 및 기타 메타데이터를 변경할 수 있습니다.
6. 상위 테마에서 하위 테마로 메뉴, 위젯 및 기타 사용자 정의 설정 복사 옵션에서 확인란을 활성화해야 위젯 및 사용자 정의 설정이 기존 상위 테마에서 새로 생성된 하위 테마로 마이그레이션됩니다.
7. 새 하위 테마 만들기 버튼을 클릭합니다.

그게 다야!

이 플러그인의 하위 테마 생성 및 예제에 대한 전체 자습서를 보려면 하위 테마 구성기 플러그인 페이지에 게시된 비디오를 보는 것이 좋습니다.

Adrenaline 테마에서 이 플러그인을 테스트했는데 훌륭하게 작동했습니다. 하위 테마가 성공적으로 생성되었고 위젯 및 사용자 지정 설정도 마이그레이션되었으므로 이 플러그인을 적극 권장합니다.

요약

하위 테마는 WordPress 테마를 수정하는 데 권장되는 방법입니다. 이를 통해 사용자는 약간 또는 크게 수정하여 자신의 테마를 만들 수 있지만 동시에 상위 테마는 그대로 둡니다.

우리는 하위 테마가 제공해야 하는 모든 것을 살펴보았고, 내가 무언가를 공개하지 않았다고 생각한다면 아래의 의견 섹션에서 이를 공유해 주시면 이 가이드에 추가하겠습니다.

기본적으로 단점이 없고 이점만 있기 때문에 향후 모든 WordPress 프로젝트에 하위 테마를 사용하기를 바랍니다. 다른 것이 없다면 상위 테마는 정기적인 업데이트를 받을 수 있습니다.