カスタムテーマ
プロジェクト内の 1 つまたはすべてのストアとサイトに使用する 1 つまたは複数のテーマをインストールできます。 テーマには、ストアを完全にデザインするために、画像、フォント、CSS、JavaScript、PHP など、複数の静的ファイルが含まれます。 テーマを追加するには、コードをファイルシステムに抽出するか、Composer を使用します。
テーマを手動でインストール
テーマを手動でインストールするには、テーマのコードを圧縮されたアーカイブまたは次のようなディレクトリ構造にする必要があります。
<VendorName>
├── composer.json
├── etc
│ └── view.xml
├── media
├── registration.php
├── theme.xml
└── web
├── css
│ └── source
├── fonts
├── images
└── js
テーマを手動でインストール:
-
の下にテーマのコードをコピーします。
<Project root dir>/app/design/frontend
ストアフロントのテーマの場合はまたは<Project root dir>/app/design/adminhtml
管理テーマの場合。 最上位ディレクトリがであることを確認<VendorName>
。そうでない場合、テーマが正しくインストールされません。code language-bash cp -r ExampleTheme <project-root>/app/design/frontend
-
正しい場所にコピーされたテーマを確認します。
- ストアフロントのテーマ:
ls <project-root>/app/design/frontend
- 管理テーマ:
ls <project-root>/app/design/adminhtml
次に例を示します。
ExampleTheme Adobe Commerce
- ストアフロントのテーマ:
-
ファイルの追加とコミット
code language-bash git add -A && git commit -m "Add theme"
-
ファイルをブランチにプッシュします。
code language-bash git push origin <branch name>
-
デプロイメントが完了するまで待ちます。
-
管理者にログインします。
-
クリック コンテンツ > デザイン > テーマ.
テーマが右側のパネルに表示されます。
Composer を使用したテーマのインストール
Composer を使用してテーマをインストールする方法は、Composer を使用して他の拡張機能をインストールする方法と同様です。 参照: モジュールのインストール、管理、アップグレード を参照してください。
Composer を使用してテーマをインストールするには:
-
テーマをCommerce Marketplaceから購入します。
-
テーマのコンポーザー名を取得します。
-
Adobe Commerceのルートディレクトリに移動して、コマンドを入力します。
code language-bash composer require <vendor>/<name>:<version>
以下に例を挙げます。
code language-bash composer require zero1/theme-fashionista-theme:1.0.0
-
依存関係が更新されるのを待ちます。
-
次のコマンドを入力します。
code language-bash git add -A && git commit -m "Add theme"
code language-bash git push origin <branch name>
-
管理者にログインします。
-
クリック コンテンツ > デザイン > テーマ.
テーマが右側のパネルに表示されます。
複数のテーマ
ロケールごとに異なるテーマを使用するなど、複数のテーマを使用する場合、 SCD_MATRIX
テーマのデプロイメントをカスタマイズするための環境変数。 を参照してください。 ビルド または deploy のステージ 環境設定.