ゼロから始める：WordPressテーマ開発の核心をステップごとに学ぶ

準備作業と環境設定

コードの執筆を始める前に、安定しており効率的な開発環境を整えることが成功への第一歩です。

ローカル開発環境の設定

本番サイトに影響を与えずに開発を進めるため、ローカル開発環境の構築を強くおすすめします。たとえば、次のようなものを利用できます。 Local、XAMPP または MAMP などのツールを使えば、ローカルPCにPHPとMySQLの環境をすばやく構築できます。WordPressをインストールすれば、安全なサンドボックス環境が整い、すべての機能を自由にテストできます。

テーマファイルの基本構造

WordPress テーマは本質的に、次の場所にある /wp-content/themes/ ディレクトリ配下のフォルダ。最も基本的なファイル構成には、次の2つのファイルが含まれている必要があります：style.css と index.phpその中で、style.css スタイルシートであるだけでなく、「説明書」でもあり、ファイル先頭のコメントはWordPressにテーマ情報を伝えるために使われます。

推薦図書 WordPressテーマ開発入門：ゼロから初めてのカスタマイズテーマの作成。

典型的 style.css ファイルヘッダーは以下の通りです：

UltaHostのWordPressホスティングサービス

30日間の返金保証、無制限の帯域幅とデータベースサービス、無料のDDoS防御機能が付きます。3年契約をすると、501TPから4Tまでのプランで割引が適用されます。

アクセスページ

/*
Theme Name: 我的第一个主题
Theme URI: https://example.com/my-first-theme
Author: 你的名字
Author URI: https://example.com
Description: 这是一个用于学习 WordPress 主题开发的简单主题。
Version: 1.0
License: GPL v2 or later
Text Domain: my-first-theme
*/

index.php これはテーマのデフォルトテンプレートファイルで、サイト内のすべてのページに対応する予備の表示テンプレートです。この2つのファイルを起点に、テーマ全体を段階的に構築できます。

テンプレートの階層とループを理解する

WordPressの大きな魅力はテンプレートシステムにあり、明確な階層ルールによって、各ページでどのテンプレートファイルを使用するかが決まります。

テンプレートファイルの呼び出し順序

ユーザーがページにアクセスすると、WordPress はページの種類（トップページ、投稿ページ、カテゴリーページなど）に応じて、対応するテンプレートファイルを自動的に探します。たとえば、個別の投稿を表示する場合、WordPress は優先的に որոնします single-post.phpもし該当するものが存在しない場合は、代わりに以下の方法を使用してください。 single.phpそして、最後にロールバックを行うのです。 index.phpこの「特殊から一般へ」の検索順序を押さえれば、各ページの見た目を的確にコントロールできます。

コアループの仕組み

“「ループ（The Loop）」は、データベースからコンテンツを取得して表示するために WordPress で使われる PHP コードブロックです。テーマの中核となる仕組みです。最も基本的なループ構造は次のとおりです。

推薦図書 完全ガイド：ゼロからカスタムWordPressテーマを作成する方法。

備考：この翻訳はPHPコードのみを対象としたもので、HTMLコードは含まれていません。
    <h2>あなたのウェブサイトのタイトルを表示するには、次のコードを使用してください。</h2>
    <div class="entry-content">
        あなたが送信したメッセージは長すぎます。最大300文字まで送信できます。
    </div>
終わりました。ありがとうございました。

这段代码检查是否有文章，然后循环遍历每一篇，并使用如 the_title()、the_content() このようにテンプレートタグで内容を出力します。ループを理解し、使いこなすことが、動的コンテンツ表示の基本です。

コアテーマ機能を構築

完全なテーマはコンテンツを表示するだけでなく、メニューやサイドバー、ウィジェット対応といったWordPressのコア機能も統合する必要があります。

登録ナビゲーションメニュー

現代のウェブサイトにナビゲーションメニューは欠かせません。まずはテーマの functions.php ファイルで使用されている register_nav_menus() この関数は、トピックがメニュー内のどの位置に表示されるかを設定するためのものです。

hosting.com 共有ホスティング

AMD EPYC CPU、NVMe SSDストレージ、LiteSpeedによる高いパフォーマンス、24時間365日の専門家による社内サポート、SSL、ブルートフォース、マルウェア、DDoS保護などの高度なセキュリティ対策、最大73%のコスト削減

アクセスページ

function mytheme_setup() {
    register_nav_menus( array(
        'primary' => __( '主导航菜单', 'my-first-theme' ),
        'footer'  => __( '页脚菜单', 'my-first-theme' ),
    ) );
}
add_action( 'after_setup_theme', 'mytheme_setup' );

