Eccentric | デバッグライフ

Twiiter BootstrapベースのWordPressのテーマ Eccentric です。

以下のような特徴があります。

コンテンツのレイアウトの変更
サイドバーレイアウトの変更
レスポンシブルデザイン
構造化データ（Microdata or JSON-LD）
ページテンプレート
1. Scrollspy
カスタマイズ
1. テーマディレクトリ構造
2. controller
Customize build-in layout
ダウンロード
1. 規約

コンテンツのレイアウトの変更

デフォルトで以下の３つのレイアウトから選択できます。magazineとboxについては、カラムの数を選択できます。

サイドバーレイアウトの変更

サイドバーの位置を左右及びなしから選択できます。

レスポンシブルデザイン

bootstrapをベースにしているのでレスポンシブルにも対応しています。

構造化データ（Microdata or JSON-LD）

一部頑張って対応しています。

その他いくつかのオプションがあります。本サイトのテーマもこのテーマを利用しています。

ページテンプレート

Scrollspy

マニュアルページなどで利用すれば、Scrollspyで目次が常にサイドエリアに表示されるため、目的の見出しにすぐにジャンプすることができます。

カスタマイズ

テーマディレクトリ構造

controller  tiny-wpdkのcontroller
css         style.css等以外のcss
img         画像
js          javascript
languages   i18n対応
sass        sassファイル
tiny-wpdk   tiny-wpdk framework
view        各種テンプレート
layout.php  メインレイアウト
functions.php
...

controller tiny-wpdkのcontroller

css style.css等以外のcss

img 画像

js javascript

languages i18n対応

sass sassファイル

tiny-wpdk tiny-wpdk framework

view 各種テンプレート

layout.php メインレイアウト

functions.php

...

tiny-wpdk

controller

各種is_xxx系関数（ex: is_single）で呼びされるControllerファイルがあります。このクラスで定義されたインスタンスメンバは、テンプレート内で変数またはオブジェクト経由で参照することが可能です。

class PageController extends ApplicationController
{
/**
* Hook for wp action
* 
* @see https://codex.wordpress.org/Plugin_API/Action_Reference/wp
* @param <WP> $wp
*/
public function wp_action__wp($wp)
{
$this->var = "var has been defined in PageController";
}
}

class PageController extends ApplicationController

{

/**

* Hook for wp action

* @see https://codex.wordpress.org/Plugin_API/Action_Reference/wp

* @param <WP> $wp

public function wp_action__wp($wp)

{

$this->var = "var has been defined in PageController";

}

この時、テンプレートでは以下のように変数を参照できます。

<?php echo $var // var has been defined in PageController ?>
<?php echo $param->get('var', 'default value') // var has been defined in PageController ?>

1 2	<?php echo $var // var has been defined in PageController ?> <?php echo $param->get('var', 'default value') // var has been defined in PageController ?>

Customize build-in layout

デフォルトで３つのレイアウトが用意されていますが、任意のレイアウトを追加することも可能です。以下のようにオリジナルのテーマファイルを作成し、Eccentric設定画面で選択項目に追加します。

view/layout-container-main-<your original theme name>.phpを作成

管理画面の設定に追加（view/admin/index.php）

<td>
<p>
<label for="mainLayoutMyTheme">
<input id="mainLayoutMyTheme" name="mainLayout" type="radio" value="box" <?php checked('mytheme', $options->get('mainLayout')); ?>> box
<img src="<?php bloginfo('template_url') ?>/img/mytheme.png" width="150" alt="main-mytheme" class="layout-img">
</label>
</p>
</td>