Sympal - The flexible Symfony CMS

Titre présentation | Conférencier

Sympal: The flexible Symfony CMSJonathan H. Wage

Sympal - The flexible Symfony CMS | Jonathan H. Wage

Sympal

• Collection of Symfony plugins– sfSympalPlugin

• sfFeed2Plugin• sfFormExtraPlugin• sfSuperCachePlugin• sfSympalMenuPlugin• sfSympalPagesPlugin• sfSympalPluginManagerPlugin• sfSympalUserPlugin• sfTaskExtraPlugin• sfWebBrowserPlugin


The Idea


The Idea

• The idea spawned from a need• Custom functionality in Symfony is

easy• Standard CMS functionality is not

so easy


The Idea

• A project with 75% custom functionality and 25% CMS functionality.

• The 75% custom is no problem• But what about that 25%?• It sometimes ends up taking more time

than the 75% custom!• We repeat ourselves a lot when it

comes to CMS functionality


The Idea

So the idea is to provide what something like Drupal gives you with a powerful MVC

framework and ORM under the hood.


The Idea

The name Sympal was coined by my friend and ex co-worker Josh Reynolds a few

years ago while brainstorming. Sympal was born that day and I began recording notes

and collecting code from old projects.

Symfony + Drupal = Sympal


The Idea

The code has existed in my own private repositories for a long time but not until the last few months have I started to formalize

it in to a working product and made it available to the public


Highlights


Highlights

• CLI or web installation• Menus• Breadcrumbs• Content types• Inline or backend content editing• Content slots• Plugin manager - Download/Install/Uninstall Sympal

plugins from the CLI or web browser.• Configuration controlled via YAML or a web form• Security - users, groups and permissions


Highlights

• Events• Sending E-Mail• Multiple Sites• Multiple Themes/Layouts• Internationalized URLs• Map menus to content• Change url of content without breaking old urls• SEO• Logged in user Dashboard• Uses YUI for JS framework


Installation


Installation

• Install from your browser• Or from the command line• Use in new or existing projects


Installation

• Install from your browser


Installation

• Install from the command line

• Interactive option prompts you for the same information as the browser installation

• Omit --interactive and default values will be used

$ php symfony sympal:install --interactive


Installation

• Once installed you will see the default Sympal website.


Menus


Menus

• Only requires one query• Multiple menus• Sub-menus• No matter how large or how

complex they only ever require one query.

• Menus can optionally be cached for 0 queries.


Menus

• YUI tree view for managing menus


Menus

• Drag and drop ordering


Menus

• Right click a menu leaf to manage


Menus

• Rendering menus is done with a Symfony helper

// returns instance of sfSympalMenuSite which extends sfSympalMenu$menu = get_sympal_menu('footer');

// sfSympalMenu implements __toString() which invokes renderingecho $menu;


Menus

• Use custom menu class

class myMenuClass extends sfSympalMenuSite{ }

echo get_sympal_menu('footer', true, 'myMenuClass');


Menus

• Specify global custom menu class in configuration

• Now all your menus use that class

all: sympal_config: menu_class: myMenuClass


Menus

• Core of menu system is database agnostic

• sfSympalMenu implements the basic menu functionality

• sfSympalMenuSite extends sfSympalMenu and implements the binding to the Doctrine MenuItem model


Menus

• Using sfSympalMenu standalone$menu = new sfSympalMenu('My Test Menu');

$menu->addChild('Google', 'http://www.google.com');

$sensio = $menu->addChild('Sensio', 'http://www.sensio.com');$sensio->addChild('Sensio Labs', 'http://www.sensiolabs.com');$sensio->addChild('The Symfony MVC Framework', 'http://www.symfony-project.com');$sensio->addChild('The Symfony Components', 'http://components.symfony-project.org');$sensio->addChild('The Doctrine ORM', 'http://www.doctrine-project.org');

$menu->addChild('Yahoo', 'http://www.yahoo.com');

echo $menu;

http://www.google.com

http://www.google.com

http://www.sensio.com

http://www.sensio.com

http://www.sensiolabs.com

http://www.sensiolabs.com

http://www.symfony-project.com

http://www.symfony-project.com

http://components.symfony-project.org




http://www.doctrine-project.org

http://www.doctrine-project.org

http://www.yahoo.com

http://www.yahoo.com


Menus

• Serves multiple purposes– Breadcrumbs– Admin bar menu– Floating editor panel

• Building hierarchical structure through OO interface

• Rendering HTML for the hierarchy


Menus