その後、テンプレートファイル（例えば…）内で… header.php）メニューを表示する必要がある場所には、以下の方法を使用してください： wp_nav_menu() 関数がそれを呼び出します。

ウィジェットエリアを有効化

サイドバーやフッターのウィジェットエリアでは、柔軟にコンテンツをカスタマイズできます。同様に functions.php ここでは、「使用」を使っています。 register_sidebar() 関数を登録します。

function mytheme_widgets_init() {
    register_sidebar( array(
        'name'          => __( '主侧边栏', 'my-first-theme' ),
        'id'            => 'sidebar-1',
        'description'   => __( '在此添加小工具。', 'my-first-theme' ),
    ) );
}
add_action( 'widgets_init', 'mytheme_widgets_init' );

登録後、テンプレートで使用 dynamic_sidebar( 'sidebar-1' ) そのエリアを出力できます。

推薦図書 WordPressテーマ開発実践：ゼロからカスタムテーマを構築するための完全ガイド。

スタイル、スクリプト、テーマの最適化

为了让主题外观精美、性能优异且易于维护，需要正确处理样式脚本，并遵循最佳实践。

リソースファイルを安全に読み込む

永远不要直接在模板文件中硬链接 CSS 或 JavaScript 文件。正确的方式是通过 functions.php 利用する wp_enqueue_style() と wp_enqueue_script() 関数を順番に読み込みます。これにより、依存関係を適切に管理し、競合を防ぎ、WordPress の最適化機能にも対応します。

インターサーバー共有ホスティング

共有ホスティング月$2.50米ドル, 最初の月$0.1米ドルプロモーションコードtryinterserver, 461クラウドアプリケーションスクリプト, 1クリックインストール.

アクセスページ

function mytheme_scripts() {
    // 引入主题主样式表
    wp_enqueue_style( 'mytheme-style', get_stylesheet_uri() );
    // 引入自定义 JavaScript 文件
    wp_enqueue_script( 'mytheme-navigation', get_template_directory_uri() . '/js/navigation.js', array(), '1.0', true );
}
add_action( 'wp_enqueue_scripts', 'mytheme_scripts' );

レスポンシブデザインと基本SEOを実装

はい。 style.css その際、メディアクエリ（Media Queries）を使って、テーマがスマートフォン、タブレット、パソコンで適切に表示されるようにします。また、 header.php 中で、たとえば次のような内容を正しく出力する wp_head() この重要なフックにより、WordPress コアやプラグインは必要なメタタグ（文字セット、ビューポート設定など）や SEO 情報を挿入でき、テーマを検索エンジンに最適化するための基盤となります。

概要

WordPress 主题开发是一个从结构到细节的渐进过程。从搭建环境、理解模板层级和核心循环开始，逐步添加菜单、小工具等核心功能，最后以标准化、优化的方式处理样式脚本，你就能构建出功能完整、代码专业的主题。关键在于动手实践，从一个简单的 index.php と style.css まずは機能を一つずつ追加していくことで、各部分がどのように連携して動くのかを深く理解できるようになります。

FAQ よくある質問

### テーマ開発には PHP の知識が必須ですか？
はい、PHP は WordPress のサーバーサイドプログラミング言語であり、テーマで動的な機能を実現する基盤です。データを操作し、WordPress のテンプレートタグや関数を呼び出すには、基本構文、ループ、条件分岐、関数呼び出しを理解する必要があります。

主题的 functions.php 文件有什么作用？

functions.php このファイルは、テーマの「機能の中心」です。テーマ機能の追加、デフォルト動作の変更、メニューやウィジェットエリアの登録、スタイルシートやスクリプトの読み込みに使われます。このファイルを使えば、コアファイルを変更せずに WordPress サイトを深くカスタマイズできます。

如何让我的主题支持翻译？

让你的主题支持翻译（国际化）主要分为两步。首先，在主题的所有文本字符串中使用 WordPress 的翻译函数，如 __( ‘文本’, ‘my-text-domain’ )次に、Poedit などのツールを使ってテーマファイルをスキャンし、生成します .pot 翻译模板文件，译者可以据此创建不同语言的 .po と .mo ファイル。

開発が完了した後、テーマをどのようにしてパッケージ化して配布するのでしょうか？

テーマフォルダ内のすべてのコアファイル（開発中のソースコード、バージョン管理ディレクトリなどを除く） .git、および無関係なメモファイル）を1つに圧縮 .zip ファイル。この圧縮ファイルは、WordPress 管理画面の「テーマのアップロード」機能から直接インストールできます。お使いの style.css ファイルヘッダー情報は完全かつ正確である必要があります。これは、WordPress がテーマを認識する唯一の根拠です。