Знание разработки тем для WordPress является обязательным для каждого, кто хочет создать персонализированный веб-сайт.

Овладение разработкой тем для WordPress является обязательным этапом для любого разработчика, который хочет создать индивидуальный веб-сайт или заниматься профессиональной разработкой веб-сайтов. Это отличается от простого внесения изменений в существующий шаблон. style.css Разработка тем для WordPress отличается от создания обычных веб-сайтов. Настоящая разработка темы включает в себя создание с нуля полностью функционального веб-сайта с чёткой структурой и в соответствии с основными правилами WordPress. Для этого необходимо не только хорошо разбираться в базовых технологиях, таких как PHP, HTML, CSS и JavaScript, но и глубоко понимать архитектуру тем WordPress, иерархию шаблонов, функции темы и систему хуков. В этой статье мы подробно разберём основные концепции разработки тем для WordPress, необходимую структуру файлов, систему шаблонов и способы добавления пользовательских функций, чтобы помочь вам заложить прочную техническую основу.

Основы темы WordPress и основные файлы.

Для активации самой базовой темы WordPress требуется всего два файла:style.css и index.phpОднако полнофункциональная и хорошо структурированная тема, файлы которой организованы в соответствии с чёткой логикой. Понимание роли этих основных файлов — первый шаг в разработке.

Документ с изложением темы информационного сообщения.

Во-первых,style.css Файл — это не просто таблица стилей. Его главная функция — выступать в качестве “удостоверения личности” темы. В верхней части файла с помощью специальных комментариев указываются метаданные темы. WordPress использует эту информацию для распознавания, отображения и активации вашей темы.

Пример:

/*
Theme Name: 我的自定义主题
Theme URI: https://example.com/my-theme/
Author: 你的名字
Author URI: https://example.com/
Description: 这是一个为学习目的而构建的简洁 WordPress 主题。
Version: 1.0.0
License: GPL v2 or later
Text Domain: my-custom-theme
*/

Среди них,Text Domain Для целей интернационализации это уникальный идентификатор, используемый совместно с последующими языковыми файлами и функциями перевода текста.

Ультахост (UltaHost) – хостинг-провайдер, предоставляющий услуги хостинга для сайтов, построенных на платформе WordPress.

Гарантия возврата средств в течение 30 дней, неограниченная пропускная способность интернет-канала и объем баз данных, бесплатная защита от DDoS-атак. При покупке на срок 3 лет предоставляется скидка в размере 501 ТБ до 4 ТБ.

страница доступа

Главный шаблон и универсальный шаблон

index.php Это обязательный файл входа для темы. Когда WordPress не может найти более конкретный шаблон для текущего запроса, он переходит на использование этого файла. index.phpТаким образом, он обычно содержит базовый HTML-скелет веб-сайта и вызывает другие шаблонные элементы.

header.php и footer.php Это файл шаблона, используемый для разделения верхней и нижней частей страницы. С его помощью можно get_header() и get_footer() Функции, вызываемые в главном шаблоне, могут значительно повысить повторное использование кода. Аналогично,sidebar.php Используется в боковой панели, через get_sidebar() Вызов.

functions.php Это “функциональный центр” темы. Хотя он и не является обязательным, почти все темы используют его. Здесь вы можете добавлять пользовательские функции, настраивать меню и боковые панели, импортировать файлы стилей и скриптов, а также определять функции, поддерживаемые темой. Он автоматически загружается при инициализации темы.

Понять систему уровней шаблонов.

Иерархия шаблонов в WordPress является одной из его самых мощных и гибких функций. Это набор правил, определяющих, как WordPress автоматически выбирает наиболее подходящий шаблон для отображения страницы в зависимости от её типа (например, главная страница, страница статьи, страница категории). Разработчики могут легко контролировать логику отображения различных страниц, создавая шаблоны с определёнными именами.

Правила поиска от конкретного к общему.