• Connect to events to alter these objects before they are rendered

• Sympal plugins can add items to the admin bar, menus, floating editor panel, etc.

• Install a Sympal plugin and the functionality appears in your site and is instantly available.


Menus

• The rendering of menus are done through these functions which can be overridden and customized.– render()– renderChild()– renderChildBody()– renderLink()– renderLabel()

• Rendering is split in to multiple methods to allow you to override only the pieces you need to change.


Menus

• Admin bar rendering is customized with sfSympalMenuAdminBar class

• Overrides renderChild() method so that the proper HTML is generated for YUI to work


Breadcrumbs


Breadcrumbs

• Breadcrumbs don’t require any additional queries

• Generated from the same information used for menus

• Also generated with special child class of sfSympalMenuSite named sfSympalMenuBreadcrumbs


Breadcrumbs

• Rendering breadcrumbs are done with a Symfony helper, similar to the menus

// Get the current menu item to render breadcrumbs for// Or render breadcrumbs for any Doctrine MenuItem instance$menuItem = sfSympalToolkit::getCurrentMenuItem();

// Returns instance of sfSympalMenuBreadcrumbs$breadcrumbs = get_sympal_breadcrumbs($menuItem);

echo $breadcrumbs;


Content Types


Content Types

• Sympal comes bundled with two content types– Page - Simple title and body– ContentList - Content type which allows you to specify

information to render a list of another type of content.• Specify the query• Sorting• Limit• Conditions of list, etc.• What template to render the list with


Content Types

• Easily add new content types through Sympal plugins

• Generate a new Sympal plugin that contains the skeleton for a new content type which can be installed


Content Types

• Generate the new Sympal plugin$ php symfony sympal:plugin-generate Article --content-type=Article

sfSympalArticlePlugin/ config/ doctrine/ schema.yml routing.yml sfSympalArticlePluginConfiguration.class.php data/ fixtures/ install.yml lib/ LICENSE package.xml.tmpl README


Content Types

• Inspect the generated plugin• Have a look at the default

schema.yml created---Article: actAs: [sfSympalContentType] columns: title: string(255) body: clob


Content Types

• Now we can install the generated plugin

• Installation does the following– Generates models, forms, etc. for schema– Creates tables in the database– Adds a sample content list for content type– Adds a sample content record for content type– Adds a menu item to the primary menu which is

mapped to the content list for the new content type

$ php symfony sympal:plugin-install Article


Content Types

• When we go to add new content we can now add Articles


Content Types

• We can click the menu item added to the primary menu to view the list of articles.


Content Types

• Click the sample article to view it


Content Types

• Rendering of content types utilizes Content Templates

• Use different templates to render different content types

• Use different templates to render individual content records

• By default it just uses some basic templates


Inline Editing


Inline Editing

• Sympal allows you to edit your content inline when logged in as an authorized content editor.


Inline Editing

• When you double click some content to edit the inline editor will come up


Inline Editing

• Edit model columns inline in addition to content slots


Plugin Manager


Plugin Manager

• Download, install and uninstall plugins• Works from the CLI or web browser• Sympal plugin manager tries to get a

plugin through the symfony plugin:install task first then tries to find the plugin in SVN and check it out


Plugin Manager

• From the command line


Plugin Manager

• From the web browser


Plugin Manager


Configuration


Configuration

• Controlled via YAML

all: sympal_config: menu_class: sfSympalMenuSite yui_path: http://yui.yahooapis.com/2.7.0/build super_admin_signin_url: @sympal_dashboard enable_all_modules: true admin_module_web_dir: /sfSympalPlugin load_default_css: true

http://yui.yahooapis.com/2.7.0/build

http://yui.yahooapis.com/2.7.0/build


Configuration

• Or YAML can be controlled via a web form

• When configuration form is saved the YAML file is written


Configuration

• Since the configuration uses the symfony app.yml it can be controlled at different levels of symfony– Project– Application– Module


Configuration

• Other items related to content records can be configured at different levels. For example the layout can be controlled– Globally– Per site– Per content type– Per content record

• This means you can customize the layout an individual content record uses.


Security


Security

• sfSympalUserPlugin is forked version of sfDoctrineGuardPlugin– Users– Groups– Permissions– Forgot Password– Registration

• Menus, content records, etc. can all be locked down with permissions.


Security

• List users


Security

• Edit users


Security

• List groups


Security

• Edit group


Security

• List permissions


Security

• Edit permission


Sympal Admin Generator Theme



• Sympal comes with custom admin generator them

