symfonyのpluginで、wordpressの管理画面風のメニューを作成できる、「sfCssTabs」を試してみた。

サンプルとして、下記のような要領でプロジェクトを作成しています。

mkdir myapp; cd myapp

symfony init-project myapp

symfony init-app frontend

symfony init-module frontend user

symfony init-module frontend local

まずは、pluginのインストール。

今回は、ソースをsfCssTabsPlugin – symfony – Tracの最下行にある、バージョン0.1.7をダウンロードしてインストールする。

symfony plugin-install /usr/local/src/sfCssTabsPlugin-0.1.7.tgz

インストールはこれでOK。

まずは、cssをwebディレクトリにコピーしておく。

cp plugins/sfCssTabsPlugin/web/css/sfCssTabs.css web/css/

そして、apps/frontend/config/view.ymlのスタイルシートの記述に「sfCssTabs」を追記しておく。

stylesheets: [main, sfCssTabs]

あとは、plugins/sfCssTabsPlugin/config/ctSite.ymlに設定を書く。
[code]
cssTabs:
# general config
configTabs:
div: {id: navcontainer, style: ‘padding:2px’}
mt_ul: {id: adminmenu}
mt_li: {id: active}
mt_a: {class: current}
st_ul: {id: submenu}
st_li: {id: activeII}
st_a: {class: current}
# Configuration of the main Tabs
mainTabs:
– label: ‘user’
module: ‘user’
action: ‘index’
linkOptions: {}
– label: ‘local’
module: ‘local’
action: ‘index’
linkOptions: {}
# Configuration of the sub Tabs
subTabs:
– label: ‘edit’
module: ‘user’
action: ‘edit’
linkOptions: {}
parentTab: ‘user’
[/code]
configTabs:の部分は、メイン行、サブ行、それぞれのスタイルシートのid,class等を指定。mainTabs:の部分は、見てのとおりだが、labelやリンクしたい、module、actionを書く。subTabs:も同じだが、parentTab（親となるtab）を指定する必要がある。

あとは、テンプレートのレイアウトファイル(apps/frontend/template/layout.php)などで、
[php]
render(); ?>
[/php]
をbodyの先頭のほうで呼んであげればよい。

できたのがこんな感じ。

簡単だ。

デザインを気にしない、社内用の管理画面とかで簡単なメニューを作成するのに、便利かもしれない。