Для статьи в блоге WordPress ищет шаблонные файлы в следующем порядке:
1. single-post-{slug}.php (Шаблон для псевдонимов статей)
2. single-post-{id}.php (Шаблон идентификатора статьи)
3. single-post.php (Общий шаблон для всех статей)
4. single.php (Общий шаблон для всех отдельных статей любого типа пользовательских статей)
5. singular.php (Все универсальные шаблоны для одной страницы)
6. index.php (Темплейт для финального отката)

Это означает, что если вы хотите создать специальную страницу для определённой статьи (например, статьи под названием “Hello World”), просто создайте страницу с таким названием. single-post-hello-world.php Достаточно использовать соответствующий файл. Для страниц с классификацией правила аналогичны; система будет искать элементы, соответствующие заданным критериям. category-{slug}.php、archive.php и другие документы.

Используйте условные теги для точного контроля.

В шаблонах часто необходимо определить, какой контент отображать в зависимости от текущего типа страницы. Для этого используются функции условной разметки WordPress. Эти функции возвращают булевое значение, которое помогает принимать решения.

Например, в index.php В этом случае вы можете использовать его следующим образом:

hosting.com Общий хостинг

Высокая производительность благодаря процессорам AMD EPYC, SSD-накопителям NVMe и LiteSpeed, круглосуточная экспертная поддержка, передовые меры безопасности, включая SSL, защиту от грубой силы, вредоносных программ и DDoS, экономия до 73%

страница доступа

<?php
if ( is_home() && ! is_front_page() ) {
    // 当静态首页被设置，且当前页面是博客文章索引页时
    echo &#039;<h1>博客文章归档</h1>';
} elseif ( is_search() ) {
    // 当当前页面是搜索结果页时
    echo '<h1>搜索结果</h1>';
}
?&gt;

Другие часто используемые условные теги включают is_single()、is_page()、is_category()、is_archive() и т. д. Они являются инструментами логического управления, дополняющими уровень шаблонов.

Интеграция основных технологий разработки и функциональных возможностей.

Разработка современной темы для WordPress — это гораздо больше, чем просто вывод HTML-кода. Она также требует интеграции основных функций WordPress и соблюдения передовых методов для добавления пользовательских функций.

\nРегистрация и вызов навигационного меню.

Навигационное меню является основой веб-сайта. В нём functions.php В этом случае вам необходимо использовать register_nav_menus() Функция для регистрации одного или нескольких расположений меню.

function my_theme_setup() {
    register_nav_menus(
        array(
            'primary' => __( '主导航菜单', 'my-custom-theme' ),
            'footer'  => __( '底部菜单', 'my-custom-theme' ),
        )
    );
}
add_action( 'after_setup_theme', 'my_theme_setup' );

После регистрации пользователи могут настроить эти меню в разделе “Внешний вид” -> “Меню” в административной панели WordPress. Эти настройки также можно найти в файлах шаблона (например, ). header.php(Номер телефона), используйте wp_nav_menu() Используйте функцию, чтобы вызвать и вывести на экран указанное меню.

wp_nav_menu(
    array(
        'theme_location' => 'primary',
        'menu_class'     => 'primary-menu',
        'container'      => false,
    )
);

Добавлена функция добавления темы с поддержкой боковой панели.

Через add_theme_support() Функция, с помощью которой вы можете объявить различные функции, поддерживаемые темой, такие как изображения для статей, пользовательские логотипы, форматирование статей и т. д. Обычно это размещается в functions.php В функции инициализации.

function my_theme_features() {
    add_theme_support( 'post-thumbnails' ); // 支持特色图片
    add_theme_support( 'custom-logo' ); // 支持自定义Logo
    add_theme_support( 'html5', array( 'comment-list', 'comment-form', 'search-form', 'gallery', 'caption' ) ); // 支持HTML5标记
}
add_action( 'after_setup_theme', 'my_theme_features' );

Регистрация и использование раздела с виджетами (боковая панель) register_sidebar() Функция. После регистрации пользователи могут добавлять контент в эти области в разделе “Внешний вид” -> “Гаджеты” в панели администрирования.

