an introduction to the symfony cmf - creating a cms on top of symfony

An  introduc+on  to  

Presented  by  Roel  Sint  

Agenda  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   2  

Content  •  Page  •  Blocks  •  Structure  

Management    •  User  •  Frontend  •  Backend  •  Publishing  

workflow  

Framework    •  Storage  •  ContentBundle  •  BlockBundle  •  Rou+ng  

•  Component  •  Bundle  •  Auto  

•  Menu  •  Core  •  Create  

Decoupled  CMS  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   3  

vs  

Create  a  CMS  1.  Install  Symfony  and  bootstrap  template  2.  Install  Cmf  3.  Add  fixtures  and  content  4.  Add  auto  rou+ng  5.  Update  templates  6.  Add  cache  7.  Add  backend  CMS  8.  Add  frontend  edi+ng  tool  9.  Add  media,  media  browser  and  imagine  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   4  

Step  1  –  install  Symfony  

•  Start  a  new  Symfony  project:  – php  composer.phar  create-­‐project  symfony/framework-­‐standard-­‐edi+on  path/  

•  Add  twiXer  bootstrap  theme  – download  from  ini+alizr  project  

•  Implement  templates  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   5  

Step  1  -­‐  ini+alizr  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   6  

Step  1  -­‐  bootstrap  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   7  

Step  1  –  home  template  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   8  

Banner    block  

Homepage    blocks  

Step  1  –  page  template  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   9  

url  

breadcrumb  

main  menu  

submenu  

Step1  -­‐  AcmeMainBundle  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   10  

Step  2  –  install  cmf  

•  php  composer.phar  require  symfony-­‐cmf/symfony-­‐cmf  •  1.0.*  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   11  

Step  2  –  AppKernel  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   12  

Step  2  –  config.yml  +  autoload  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   13  

Step  2  –  setup  database  •  Setup:  

–  app/console  doctrine:database:create  –  app/console  doctrine:phpcr:init:dbal  –  app/console  doctrine:phpcr:repository:init  

•  Check  :  –  app/console  doctrine:phpcr:node:dump  –  also  the  database  

•  Storage  using  PHP  Content  Repository  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   14  

xml  

What  is  a  content  repository?  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   15  

PHPCR  using  Doctrine  ODM  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   16  

Step  3  –  add  fixtures  and  content  

•  php  composer.phar  require  doctrine/data-­‐fixtures  – 1.0.0  

•  Add  page  document  •  Create  pages  root  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   17  

Step  3  –  add  fixtures  and  content  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   18  

Step  3  –  add  fixtures  and  content  

•  Run:  – app/console  doctrine:phpcr:repository:init  – app/console  doctrine:phpcr:fixtures:load  

•  Check:  – app/console  doctrine:phpcr:node:dump  —props  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   19  

Step  3  –  add  fixtures  and  content  

•  Run:  – app/console  doctrine:phpcr:repository:init  – app/console  doctrine:phpcr:fixtures:load  

•  Check:  – app/console  doctrine:phpcr:node:dump  —props  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   20  

Step  4  –  add  auto  rou+ng  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   21  

Step  4  –  add  auto  rou+ng  •  php  composer.phar  require  symfony-­‐cmf/rou+ng-­‐auto-­‐bundle  

–  1.0.*@dev  

•  add  to  kernel  •  add  rou+ng_auto.yml  •  remove  routes  from  fixtures  •  Run:    

–  app/console  doctrine:phpcr:fixtures:load  

•  Check:    –  app/console  doctrine:phpcr:node:dump  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   22  

Step  4  –  add  auto  rou+ng  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   23  

Step  5  –  update  templates  

•  Homepage  – add  blocks  to  template  – add  fixtures  and  run:  

•  app/console  doctrine:phpcr:fixtures:load  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   24  

Step  5  –  update  templates  

•  Homepage  – add  blocks  to  template  – add  fixtures  and  run:  

•  app/console  doctrine:phpcr:fixtures:load  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   25  

Container  block  

Step  5  –  update  templates  

•  Page  template  •  Use  knp_menu_render  for:  – Breadcrumb  – Main  menu  – Sub  menu  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   26  

Step  5  –  update  templates  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   27  

breadcrumb  

submenu  

content  

Step  5  –  update  templates  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   28  

AcmeMainBundle:Nav:breacrumbs.html.twig  

