市場には何千もの既製のWordPressテーマがありますが、カスタムテーマを開発することには比類のない利点があります。ウェブサイトのデザイン、機能、パフォーマンスを完全にコントロールでき、ブランドイメージやビジネスニーズに完璧に合わせることができます。このガイドでは、ゼロから始めて、プロフェッショナルでメンテナンスしやすいカスタムWordPressテーマを体系的に構築する方法を紹介します。
開発環境と基本準備
最初のコード行を書く前に、効率的なローカル開発環境を構築することが非常に重要です。これにより、オンラインサイトに影響を与えることなく、自由にテストやデバッグを行うことができます。
ローカル開発環境の構築
集成的ローカルサーバーソフトウェアパッケージの使用をお勧めします。例えば、Local by Flywheel、XAMPP、MAMPなどです。これらのツールを使用すると、Apache/Nginx、MySQL、PHPをワンクリックでインストールでき、面倒な設定作業が不要になります。インストールが完了したら、新しいWordPressサイトを作成してください。開発段階では、WordPressのデバッグモードを有効にすることをお勧めします。これにより、潜在的な問題を発見しやすくなります。サイトの設定に関しては、…（続きがありますが、テキストが途切れています）。 wp-config.php 関連する定数はファイル内で定義されています。
推薦図書 WordPressテーマ開発入門ガイド：ゼロから最初のカスタムテーマを構築する。
define( 'WP_DEBUG', true );
define( 'WP_DEBUG_LOG', true );
define( 'WP_DEBUG_DISPLAY', false );トピックの基本的な構造を理解する
最もシンプルなWordPressテーマには、少なくとも2つのファイルが必要です：index.php と style.cssその中で、style.css ヘッダー内のコメントは、スタイルを定義するためだけでなく、WordPressがテーマを認識するための「メタデータ」としても機能します。以下は、標準的なテーマ情報ヘッダーの例です：
/*
Theme Name: 我的自定义主题
Theme URI: https://example.com/my-theme/
Author: 你的名字
Author URI: https://example.com/
Description: 这是一个为专业网站打造的自定义主题。
Version: 1.0.0
License: GPL v2 or later
Text Domain: my-custom-theme
*/コアテンプレートファイルと階層構造
WordPressはテンプレートの階層構造を利用して、特定のタイプのページにどのテンプレートファイルを読み込むかを決定します。この仕組みを理解することは、テーマ開発の核心です。
基本テンプレートファイルを作成します。
まずはいくつかの重要なテンプレートファイルを作成することから始めましょう。 header.phpそれにはドキュメントのヘッダー部分に含まれるHTMLが含まれています。 一部のコンテンツやウェブサイトのヘッダー領域に使用します。 wp_head() この関数により、WordPressのコア、プラグイン、およびあなたが作成したテーマがここに必要なコードを挿入することができます。
次ページ footer.phpそれにはウェブサイトのフッター領域が含まれており、その部分には以下のように使用する必要があります： wp_footer() 関数を作成します。その後、それを使用して何かを作成します。 index.php これは最終的な予備テンプレートとして使用できます。このファイル内で必要に応じてご利用ください。 get_header()、get_footer() 等模板标签来引入其他部分。
記事のループ処理を実現する
記事のループ処理とは、WordPressがデータベースから記事を取得し、表示するための核心的なメカニズムです。 index.php または、記事一覧を表示するためのテンプレートの中では、ループを使用する必要があります。
推薦図書 機能豊富なカスタムWordPressテーマの作り方を、手取り足取り教えます。。
備考：この翻訳はPHPコードのみを対象としたもので、HTMLコードは含まれていません。
<article id="post-<?php the_ID(); ?>" no numeric noise key 1006>
<h2><a href="/ja/</?php the_permalink(); ?>">あなたのウェブサイトのタイトルを表示するには、次のコードを使用してください。</a></h2>
<div class="entry-content">
あなたのコメントは受け付けられました。ありがとうございます。
</div>
</article>
終わりました。ありがとうございました。
<p><?php esc_html_e( '抱歉，没有找到任何文章。', 'my-custom-theme' ); ?></p>
endif; 終わりテーマ機能と高度な機能
専門的なテーマは、見た目だけでなく、機能ファイルを通じてその能力をさらに強化する必要があります。
functions.php ファイルを使用します。
functions.php このファイルは、あなたのテーマ「エンジンルーム」に関連するものです。ここには、テーマの機能をサポートするためのコードや、メニューやサイドバーの設定、スタイルシート、スクリプトファイルなどを追加することができます。例えば、記事の特集画像やカスタムアイコンのサポートを追加することも可能です。
function my_theme_setup() {
add_theme_support( 'post-thumbnails' );
add_theme_support( 'custom-logo' );
register_nav_menus( array(
'primary' => __( '主导航菜单', 'my-custom-theme' ),
) );
}
add_action( 'after_setup_theme', 'my_theme_setup' );「小道具の登録」エリア
小道具エリア（サイドバー）は、ウェブサイトに柔軟なモジュール式のコンテンツ領域を提供します。あなたは… functions.php それらを登録した後、テンプレートファイル（例えば…）に記述します。 sidebar.php）で使用されています dynamic_sidebar() 呼び出すために。
function my_theme_widgets_init() {
register_sidebar( array(
'name' => __( '主侧边栏', 'my-custom-theme' ),
'id' => 'sidebar-1',
'description' => __( '在此添加小工具。', 'my-custom-theme' ),
'before_widget' => '<section id="%1$s" class="widget %2$s">',
'after_widget' => '</section>',
'before_title' => '<h3 class="widget-title">',
'after_title' => '</h3>',
) );
}
add_action( 'widgets_init', 'my_theme_widgets_init' );スタイル、スクリプト、そして国際化
現代のテーマでは、フロントエンドリソースの整理、パフォーマンスの最適化、多言語対応に注目する必要があります。
レイアウトスタイルとスクリプトの適用
テンプレートファイル内でCSSやJSファイルに直接ハードリンクを張ることは絶対に避けてください。正しい方法は、それらのファイルを別の場所に配置し、テンプレート内でその場所を参照するようにすることです。 wp_enqueue_style() と wp_enqueue_script() 関数です。これにより、依存関係が正しく保たれ、重複して読み込まれるのを防ぎます。通常は、以下のような構造の中で使用されます： wp_enqueue_scripts フック関連の関数内で処理を完了します。
function my_theme_scripts() {
// 排入主样式表
wp_enqueue_style( 'my-theme-style', get_stylesheet_uri() );
// 排入自定义 JavaScript 文件
wp_enqueue_script( 'my-theme-navigation', get_template_directory_uri() . '/js/navigation.js', array(), '1.0.0', true );
}
add_action( 'wp_enqueue_scripts', 'my_theme_scripts' );テーマの国際化を実現する
「国際化（i18n）」とは、テーマのテキスト文字列を他の言語に翻訳することを意味します。ユーザーに表示されるすべてのテキストは、WordPressの翻訳機能を使用して処理する必要があります。例えば： () エコー表示用です。esc_html() これはエスケープ処理を行った後にその内容を再表示するためのものです。あなたはそれを必要としています。 style.css のヘッダー部分と load_theme_textdomain() 関数呼び出しで同じものを指定しています。 Text Domain。
推薦図書 WordPressテーマ開発の究極ガイド：ゼロからプロフェッショナルなテーマを構築する。
load_theme_textdomain( 'my-custom-theme', get_template_directory() . '/languages' );
// 在模板中使用
echo esc_html__( '阅读更多', 'my-custom-theme' );概要
ゼロからカスタムWordPressテーマを開発することは、体系的なプロジェクトです。これには、環境の構築、テンプレートの構造の理解、コアファイルの作成、そして最終的にそのテーマを実際に機能させるための各種設定の調整までが含まれます。 functions.php 機能の追加、スタイルスクリプトの規範的な管理、そして国際化の実現。WordPressのコーディング基準とベストプラクティスに従うことで、ニーズに完全に合致するプロフェッショナルなウェブサイトを構築するだけでなく、テーマの安定性、安全性、保守性も確保できます。これらの核心的なスキルを習得することで、既存のテーマの制約を超え、他に類を見ないオンライン体験を創造することができるでしょう。
FAQ よくある質問
WordPressのテーマを開発するには、どのようなプログラミング言語をマスターする必要がありますか？
WordPressのテーマを開発するには、主にPHP、HTML、CSS、JavaScriptのスキルが必要です。PHPはサーバーサイドのロジック処理やWordPressのコア機能の実装に使用されます。HTMLはページの構造を作成するために使われ、CSSはデザインやレイアウトを決定します。JavaScriptはフロントエンドのインタラクションや動的な効果を実現するために使用されます。
テーマの `functions.php` ファイルとプラグインにはどのような違いがありますか？
functions.php これはテーマの一部であり、その機能は現在アクティブなテーマに紐付いています。テーマを切り替えると、これらの機能は無効になります。一方、プラグインが提供する機能はテーマとは独立しており、テーマを変更してもプラグインの機能は引き続き使用できます。一般的に、ウェブサイトの外観やレイアウトに密接に関連する機能はテーマ内に配置するべきであり、汎用的で独立した機能はプラグインとして作成するのが適しています。
どうすれば私のテーマがWordPressの公式テーマディレクトリの審査を通過できるでしょうか？
WordPress.orgの公式テーマディレクトリにテーマを提出するには、コードの品質、セキュリティ、互換性、プライバシーポリシー、アクセシビリティなど、一連の厳格な基準を厳守する必要があります。ハードコードされたリンクがないこと、安全な関数の使用、RTL（右から左への）言語表示のサポート、完全な翻訳ファイルの提供、そしてWordPressのテーマ審査チームが定めたすべての基準に従うことを確認する必要があります。
カスタムテーマを開発する際に、ページビルダーとの互換性をどのように処理すればよいでしょうか？
より良い互換性を実現するために、お勧めしますが、お使いのテーマにElementorやBeaver Builderなどの人気のあるページビルダーに対する明示的なサポートを追加してください。これには通常、以下のような対応が含まれます： functions.php テーマ設定において、ビルダーで使用される記事タイプに対する特別な画像サポートを明示的に追加し、またテーマのCSSがビルダーのウィジェットのデフォルトスタイルを過度にリセットしないようにすることで、ユーザーがビルダーを自由に使ってレイアウトデザインを行えるようにしてください。
次はどうする？
拡大読書と実践的知識
以下は、この記事のトピックに関連しており、さらに深く読むのに適している。あなたの現在の問題に最も近い記事から優先順位をつけ、徐々に周辺のトピックに広げていく方が良い場合が多い。
日本語