WordPressブロックテーマ開発用のプレーンなテンプレートプロジェクトです。最小限の設定で、すぐに開発を始められるように設計されています。
- Node.js 18.x 以上
- PHP 8.0 以上
- Composer
- npm または pnpm
GitHubのこのリポジトリページで Use this template ボタンをクリックして、 Create a new repository をクリックします。
Owner、Repository nameを入力し、Choose visibilityの設定もPublicかPrivateに設定して Create repository をクリックします。
リポジトリが作成できたらクローンします。
git clone <your-repository-url>
cd <your-repository-name># Node.js の依存関係をインストール
npm install
# PHP の依存関係をインストール
composer install以下のファイルとディレクトリの project-name を実際のプロジェクト名に置き換えてください：
package.jsonのworkspacescomposer.jsonのnamewp-content/themes/project-name/ディレクトリ名- テーマディレクトリ内の
style.cssとreadme.txt
npm run wp-nowブラウザで http://localhost:8881 にアクセスしてください。
npm run wp-env startブラウザで http://localhost:8888 にアクセスしてください。
npm run devテーマの開発モードを起動します（ファイル監視、自動ビルド）。
npm run build本番用にテーマをビルドします。
| コマンド | 説明 |
|---|---|
npm run wp-now |
wp-now で開発環境を起動 |
npm run wp-env |
wp-env コマンドを実行 |
npm run dev |
開発モードでテーマをビルド |
npm run build |
本番用にテーマをビルド |
| コマンド | 説明 |
|---|---|
npm run format |
コードフォーマット（Prettier） |
npm run lint-css |
CSS/SCSS のリント |
npm run lint-css:fix |
CSS/SCSS のリント（自動修正） |
npm run lint-js |
JavaScript のリント |
npm run lint-js:fix |
JavaScript のリント（自動修正） |
npm run lint-php |
PHP のリント（WPCS） |
npm run lint-php:fix |
PHP のフォーマット（PHPCBF） |
このプロジェクトは Conventional Commits に従っています。
<type>(<scope>): <subject>
<body>
<footer>
feat: 新機能fix: バグ修正docs: ドキュメントstyle: スタイル変更（コードの動作に影響しない変更）refactor: リファクタリングperf: パフォーマンス改善test: テスト追加・修正chore: その他の変更（ビルドプロセス、ツール等）ci: CI設定build: ビルド関連
ui: UI/UX関連blocks: ブロックエディター関連functions: functions.php関連assets: アセットファイル（CSS/JS/画像）theme: テーマ設定（theme.json等）deps: 依存関係config: 設定ファイルtemplates: テンプレートファイルparts: テーマパーツstyles: スタイル関連scripts: JavaScript関連php: PHP関連
git commit -m "feat(blocks): カスタムブロックを追加"
git commit -m "fix(styles): ヘッダーのレイアウト崩れを修正"
git commit -m "docs: READMEにセットアップ手順を追加".
├── wp-content/
│ ├── mu-plugins/ # Must-Use プラグイン
│ │ ├── autoload.php # Composer autoloader
│ │ └── vendor/ # Composer 依存関係
│ └── themes/
│ └── project-name/ # ブロックテーマ
│ ├── parts/ # テーマパーツ
│ ├── templates/ # テンプレート
│ ├── theme.json # テーマ設定
│ └── style.css # メインスタイルシート
├── package.json # Node.js 依存関係
├── composer.json # PHP 依存関係
├── phpcs.xml.dist # PHP コーディング規約
├── tsconfig.json # TypeScript 設定
└── commitlint.config.js # コミット規約
- hamworks/wp-post-type: カスタム投稿タイプ管理
- hamworks/wp-taxonomy: カスタムタクソノミー管理
- WordPress Scripts: 公式の開発ツール
- WPCS: WordPress コーディング規約
- ESLint: JavaScript リント
- Prettier: コードフォーマッター
- Husky: Git Hooks 管理
- lint-staged: ステージングファイルの自動チェック