Step  6  –  add  cache  •  php  composer.phar  require  liip/doctrine-­‐cache-­‐bundle  

–  1.0.*  •  Add  to  kernel  •  Update  config.yml  

•  Check  queries  in  the  webdebug  toolbar  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   29  

Step  7  –  backend  CMS  •  php  composer.phar  require  sonata-­‐project/doctrine-­‐phpcr-­‐admin-­‐bundle  

–  1.0.*  

•  add  to  AppKernel  

•  run:  app/console  assets:install  web  —symlink  •  secure  admin  in  security.yml  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   30  

Step  7  -­‐  config  

•  uncomment  framework.translator  

•  add  sonata  •  add  routes  to  rou+ng.yml  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   31  

Step  7  -­‐  config  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   32  

Step  7  -­‐  config  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   33  

Step  7  -­‐  ckeditor  

•  php  composer.phar  require  trsteel/ckeditor-­‐bundle  –  1.2.*  

•  add  to  AppKernel  •  update  PageAdmin  to  use  ckeditor  field  •  Run:  – app/console  assets:install  web  –symlink  – app/console  asse+c:dump  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   34  

Step  7  -­‐  ckeditor  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   35  

Step  7  –  Publish  workflow  

•  Enable  publish  workflow  in  cmf_core  •  Menu  •  Page  •  Blocks  •  Hide  menu  when  page  is  not  published  – Custom  MenuContentVoter  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   36  

Step  7  –  backend  cms  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   37  

Hide  for  customers  

Step  7  –  backend  cms  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   38  

Step  7  –  backend  cms  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   39  

Step  8  –  frontend  edi+ng  •  php  composer.phar  require  symfony-­‐cmf/create-­‐bundle  

–  1.0.*  •  add  to  AppKernel  •  update  config  •  add  rdf-­‐mapping  •  template:  

–  update  page  –  add  stylesheets  and  javascript  

•  run:  –  app/console  assets:install  web  –symlink  –  app/console  asse+c:dump  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   40  

Step  8  –  frontend  edi+ng  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   41  

page  template  

rdf  mapping  

Step  8  –  frontend  edi+ng  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   42  

Step  9  -­‐  media  •  add  to  composer.json:  –  "symfony-­‐cmf/media-­‐bundle":  "1.0.*”  –  "liip/imagine-­‐bundle":  "v0.16.0”  –  "helios-­‐ag/fm-­‐elfinder-­‐bundle":  "1.4”  

•  run:    –  composer  update  symfony-­‐cmf/media-­‐bundle  liip/imagine-­‐bundle  helios-­‐ag/fm-­‐elfinder-­‐bundle  

–  app/console  doctrine:phpcr:repository:init  •  add  ROLE_CAN_UPLOAD_FILE  to  security.yml  •  update  config:  –  configure  image  upload  url  and  file  browse  url  –  liip  imagine  filters  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   43  

Step  9  -­‐  media  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   44  

Where  do  I  …  ?  •  Book  documenta+on:  general  explana+on  •  Bundle  documenta+on:  reference  for  features  •  Cookbooks  •  Configura+on  

–  Reference  sec+on  symfony.com  –  Run:  

•  app/console  config:dump-­‐reference  CmfCoreBundle  •  app/console  router:debug  •  app/console  container:debug  

–  Code:  •  vendor\symfony-­‐cmf  •  DependencyInjec+on\Configura+on  •  DependencyInjec+on\[name]Extension  •  Resources\config  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   45  

Links  •  github.com/rmsint/cmf-­‐intro  

•  homepage  cmf.symfony.com  

•  doctrine-­‐project.org  for  PHPCR-­‐ODM  

•  See  also  cookbook  Crea+ng  a  Basic  CMS  

•  slides.liip.ch/sta+c/2012-­‐05-­‐18_symfony-­‐speed.html  

•  ask  ques+ons  on  irc:  #symfony-­‐cmf  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   46  

Conclusion  

•  toolbox  to  create  your  own  CMS  •  code  reuse  exis+ng  projects  •  many  steps  because  everything  is  decoupled  •  different  CMS  for  different  purpose  possible  •  automate  steps  for  produc+on  – create  installa+ons  

•  blog  •  cms  

8  november  2013   Roel  Sint  -­‐  github.com/rmsint/cmf-­‐intro   47