PHPackages                             pickles2/px2-multitheme - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. pickles2/px2-multitheme

ActiveLibrary

pickles2/px2-multitheme
=======================

px2-multitheme は、複数のテーマを同時に管理する機能を Pickles 2 に追加します。

2.2.0(9mo ago)010.0k↑200%120MITPHPPHP >=7.3.0

Since Mar 4Pushed 9mo ago1 watchersCompare

[ Source](https://github.com/pickles2/px2-multitheme)[ Packagist](https://packagist.org/packages/pickles2/px2-multitheme)[ RSS](/packages/pickles2-px2-multitheme/feed)WikiDiscussions main Synced 1mo ago

READMEChangelog (4)Dependencies (8)Versions (18)Used By (20)

pickles2/px2-multitheme
=======================

[](#pickles2px2-multitheme)

    Linux Windows     master  [![](https://camo.githubusercontent.com/9d9ca913f30d1e3470b02ea3198d3e415449cb3ae1eabd44634a812756e28c17/68747470733a2f2f7365637572652e7472617669732d63692e6f72672f7069636b6c6573322f7078322d6d756c74697468656d652e7376673f6272616e63683d6d6173746572)](https://travis-ci.org/pickles2/px2-multitheme)   [![](https://camo.githubusercontent.com/4cc43ab5118cc348a52e5ae9652e196f4126d87a4d4752f1b52556326a538d75/68747470733a2f2f63692e6170707665796f722e636f6d2f6170692f70726f6a656374732f7374617475732f303468346f383263756176786d6b776b2f6272616e63682f6d61737465723f7376673d74727565)](https://ci.appveyor.com/project/tomk79/px2-multitheme)    develop  [![](https://camo.githubusercontent.com/a149662be89389654454f12920493dda31f37fcf8b1a48b0f86304cafc37b896/68747470733a2f2f7365637572652e7472617669732d63692e6f72672f7069636b6c6573322f7078322d6d756c74697468656d652e7376673f6272616e63683d646576656c6f70)](https://travis-ci.org/pickles2/px2-multitheme)   [![](https://camo.githubusercontent.com/2f23a8a26f7382fb8a22a37e38bc48b38f56e848272bec48cabee55507e56585/68747470733a2f2f63692e6170707665796f722e636f6d2f6170692f70726f6a656374732f7374617475732f303468346f383263756176786d6b776b2f6272616e63682f646576656c6f703f7376673d74727565)](https://ci.appveyor.com/project/tomk79/px2-multitheme)   *px2-multitheme* は、複数のテーマを同時に管理する機能を [Pickles2](http://pickles2.pxt.jp/) に追加します。

導入方法 - Setup
------------

[](#導入方法---setup)

Pickles 2 をセットアップします。

`composer.json` と同階層に移動し、次のコマンドを実行します。

```
composer require pickles2/px2-multitheme

```

次に、`px-files/config.php` に設定を記述します。

```
$conf->funcs->processor->html = [
	// テーマ
	'theme'=>'tomk79\pickles2\multitheme\theme::exec' ,
];
```

コンフィグオプション - Config Options
---------------------------

[](#コンフィグオプション---config-options)

### テーマ切り替えのパラメータ名 - param\_theme\_switch

[](#テーマ切り替えのパラメータ名---param_theme_switch)

テーマ切り替えスイッチとして使用するGETパラメータ名を設定します。デフォルトは `THEME` です。

### テーマ名を記憶するクッキー名 - cookie\_theme\_switch

[](#テーマ名を記憶するクッキー名----cookie_theme_switch)

切り替えたテーマ名を記憶するクッキー名を設定します。デフォルトは `THEME` です。

### レイアウト切り替えのパラメータ名 - param\_layout\_switch

[](#レイアウト切り替えのパラメータ名---param_layout_switch)

レイアウト切り替えスイッチとして使用するGETパラメータ名を設定します。デフォルトは `LAYOUT` です。

### テーマコレクションディレクトリ - path\_theme\_collection

[](#テーマコレクションディレクトリ---path_theme_collection)

テーマ格納ディレクトリのパスを設定します。 相対パスの起点は、`.px_execute.php` が置かれているパスです。

初期値は `./px-files/themes/` です。

px2-multitheme はこのディレクトリの他にも、vendor ディレクトリにロードされたパッケージの一覧を検索し、theme が実装されたパッケージを選択候補に加えます。

### bowl名(コンテンツエリア名)を格納する属性名 - attr\_bowl\_name\_by

[](#bowl名コンテンツエリア名を格納する属性名---attr_bowl_name_by)

Pickles2DesktopTool のGUI編集機能に対応する設定です。Pickles2DesktopTool は、ここに設定した属性の値からbowl名を取得し、GUI編集画面の構成するように振る舞います。 デフォルトは `data-contents-area` です。

### デフォルトのテーマID - default\_theme\_id

[](#デフォルトのテーマid---default_theme_id)

デフォルトで適用するテーマのIDです。初期値は `default` です。

テーマコレクションディレクトリに定義されたテーマを指定する場合は `theme_id` などの様にディレクトリ名を、composerパッケージからテーマを指定する場合は `vendorname/packagename` のように、スラッシュで区切られたパッケージ名を設定します。

### オプション - options

[](#オプション---options)

テーマが個別に定義するオプション値を設定します。 設定できるオプションはテーマによって異なります。詳しくは各テーマのドキュメントを参照してください。

### コンフィグオプションの実装例 - Config Sample

[](#コンフィグオプションの実装例---config-sample)

```
$conf->funcs->processor->html = [
	// テーマ
	'theme'=>'tomk79\pickles2\multitheme\theme::exec('.json_encode([
		'param_theme_switch'=>'THEME',
		'cookie_theme_switch'=>'THEME',
		'param_layout_switch'=>'LAYOUT',
		'path_theme_collection'=>'./px-files/themes/',
		'attr_bowl_name_by'=>'data-contents-area',
		'default_theme_id'=>'pickles2',
		'options'=>array(
			'pickles2'=>array( // テーマ pickles2 に対するオプション
				'sample_param'=>'hoge' // テーマ側からは、 `$theme->get_option('sample_param')` で受け取ることができます。
			)
		)
	]).')'
];
```

テーマの実装
------

[](#テーマの実装)

各テーマは、テーマコレクションディレクトリの直下にディレクトリとして設置します。 例えば、 `sample` という名前のテーマは、 ディレクトリ `/sample/` の中に実装されます。

テーマディレクトリの直下には、 `(レイアウト名).html` という命名規則で、複数のレイアウトを定義できます。

規定のレイアウトは、 `default.html` (=デフォルト), `popup.html`, `top.html`, `plain.html`, `naked.html` があり、 サイトマップCSV の `layout` 列に名前を指定して選択します。この使い方については、Pickles 2 のドキュメントを参照してください。

### テーマレイアウトで使える主なAPI

[](#テーマレイアウトで使える主なapi)

#### Pickles 2 の API

[](#pickles-2-の-api)

Pickles 2 が提供するAPIのうち、テーマの実装でよく利用するAPIには、次のものがあります。 詳しい使い方は、Pickles 2 の [APIドキュメント](http://pickles2.pxt.jp/phpdoc/) を参照してください。

- `$px->href()`
- `$px->mk_link()`
- `$px->conf()`
- `$px->bowl()->pull()`
- `$px->site()->get_current_page_info()`
- `$px->site()->get_children()`
- `$px->site()->is_page_in_breadcrumb()`
- `$px->site()->path_plugin_files()`
- `$px->site()->get_category_top()`

#### px2-multitheme が提供する API

[](#px2-multitheme-が提供する-api)

Pickles 2 にある機能の他に、 px2-multitheme の独自のAPIも提供されます。

- `$theme->get_option()`
- `$theme->get_layout()`
- `$theme->get_attr_bowl_name_by()`
- `$theme->files()`
- `$theme->mk_global_menu()`
- `$theme->mk_shoulder_menu()`
- `$theme->mk_sub_menu()`
- `$theme->mk_megafooter_menu()`
- `$theme->mk_breadcrumb()`

### theme\_files

[](#theme_files)

テーマフォルダの直下に ディレクトリ `theme_files/` を設置すると、ここにテーマ固有のリソースファイル(画像やCSSなど)を置くことができます。

`theme_files` に置かれたファイルは、 Pickles 2 の公開キャッシュディレクトリ(デフォルトでは `/caches/*`) の中に複製が作られ、ブラウザから参照できるようになります。

テーマからこれらのファイルを呼び出す場合、次のように実装してください。

```
'theme_files/hoge/fuga.png' を呼び出す