Общий хостинг InterServer

Общий хостинг $2.50 USD в месяц, первый месяц $0.1 USD промо-код tryinterserver, 461 скрипт облачных приложений, установка в один клик.

страница доступа

register_sidebar(
    array(
        'name'          => __( '文章侧边栏', 'my-custom-theme' ),
        'id'            => 'sidebar-1',
        'description'   => __( '在文章页面显示的侧边栏。', 'my-custom-theme' ),
        'before_widget' =&gt; '<section id="%1$s" class="widget %2$s">',
        'after_widget'  =&gt; '</section>'перед заголовком '<h3 class="widget-title">',
        'after_title'   =&gt; '</h3>',
    )
);

В шаблоне используйте… dynamic_sidebar( 'sidebar-1' ) Выведите его на экран.

Безопасное внедрение стилей и скриптов.

Правильный способ загрузки ресурсов — через wp_enqueue_style() и wp_enqueue_script() Функции и их подключение к wp_enqueue_scripts На крючке. Это гарантирует правильность зависимостей и позволяет избежать их повторной загрузки.

function my_theme_scripts() {
    // 引入主题主样式表
    wp_enqueue_style( 'my-theme-style', get_stylesheet_uri(), array(), '1.0.0' );
    // 引入自定义JavaScript文件
    wp_enqueue_script( 'my-theme-script', get_template_directory_uri() . '/js/main.js', array( 'jquery' ), '1.0.0', true );
}
add_action( 'wp_enqueue_scripts', 'my_theme_scripts' );

пользоваться get_stylesheet_uri() и get_template_directory_uri() Используйте функцию для получения URL тематической папки, чтобы гарантировать правильность пути.

Развитие на продвинутом уровне: циклы, хуки и подтемы.

После освоения основ понимание “цикла”, системы хуков и модели разработки подтем в WordPress позволит вам вывести свои навыки разработки на новый уровень.

Понимание и использование главного цикла WordPress.

“Цикл” (The Loop) — это структура кода на PHP в WordPress, которая используется для извлечения и отображения статей из базы данных. Она является основой всех шаблонов отображения контента.

<article id="post-<?php the_ID(); ?>" no numeric noise key 1007>
            <h2><a href="/ru/</?php the_permalink(); ?>"></a></h2>
            <div class="entry-content">
                
            </div>
        </article>
    

    <p><?php _e( '抱歉，没有找到任何内容。', 'my-custom-theme' ); ?></p>

Внутри цикла вы можете использовать ряд функций шаблонных тегов, таких как the_title()、the_content()、the_permalink() Ожидайте вывод информации о текущей статье. Понимание и умелое использование циклов является основой для настройки списка статей и отображения контента на одной странице.

Расширение функциональности с помощью хуков.

Архитектура плагинов WordPress и многие функции тем основаны на системе хуков. Она позволяет вставлять собственный код в определённые точки выполнения (хуки действий) или изменять данные, выводимые другими функциями (хуки фильтров).

Например, для автоматического добавления текста в конце всех статей можно использовать фильтр-хук. the_content：

function my_content_filter( $content ) {
    if ( is_single() ) {
        $content .= '<p class="disclaimer">Эта статья была опубликована на моем веб-сайте.</p>';
    }
    return $content;
}
add_filter( 'the_content', 'my_content_filter' );

Использование триггеров действий также очень распространено, например, в wp_footer Добавьте статистический код на крючок:

function my_footer_code() {
    echo '<!-- 自定义页脚代码 -->';
}
add_action( 'wp_footer', 'my_footer_code' );

Понимание и использование хуков означает, что вы можете изменять основное поведение WordPress или темы неинвазивным способом, что является ключом к продвинутой разработке.

Создайте подтемы для безопасной настройки.

Прямое изменение существующих файлов темы может быть опасным, поскольку обновление темы перезапишет все внесённые изменения. Правильный подход заключается в создании дочерней темы. Дочерняя тема наследует все функции родительской темы, и вам потребуется переписать только те файлы или функции, которые необходимо изменить в дочерней теме.

