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に設定を書く。
-
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'
configTabs:の部分は、メイン行、サブ行、それぞれのスタイルシートのid,class等を指定。mainTabs:の部分は、見てのとおりだが、labelやリンクしたい、module、actionを書く。subTabs:も同じだが、parentTab（親となるtab）を指定する必要がある。
あとは、テンプレートのレイアウトファイル(apps/frontend/template/layout.php)などで、
をbodyの先頭のほうで呼んであげればよい。
できたのがこんな感じ。
簡単だ。
デザインを気にしない、社内用の管理画面とかで簡単なメニューを作成するのに、便利かもしれない。
Check Tweet