• Tabbed forms for fieldsets and embedded forms



• Easily click Filters to popup the filters form


Floating Editor Panel


Floating Editor Panel

• When logged in as editor and viewing a content record a floating editor panel is displayed


Content Slot Types


Content Slot Types

• A content slot in Sympal is an arbitrary piece of content and has a type.

• Sympal comes bundled with a few content slot types


Content Slot Types

• The default slot types offered by Sympal are– Markdown– MultiLineText– RichText– Text

• Add your own custom slot types for your projects


YUI Rich Text Editor



• The RichText slot type uses the YUI rich text editor



• The YUI rich text editor also implements the ability to upload and embed images inline


Sending E-Mails


Sending E-Mails

• A reoccurring need• Re-implementing the functionality

over and over wasting time• We need a standard way to send

and manage our e-mail templates• Sympal offers a solution


Sending E-Mails

• In your actions you can easily create new e-mails and send them

class my_moduleActions extends sfActions{ public function executeSome_action(sfWebRequest $request) { $variables = array( 'name' => 'Jonathan H. Wage' ); $email = $this->newEmail('email_module/test', $variables); $email->send('[email protected]'); }}

mailto:[email protected]



Sending E-Mails

• The templates used for a Sympal e-mail are just a partial or component

• In the previous example we use a partial named _test.php

Hello <?php echo $name ?>,This is a test e-mail that we are sending to <?php echo $name ?>


Sending E-Mails

• The first line of the template is the subject

• The second line and after is the body of the e-mail

• This way the contents of the e-mail(subject and body) are managed in one place


Sending E-Mails

• The newEmail() method returns an instance of sfSympalMail

• sfSympalMail is a wrapper around your mail sending program which defaults to Swift in Sympal


Multiple Sites


Multiple Sites

• Sympal can handle multiple sites

• A sympal site is directly bound to a symfony application

• This is how Sympal knows which site you are in and can limit the data to only that site


Multiple Sites


Search Engine Optimization



• SEO capabilities are built in• You can specify global title,

keywords and description for your project.

• They can also be overridden by each site or even by individual content records



• sfSympalAutoSEOPlugin– Who is going to write it? :)– Automatically generate SEO for content

records from the final rendered HTML• Parse the first <h1> tag value for the meta title• Build a list of top words used in the content

record for the meta keywords• Parse the first <p> tag value for the meta

description– Write good content and you’ll have SEO


Dashboard


Dashboard

• When a user logs in and has some credentials he’ll be forwarded to his dashboard. A super administrator would see everything. Something like the below...


Dashboard

• Dashboard is generated using the sfSympalMenu classes

• The menu instance used to generate the dashboard is passed through an event so you can easily add to it by connecting to an event


Dashboard

• Connect to dashboard event and add to the menu object

class sfSympalTestPluginConfiguration extends sfPluginConfiguration{ public function initialize() { $this->dispatcher->connect('sympal.load_dashboard_boxes', array($this, 'loadDashboardBoxes') ); }

public function loadDashboardBoxes(sfEvent $event) { $menu = $event['menu']; $menu->addChild('My New Box', '@route_name'); }}


Multiple Themes


Multiple Themes

• Sympal offers the ability to have themes and you can configure in multiple places what them to use– Globally– Per site– Per content type– Or per content record


Multiple Themes

• We can now easily have Sympal theme plugins that you can download and instantly have a new theme to change to

• We already have three themes available that you can download and use– sfSympalPlugin - The default theme included with

Sympal– sfSympalJwageThemePlugin - The theme used on my

personal website, jwage.com– sfSympalDoctrineThemePlugin - The theme which

powers the Doctrine website


Multiple Themes

Doctrine Theme

Sympal Theme


Sympal CLI Tasks


Sympal CLI Tasks

• Sympal comes with some other pretty useful tasks for improving your productivity when working in Symfony


Sympal CLI Tasks

• Most notable CLI tasks– sympal:delete-model - Delete a model from your

project. Finds and deletes model, form and filter files all in one command

– sympal:report-statistics - This task will report back to the Symfony Plugins API what all plugins you’re using in your project and will add them to your stack.

– sympal:event-list - Report a list of events that are available for a URL in your application• See who has connected to an event


Sympal CLI Tasks

• Show a list of all available events for a URL


Sympal CLI Tasks

• Show only the events which have been connected to


Sympal CLI Tasks

• Inspect an individual event to see who has connected to it and more importantly where!

Sympal - The flexible Symfony CMS

Technology

Transcript of Sympal - The flexible Symfony CMS