Для одной подтемы требуется как минимум один вопрос. style.css Откройте документ и укажите в нём родительскую тему:

/*
Theme Name: 我的子主题
Template: parent-theme-folder-name // 这里必须填写父主题的目录名
Text Domain: my-child-theme
*/

После этого вы можете создать файл шаблона с тем же названием, что и у родительской темы (например, header.phpнужно либо перекрыть его, либо разместить в подтеме. functions.php Добавление новых функций или изменение существующих функций в WordPress. Подтемы являются стандартной практикой в профессиональном процессе разработки WordPress.

резюме

Разработка тем для WordPress — это системный проект, охватывающий всё: от структуры до деталей, от основ до продвинутых возможностей. Разработчикам необходимо понять style.css и index.php Как только вы освоите основные документы, изучите систему иерархии шаблонов, чтобы обеспечить точный контроль над страницами, и научитесь эффективно её использовать. functions.php Чтобы интегрировать такие основные функции, как меню, виджеты и изображения в шапке. На продвинутом этапе необходимо глубоко понять механизм “циклов” для управления выводом контента, использовать систему хуков для гибкого расширения функциональности и, наконец, осуществлять безопасную и удобную для обслуживания кастомную разработку с помощью создания подтем. Следуя этому пути, вы не только сможете создать мощную кастомную тему, но и глубоко поймете философию работы мощной системы управления контентом WordPress.

Часто задаваемые вопросы

Обязательно ли изучать PHP, чтобы разрабатывать темы для WordPress?

Да, PHP является основным языком программирования WordPress и его изучение обязательно. Шаблоны тем состоят из кода PHP, используемого для динамической генерации HTML-контента, вызова функций WordPress и обработки логики. Хотя вы можете использовать конструкторы страниц для создания внешнего вида, знание PHP необходимо для проведения глубокой настройки, создания высокопроизводительных и соответствующих стандартам тем.

Почему моя пользовательская тема не отображается в фоновом режиме?

Сначала проверьте, правильно ли размещены ваши тематические папки в /wp-content/themes/ Во-первых, выберите нужную тему в каталоге. Во-вторых, откройте тему. style.css Проверьте файл и убедитесь, что блок с информацией о теме в верхней части файла полностью соответствует формату, особенно это касается заголовка. Theme Name: Эта строка должна быть присутствующей и правильной. Наконец, убедитесь, что ваша тема содержит, по крайней мере, style.css и index.php Это два действительных документа.

Как добавить многоязычную поддержку для текстового содержания моей темы?

Вы должны подготовить все текстовые строки, ориентированные на пользователя, в своей теме для локализации. Для этого при выводе текста используйте такие инструменты, как < __()、_e() Такая функция перевода, в которую вы передаете необходимые данные… style.css Определённое в Китае. Text DomainЗатем, используя такой инструмент, как Poedit, просканируйте файлы вашей темы, чтобы создать их перевод. .pot Шаблонный файл, на основе которого создаются файлы на разных языках, например, zh_CN.poЭто перевод документа (на китайском языке). В конце концов, скомпилированный документ будет выглядеть следующим образом: .mo Файлы были добавлены в тему. /languages/ Каталог.

Будет ли файл functions.php дочерней темы перекрывать файл functions.php родительской темы?

Они не будут перекрывать друг друга, а будут объединены. WordPress сначала загрузит родительскую тему. functions.php Сначала загрузите файл, а затем загрузите подтемы. functions.php Документ. Это означает, что вы можете использовать его в подтеме. functions.php Вы можете добавить новые функции или вызвать новые хуки в своих дочерних темах. Однако, если вам необходимо изменить поведение какой-либо функции в родительской теме, обычно нельзя просто переопределить её. Вместо этого следует удалить хук, к которому привязана функция в родительской теме, а затем снова привязать свою собственную функцию к этому хуку.