> For the complete documentation index, see [llms.txt](https://docs.cs-cart.jp/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.cs-cart.jp/theme-development/parent-themes.md).

# 親テーマ

{% hint style="info" %}
HINT

この機能は、CS-Cart4.4.1以降で使用できます。
{% endhint %}

## 概要

`manifest.json`ファイルで`parent_theme`にテーマYが指定されている場合、テーマXは依存テーマ（子テーマとも呼ばれます）であり、テーマYは親テーマです。

子テーマには、親テーマのファイルとは異なるファイルのみが含まれます。\
子テーマは、必要に応じて親テーマのコンテンツ（テンプレート、ロゴなど）を使用します。

* 親テーマおよび子テーマのcss、media、およびtemplatesフォルダーは、実行時にマージされます。
* 子テーマにファイルがない場合、代わりに親テーマの対応するファイルが使用されます。
* 子テーマに、親テーマにないファイルがある場合（商品および商品リストテンプレート、ブロックのラッパー、静的テンプレートなど）、それらは親テーマのファイルとともにリストされます。
* ファイルが子テーマと親テーマの両方に存在する場合、子テーマのファイルが優先されます。
* テーマのレイアウトおよびスタイルフォルダーはマージされません。
* 子テーマに独自のレイアウトがある場合は、それらのみが使用されます。それ以外の場合は、親テーマのレイアウトが使用されます。
* 子テーマは常に独自のスタイルを使用します。
* `$images_dir`変数を使用して、親テーマから画像をロードできます。
* テーマに親がある場合、`$images_dir` は、Smartyテンプレートでの使用は、親テーマの`media/images`ディレクトリを指します。
* テーマに親がない場合、テーマは$images\_dirの独自の`media/images`ディレクトリを指します。

{% hint style="info" %}
HINT

`$self_images_dir`変数を使用して、テーマの独自の`media/images`ディレクトリを指すことができます。
{% endhint %}

## テーマの複製

* 元のテーマに親がない場合、そのファイルは複製されたテーマのディレクトリにコピーされません。
* 複製されたテーマには、`manifest.json`ファイルと、テーマロゴ付きの\_/media/images/\_ディレクトリのみが含まれます。
* 元のテーマに親がある場合、元のテーマのコンテンツ全体が複製されたテーマのディレクトリにコピーされます。

## テーマのインストール

親テーマのファイルは、子テーマのインストール中に子テーマのファイルとマージされません。\
子テーマのファイルのみが`var/themes_repository`から`design/themes`にコピーされます。

## テーマファイルのアップグレード

アップグレードセンターは、カスタムテーマのファイルをアップグレードしません。ショップのアップグレード時には、レスポンシブテーマと基本テーマのみが影響を受けます。

## アドオンファイルのインストール

アドオンのテーマ関連ファイル（スタイル、テンプレートなど）は、作成されたテーマのみにインストールされ、子テーマにはインストールされません。

例えば、`var/themes_repository/responsive/templates/addons/[addon名]`のみにコピーされます。`design/themes/responsive/templates/addons/[アドオン名]`

基本テーマにのみテンプレートファイルを提供するアドオンは、基本テーマとそれに依存する子テーマでのみ使用できます。必要なテンプレートが現在のテーマにない場合、CS-CartはBasicテーマのテンプレートにフォールバックしません。

## レスポンシブテーマからTPLフックを使用する

レスポンシブテーマの親ではない場合でも、すべてのテーマでレスポンシブテーマのテンプレートフックのハンドラーを使用できます。このように、レスポンシブテーマ専用のテンプレートを提供するアドオンは、他のテーマとある程度連携できます。

次のファイルとディレクトリの構造があると仮定します。

```
design
└── themes
    ├── child
    │   └── templates
    │       └── addons
    │           └── styles_fixer
    │               └── hooks
    │                   └── index
    │                       └── styles.post.tpl
    ├── parent
    │   └── templates
    │       └── addons
    │           └── styles_fixer
    │               └── hooks
    │                   └── index
    │                       └── styles.post.tpl
    └── responsive
        └── templates
            └── addons
                └── styles_fixer
                    └── hooks
                        └── index
                            └── styles.post.tpl
```

アクティブなテーマはchildであり、親テーマに依存します。この場合、CS-Cartは`index:styles`、テーマのハンドラーを次の順序で検索します：子→親→レスポンシブ。\
最初に見つかったハンドラーが使用されます。

{% hint style="info" %}
HINT

レスポンシブテーマがショップにインストールされていない場合、TPLフックハンドラーの検索はレスポンシブテーマで実行されません。
{% endhint %}

＜画像＞