Warning! Maintenance of this repository will stop on the 30th of april 2015. The repository will then be removed from the account real-chocopanda.
This branch use Bootstrap 2.0 for Bootstrap 1.4 switch to 1.0 branch
This symfony1 plugin provides a dashboard/menu and a theme for the admin generator for your backend. It is based on the Twitter Bootstrap. It works with Propel or Doctrine. The generated dashboard/menu is based on the great sfAdminDashPlugin.
For a Propel
use, you will have to install sfPropelORMPlugin instead of sfPropelPlugin.
You might need sfGuardPlugin (or sfDoctrineGuardPlugin) for the user management.
Preview of list:
Preview of edit:
Preview of show (with support of partials on the right, see below):
Preview of login:
In config/ProjectConfiguration.class.php
class ProjectConfiguration extends sfProjectConfiguration
{
public function setup()
{
$this->enablePlugins('sfTwitterBootstrapPlugin');
...
In apps/backend/config/view.yml
default:
stylesheets:
- /sfTwitterBootstrapPlugin/bootstrap/docs/assets/css/bootstrap.css # compiled css are now in the docs
- /sfTwitterBootstrapPlugin/css/font-awesome/css/font-awesome.min.css
- /sfTwitterBootstrapPlugin/css/style.css
- /sfTwitterBootstrapPlugin/css/jquery-ui.min.css
- main.css
javascripts:
- "/sfTwitterBootstrapPlugin/bootstrap/js/bootstrap-dropdown.js"
- "/sfTwitterBootstrapPlugin/bootstrap/js/bootstrap-tooltip.js"
- "/sfTwitterBootstrapPlugin/bootstrap/js/bootstrap-scrollspy.js"
- "/sfTwitterBootstrapPlugin/bootstrap/js/bootstrap-modal.js"
- "/sfTwitterBootstrapPlugin/bootstrap/js/bootstrap-alert.js"
- "/sfTwitterBootstrapPlugin/js/application.js"
- "/sfTwitterBootstrapPlugin/js/bootbox/bootbox.min.js"
- /sfTwitterBootstrapPlugin/js/jquery-ui.min.js
layout: %SF_PLUGINS_DIR%/sfTwitterBootstrapPlugin/templates/layout
If you want to active colors by env add stylesheet :
default:
stylesheets:
- /sfTwitterBootstrapPlugin/css/color-my-env.css
In apps/backend/config/app.yml
all:
sf_twitter_bootstrap:
site: Your project name
# if you want top links to fieldset legend in new/edit page (like "Admin & Content" in the edit screenshot)
top_link_to_fieldset: true
# if you *also* want to display the pagination on top of the list
display_top_pagination: true
In apps/backend/config/settings.yml
all:
.settings:
enabled_modules: [default, sfTwitterBootstrap, ...]
Configure the form formatter :
In apps/backend/config/backendConfiguration.class.php
class backendConfiguration extends sfApplicationConfiguration
{
public function configure()
{
sfWidgetFormSchema::setDefaultFormFormatterName('TwitterBootstrap');
}
}
Change the theme value to :
generator:
...
param:
...
theme: twitter
...
Edit app.yml
:
all:
sf_twitter_bootstrap:
...
# display bootstrap icon before text in all button
use_icons_in_button: true
In your generator.yml
you can now add a custom icon to your button. Just add a icon
parameter to the new action.
generator:
...
config:
...
list:
actions:
...
newListActions: {label: "New list action", icon: "icon-download"}
object_actions:
...
newObjectActions: {label: "New object action", icon: "icon-asterisk"}
edit:
...
actions:
...
newFormActions: {label: "New form action", icon: "icon-comment"}
Edit generator.yml
generator:
...
param:
...
with_show: true
The displayed fields can be customized exactly like the edit fields, with a show
section:
generator:
...
config:
show:
display: [id, lastname, firstname, surname, _country, gender, _sports, is_active, has_historic]
To include a show
link in each line of the list view, use the _show
object action:
generator:
...
config:
list:
object_actions:
...
_show: { action: _show }
generator:
...
config:
...
edit:
...
partial: ['module/partial']
Some partials are bundeled with the plugin :
- versionable:
propel_behaviors/versionable_version_list
- auditable:
propel_behaviors/auditable_log_list
missing : Timestampable, Geocodable, I18n, Taggable, Ratable, Commentable, NestedSet, Sluggable
Unfortunately, Doctrine doesn't add cool method to retrieve information from its behavior, like Propel did.
Edit view.yml
default:
components:
sf_twitter_bootstrap_permanent_slot: [ Module, component ]
In your form class :
$formatterObj = $this->widgetSchema->getFormFormatter();
$formatterObj->setValidatorSchema($this->getValidatorSchema());
Of course, if you are using an admin generator it's automatic !
Overwrite the signinSuccess into apps/backend/modules/sfGuardAuth/templates/signinSuccess.php
<?php include_partial('sfTwitterBootstrap/login', array('form' => $form)); ?>
You can follow Step 3 to Step 5 from the readme file of sfAdminDashPlugin to setup dashboard / menu items.
We use different icons in comparison to sfAdminDash. Check the folder images
.
An additional parameter is available, edit app.yml
all:
sf_twitter_bootstrap:
...
# string used as root of breadcrumb
breadcrumb_root_name: Home
#####Configure the menu items##### In addition to Step 5, you can add "menu division" or "menu header" (see more information http://twitter.github.com/bootstrap/components.html#navbar).
The best way to show how to use this parameters is with an example:
#in application/config/app.yml
all:
sf_twitter_bootstrap:
items:
Articles:
url: article
image: book.png
credentials: [[admin, publisher]]
divider: true #menu division
Comments:
url: comment
image: textcloud.png
credentials: [admin]
nav-header: Comments #menu header
sub-items:
Tag:
url: tag
image: tag.png
credentials: [[admin, publisher]]
We often need to extends form display in the admin generator to display additional information or a plain text field, etc .. To do that, you need to indicate a partial in generator.yml (like _member_id
) and use this template to have a nice render :
<div class="control-group sf_admin_form_row sf_admin_text">
<label class="control-label" for="member_id">Member</label>
<div class="controls">
<?php echo $form['member_id']->render(); ?>
<div class="input-plain">» <?php echo $form->getObject()->getMember() ?></div>
</div>
</div>
Of course, you will have to edit it (and replace php action with yours) but keep the html structure.