从零开始：掌握 WordPress 主题基础知识
WordPress 테마 개발을 이해하려면 먼저 그 핵심 구성 요소를 명확히 알아야 합니다. WordPress 테마는 본질적으로 일련의 파일들로 구성되어 있으며, 이 파일들이 웹사이트의 외관과 기능을 결정합니다. 여기에는 스타일시트, 템플릿 파일, 함수 스크립트, 이미지와 같은 리소스들이 포함됩니다. 테마의 핵심 파일은… style.css 그리고 index.php전자는 주제의 “신분증” 역할을 하며 스타일을 정의하는 파일이고, 후자는 기본적으로 사용되는 템플릿 파일입니다.
Subject Information Header File
각 주제의 루트 디렉터리에는 반드시 하나가 포함되어야 합니다. style.css 이 파일의 헤더에는 WordPress에 테마의 기본 정보를 알리는 특별한 주석이 포함되어 있습니다. 이 정보 헤더는 WordPress가 테마를 인식하고 활성화하는 데 필수적입니다.
/*
Theme Name: 我的第一个主题
Theme URI: https://example.com/my-first-theme
Author: 开发者名称
Author URI: https://example.com
Description: 这是一个用于学习 WordPress 主题开发的简单主题。
Version: 1.0.0
License: GNU General Public License v2 or later
Text Domain: my-first-theme
*/그중에서,Text Domain 국제화를 위해 사용되며, 이후에 번역 파일을 로드하는 데 필수적인 식별자입니다.
추천 읽기 WordPress 테마 개발 입문: 제로에서 시작하여 맞춤형 웹사이트를 구축하는 방법。
핵심 템플릿 파일의 역할
또한… style.css주제에는 반드시 하나 이상의 PHP 템플릿 파일이 포함되어야 합니다. 가장 기본적인 형태는… index.php이 템플릿은 모든 페이지의 기본적인 구조를 제공하는 백업 템플릿입니다. WordPress가 더 구체적인 템플릿 파일을 찾을 수 없을 때 이 템플릿이 사용됩니다. 다른 중요한 템플릿 파일로는 개별 글을 표시하는 데 사용되는 템플릿들이 있습니다. single.php기사 목록을 표시하는 데 사용됩니다. archive.php페이지를 표시하는 데 사용되는 page.php 그리고 웹사이트의 상단과 하단 부분을 정의하는 내용도 포함되어 있습니다. header.php 그리고 footer.php。
주제를 구성하는 핵심 템플릿의 계층 구조
WordPress는 템플릿 계층 시스템을 사용하여 현재 요청된 페이지에 어떤 템플릿 파일을 사용할지 결정합니다. 이 시스템은 특별한 경우부터 일반적인 경우까지 순서대로 작동하므로, 개발자는 다양한 유형의 페이지에 맞게 매우 세밀하게 맞춤화된 디자인을 구현할 수 있습니다.
템플릿 로딩 순서 이해
사용자가 블로그 글을 조회할 때, WordPress는 다음 템플릿 파일들을 순서대로 찾습니다:single-{post-type}-{slug}.php、single-{post-type}.php、single.php마지막으로는… singular.php 그리고 index.php예를 들어, “about”이라는 제목의 페이지(post-type이 page인 경우)에 대해 WordPress는 먼저 해당 페이지를 찾습니다. page-about.php그런 다음 찾아보세요. page.php마지막에 사용합니다. index.php。
자주 사용하는 템플릿 파일을 만드세요.
기능이 완전한 테마는 일반적으로 다음과 같은 기본 템플릿 파일들을 포함합니다:
- header.php문서 유형 선언을 포함하고 있습니다.<head> 지역 및 웹사이트의 시작 부분(예: 네비게이션 메뉴)은 다른 템플릿에서도 사용할 수 있습니다. get_header() 함수 소개.
- footer.php웹사이트의 마지막 부분(예: 저작권 정보)을 포함합니다. 사용하려면… get_footer() 함수 소개.
- index.php메인 템플릿은 모든 페이지의 최종 백업 역할을 합니다.
- page.php정적 페이지를 표시하는 데 사용됩니다.
- single.php단일 기사를 표시하는 데 사용됩니다.
- archive.php아카이브 페이지에 분류, 태그, 작성자, 날짜 등의 정보를 표시하는 데 사용됩니다.
이러한 부분들을 분리함으로써 코드의 재사용성과 유지보수성을 크게 향상시킬 수 있습니다. 메인 루프 템플릿에서는 일반적으로 다음과 같은 구조를 사용합니다:
추천 읽기 WordPress 테마 개발 입문 실전 가이드: 제로에서 시작하여 사용자 정의 테마 아키텍처와 템플릿을 만들어보기。
<?php
if ( have_posts() ) :
while ( have_posts() ) : the_post();
// 显示文章内容
the_title( '<h2>', '</h2>' );
the_content();
endwhile;
else :
// 如果没有文章
echo '<p>暂无内容。</p>';
endif;
?>함수와 훅을 활용하여 테마 기능을 향상시키기
우수한 테마는 아름다운 인터페이스뿐만 아니라 강력한 확장성도 갖추어야 합니다. 이는 주로 WordPress의 두 가지 핵심 기능인 함수(functions)와 훅(hooks)을 통해 실현됩니다. 메인 파일(main file) functions.php 이곳이 바로 이러한 기능들을 추가하는 주요 장소입니다.
Theme Function File
functions.php 파일은 테마가 초기화될 때 자동으로 로드되며, 테마의 기능을 정의하고 메뉴와 사이드바를 등록하며 다양한 필터와 액션을 추가하는 데 사용됩니다. 이 파일은 테마의 “뇌”와 같아서 테마의 동작 논리를 제어합니다.
예를 들어, 네비게이션 메뉴를 등록하고 기사의 썸네일 기능을 활성화하는 코드는 다음과 같습니다:
<?php
function my_theme_setup() {
// 注册一个导航菜单位置
register_nav_menus( array(
'primary' => __( '主导航菜单', 'my-first-theme' ),
) );
// 启用文章特色图像支持
add_theme_support( 'post-thumbnails' );
}
add_action( 'after_setup_theme', 'my_theme_setup' );
?>여기에 액션 훅(Action Hook)이 사용되었습니다. after_setup_theme이 기능을 통해 우리는 주제(테마)의 기본 설정이 완료된 후에 자신만의 함수를 실행할 수 있습니다. my_theme_setup。
동작과 필터를 이해하기
후크(Hook)에는 두 가지 종류가 있습니다: 액션(Action)과 필터(Filter)입니다. 액션을 사용하면 특정 시점에 자신의 코드를 삽입하여 실행할 수 있습니다. 예를 들어, 글의 내용 뒤에 무언가를 출력하는 데 사용할 수 있습니다. 필터는 WordPress가 실행되는 동안 생성되는 데이터를 수정하는 데 사용할 수 있습니다.
예를 들어, 필터를 사용하여 요약 텍스트의 길이를 수정할 수 있습니다:
추천 읽기 워드프레스 테마 개발 가이드: 전문 테마를 처음부터 만들기。
<?php
function my_excerpt_length( $length ) {
return 20; // 将摘要长度改为20个单词
}
add_filter( 'excerpt_length', 'my_excerpt_length' );
?>그리고 글의 마지막에 저작권 정보를 추가하기 위해 다음과 같은 액션을 사용하세요:
<?php
function my_post_footer( $content ) {
if ( is_single() ) {
$content .= '<p class="copyright">本文版权归本站所有。</p>';
}
return $content;
}
add_filter( 'the_content', 'my_post_footer' );
?>반응형 디자인과 테마 커스터마이징을 구현하기
현대적인 WordPress 테마는 반응형 디자인을 갖추어야 하며, 사용자가 쉽게 커스터마이징할 수 있는 옵션을 제공해야 합니다. 이를 위해서는 CSS 기술과 WordPress의 커스텀 API를 결합하여 작업해야 합니다.
응답형 CSS를 적용하여 웹사이트가 다양한 화면 크기와 장치에 맞게 자동으로 조정되도록 합니다.
반응형 디자인은 일반적으로 CSS 미디어 쿼리를 통해 구현됩니다. style.css 여기서는 다양한 화면 너비에 맞게 스타일을 정의할 수 있습니다.
/* 基础样式 */
.container {
width: 100%;
padding: 20px;
}
/* 平板设备（宽度大于768px） */
@media (min-width: 768px) {
.container {
width: 750px;
margin: 0 auto;
}
}
/* 桌面设备（宽度大于992px） */
@media (min-width: 992px) {
.container {
width: 970px;
}
}커스터마이저 설정 통합 (Integration of Customizer Settings)
워드프레스 사용자 정의 기능을 통해 사용자는 테마 설정을 실시간으로 미리 보고 수정할 수 있습니다. 이는 functions.php주제에 다양한 옵션을 추가할 수 있습니다. 예를 들어, 로고 업로드, 색상 선택 등이 가능합니다.
다음은 페이지 하단에 저작권 정보를 추가하는 옵션의 예시입니다:
<?php
function my_theme_customize_register( $wp_customize ) {
// 添加一个设置项
$wp_customize->add_setting( 'footer_copyright_text', array(
'default' => '© 2026 我的网站。',
'sanitize_callback' => 'sanitize_text_field',
) );
// 为设置项添加一个控件（输入框）
$wp_customize->add_control( 'footer_copyright_text', array(
'label' => __( '页脚版权文本', 'my-first-theme' ),
'section' => 'title_tagline', // 放在“站点身份”区域
'type' => 'text',
) );
}
add_action( 'customize_register', 'my_theme_customize_register' );
?>템플릿 파일 내에서… footer.php 중에서, 이 옵션의 값을 다음과 같이 출력할 수 있습니다:
<p class="site-info">
<?php echo esc_html( get_theme_mod( 'footer_copyright_text', '© 2026 我的网站。' ) ); ?>
</p>요약
WordPress 테마 개발은 PHP 프로그래밍, HTML 구조, CSS 스타일링, 그리고 WordPress의 핵심 API에 대한 지식이 결합된 종합적인 기술입니다. 가장 기본적인 개념부터 시작하여… style.css 템플릿 파일부터 시작하여 템플릿의 계층 구조를 점차 이해하고, 템플릿을 사용하는 방법을 배워보세요. functions.php 후크(hook)를 활용하여 기능을 확장하고, 최종적으로 반응형 디자인과 다양한 사용자 정의 옵션을 구현하는 것은 자격 있는 테마 개발자가 되기 위한 명확한 길입니다. 개발 과정에서 공식적인 코딩 표준과 모범 사례를 준수함으로써 테마의 품질과 보안성을 보장할 수 있을 뿐만 아니라, 향후의 유지보수 및 업데이트에도 탄탄한 기반을 마련할 수 있습니다.
자주 묻는 질문
WordPress 테마 개발을 배우기 위해서는 어떤 사전 지식이 필요한가요?
HTML과 CSS의 기초 지식을 갖추는 것이 권장됩니다. 이는 웹 페이지의 구성과 디자인을 만드는 데 필수적인 기초입니다. 또한, WordPress의 핵심 부분과 템플릿 시스템이 주로 PHP로 구동되므로 PHP에 대한 기본적인 이해도 필요합니다. JavaScript에 대한 초보적인 지식은 나중에 인터랙티브 기능을 개발할 때 매우 유용할 것입니다.
테마의 functions.php 파일과 서브테마의 functions.php 파일이 충돌할 수 있을까요?
충돌하지 않을 것입니다. 두 가지 모두 로드될 것입니다. 하위 주제(subtopic)의 내용도 마찬가지입니다. functions.php 파일은 상위 주제의 폴더에 저장됩니다. functions.php 파일은 나중에 로드됩니다. 이는 자식 테마에서 새로운 기능을 추가하거나 부모 테마에서 정의된 기능을 덮어쓸 수 있음을 의미합니다(단, 부모 테마의 함수가 덮어쓰기 가능하도록 선언되어 있어야 합니다). 이는 테마의 핵심 기능을 안전하게 수정하는 권장 방법입니다.
내 테마를 다국어(국제화)로 지원하려면 어떻게 해야 하나요?
당신은 WordPress의 국제화 함수를 사용하여 인터페이스에 표시되어야 하는 모든 텍스트 문자열을 감싸야 합니다. 주로 다음 함수들을 사용하게 될 것입니다: __() 그리고 _e() 함수들을 작성하고, 각 함수가 어떤 작업을 수행할지 명확히 지정해 주세요. style.css 중국에서 정의된 Text Domain그런 다음, Poedit와 같은 도구를 사용하여 .pot 템플릿 파일을 생성합니다. 이 파일은 번역자가 .po와 .mo 번역 파일을 만들기 위한 기반이 됩니다. 생성된 .po와 .mo 파일들은 테마의 해당 위치에 저장되어야 합니다. /languages/ 카테고리 아래에.
비즈니스 테마를 개발할 때 고려해야 할 법적 및 규제적 사항은 무엇인가요?
가장 중요한 것은 WordPress 자체가 사용하는 GNU GPL 라이선스를 준수하는 것입니다. 이는 여러분이 개발한 테마의 PHP 코드 부분이 GPL과 호환되는 라이선스를 사용해야 함을 의미합니다. 일반적으로 테마 전체가 GPL 라이선스를 따릅니다. 또한, 사용하는 제3자 리소스(아이콘, 글꼴, JavaScript 라이브러리 등)도 적절한 상용 라이선스를 가지고 있는지 확인해야 합니다. 코드 표준에 있어서는 WordPress 공식의 코드 가이드라인을 준수해야 하며, Theme Check 플러그인의 기본적인 검토를 통과하여 공식 디렉터리에 등록될 가능성을 높여야 합니다.
다음 단계는 무엇인가요?
확장된 독서 및 실무 지식
다음은 이 도움말의 주제와 관련이 있으며 더 깊이 있게 읽기에 적합합니다. 현재 문제와 가장 가까운 문서부터 시작하여 점차 주변 주제로 확장하는 것이 우선순위를 정하는 것이 좋습니다.
한국어