Use Symfony2 components inside WordPress (…and live happily)
Walter Dal Mut  Cofounder at Corley S.r.l.  First level degree Electronic Engineering  Ungraduated student of Computer Science Maurizio Pelizzone  Cofounfer at Mavida S.n.c  WordPress Lover
Symfony2 is a reusable set of standalone, decoupled, and cohesive PHP components that solve common web development problems Fabien Potencier http://fabien.potencier.org/article/49/what-is-symfony2
Use Composer autoload in your theme
WordPress & Monolog
Monolog is a logging library for PHP 5.3 used by Symfony2. It is inspired by the Python LogBook library.
Get Monolog Website: https://github.com/Seldaek/monolog Using Monolog: Create a new composer.json file { "require": { "monolog/monolog": "1.1.*" } } curl -s http://getcomposer.org/installer | php php composer.phar install
wrap inside WordPress…
… and use in your theme
WordPress & Assetic
Assetic is an asset management framework for PHP. Assetic is based on the Python webassets library
Get Assetic Website: https://github.com/kriswallsmith/assetic Using Assetic: Create a new composer.json file { "require": { "kriswallsmith/assetic": "v1.0.4" } } curl -s http://getcomposer.org/installer | php php composer.phar install
GOAL: Merge, Minimize and Compile all javascript loaded through WordPress
Code example: https://github.com/miziomon/symfonyday
WordPress & Twig
Twig: the flexible, fast, and secure template engine for PHP. Twig uses a syntax similar to the Django and Jinja template languages which inspired the Twig runtime environment.
Why using a Template Engine ?
PHP doesn't support many features modern template languages should have nowadays o Concision o Template oriented Syntax o Reusability o "Security" by default  I'll explain in the next slides  Read more on dedicated webpages. Read more at: http://fabien.potencier.org/article/34/templating-engines-in-php
Concision PHP TWIG <?php echo $name ?> {{name}} <?php echo {{name|escape}} htmlspecialchars( $name, ENT_QUOTES, No short version it's 'UTF-8') already the short ?> Short tags version. <?=$name?> Using short tags could creates problems. You have to enable the short tags that are disabled by default.
Template oriented Syntax PHP TWIG <?php if ($items): ?> {% for item in items %} <?php foreach ($items as $item): ?> * {{ item }} * <?php echo $item ?> {% else %} <?php endforeach; ?> No item has been found. <?php else: ?> {% endfor %} No item has been found. <?php endif; ?> It's more clear and use a new syntax.
Reusability <!-- base.html --> <!-- index.html --> <html {% extends "base.html" %} xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> {% block head %} <head> {{ block.super }} {% block head %} <link rel="stylesheet" href="main.css" /> <link rel="stylesheet" href="main.css" /> {% endblock %} {% endblock %} </head> {% block content %} <body> Index content {% block content %}{% endblock %} {% endblock %} </body> </html>
Security " I'm not saying PHP is not a secure language, far from it. But needless to say that escaping a variable in a template is just a nightmare. " Sometimes, security should be enabled by default, especially for templates written by non-developers who are not necessarily aware of the common web threats like XSS or CSRF. @fabpot PHP TWIG Output is escaped by default. <?php echo htmlspecialchars( {% autoescape off %} $var, {{ object.as_html }} ENT_QUOTES, {% endautoescape %} 'UTF-8') ?> I'm well aware of the automatic output escaping problems.
Get Twig Website: http://twig.sensiolabs.org Twig C Extensions: https://github.com/derickr/twig-ext.git Using composer: Create a new composer.json file { "require": { "twig/twig": "1.*" } } curl -s http://getcomposer.org/installer | php php composer.phar install
Twig & WordPress Using Twig into a wordpress plugin/theme could simplify and improve the development. • Plugin development (views) • Theme development
Integrating Twig into a Plugin Just initialize Twig and use it. Using a static reference to share the Twig instance (simple way). function get_twig() { static $twig; if (!$twig) { $loader = new Twig_Loader_Filesystem(__DIR__ . '/templates'); $twig = new Twig_Environment($loader, array('cache' => false)); } return $twig; }
Render a template During the Twig initialization we specify the view location ("templates" folder). Now you can create a Twig view and save it. Into your plugin just link to it: $template = get_twig()->loadTemplate('tweets.twig'); echo $template->render(array('elements' => $unpack)); In this example we load the "tweets.twig" view and pass the elements variable.
WP Plugin Example You can checkout an example at: • https://github.com/wdalmut/wp-simple-tweets In this example we add a widget into the admin dashboard that shows tweets of @CorleyCloud account.
Make a template using Twig WordPress is designed to use PHP as template engine. We can force to integrate Twig as the default templating system. You can find an example of integration at: https://github.com/wdalmut/wp-twig-theme This example realize a simple blank template with some WP functionalities (sidebars, posts, pages, archives).
Making a Twig Proxy WordPress uses a lot of functions to generate pieces of html. To speedup the Twig integration we can create a simple proxy that enable WP functions into a Twig template. class TwigProxy { public function __call($function, $arguments) { if (!function_exists($function)) { throw new Exception("{$function} not exists."); return NULL; } return call_user_func_array($function, $arguments); } }
Using the Twig Proxy This proxy allows us to call WordPress functions into a view. <div id="sidebar"> {% if not wp.dynamic_sidebar("Sidebar Widgets") %} {{ wp.get_search_form }} <!-- continue --> </div> "dynamic_sidebar" and "get_search_form" are WP functions.
Load Twig templates instead PHPs We can use WordPress hooking system to override the default template loading. • add_filter o home_template o single_template o page_template o 404_template o archive_template o Etc, etc... • add_action o template_include  Engage Twig and prepare data to view.
Layout management Instead of use get_header and get_footer that break HTML we can use template inheritance of Twig. {% extends "base.twig" %} {% block title %} {{ parent() }} | Page Not Found {% endblock %} {% block content %} <h2>Error 404 - Page Not Found</h2> {% endblock %}
Enjoy with Twig Twig is extremely simple and powerful, you can play and enjoy with this great template engine and get more power during your wp development. Have a nice day
?
Thank you! Walter Dal Mut walter.dalmut@gmail.com @wdalmut Maurizio Pelizzone maurizio@mavida.com @miziomon

Use Symfony2 components inside WordPress

  • 1.
    Use Symfony2 componentsinside WordPress (…and live happily)
  • 2.
    Walter Dal Mut  Cofounder at Corley S.r.l.  First level degree Electronic Engineering  Ungraduated student of Computer Science Maurizio Pelizzone  Cofounfer at Mavida S.n.c  WordPress Lover
  • 5.
    Symfony2 is areusable set of standalone, decoupled, and cohesive PHP components that solve common web development problems Fabien Potencier http://fabien.potencier.org/article/49/what-is-symfony2
  • 6.
    Use Composer autoloadin your theme
  • 7.
  • 8.
    Monolog is alogging library for PHP 5.3 used by Symfony2. It is inspired by the Python LogBook library.
  • 9.
    Get Monolog Website: https://github.com/Seldaek/monolog UsingMonolog: Create a new composer.json file { "require": { "monolog/monolog": "1.1.*" } } curl -s http://getcomposer.org/installer | php php composer.phar install
  • 10.
  • 12.
    … and usein your theme
  • 15.
  • 16.
    Assetic is anasset management framework for PHP. Assetic is based on the Python webassets library
  • 17.
    Get Assetic Website: https://github.com/kriswallsmith/assetic UsingAssetic: Create a new composer.json file { "require": { "kriswallsmith/assetic": "v1.0.4" } } curl -s http://getcomposer.org/installer | php php composer.phar install
  • 18.
    GOAL: Merge, Minimizeand Compile all javascript loaded through WordPress
  • 22.
  • 23.
  • 24.
    Twig: the flexible,fast, and secure template engine for PHP. Twig uses a syntax similar to the Django and Jinja template languages which inspired the Twig runtime environment.
  • 25.
    Why using aTemplate Engine ?
  • 26.
    PHP doesn't supportmany features modern template languages should have nowadays o Concision o Template oriented Syntax o Reusability o "Security" by default  I'll explain in the next slides  Read more on dedicated webpages. Read more at: http://fabien.potencier.org/article/34/templating-engines-in-php
  • 27.
    Concision PHP TWIG <?php echo $name ?> {{name}} <?php echo {{name|escape}} htmlspecialchars( $name, ENT_QUOTES, No short version it's 'UTF-8') already the short ?> Short tags version. <?=$name?> Using short tags could creates problems. You have to enable the short tags that are disabled by default.
  • 28.
    Template oriented Syntax PHP TWIG <?php if ($items): ?> {% for item in items %} <?php foreach ($items as $item): ?> * {{ item }} * <?php echo $item ?> {% else %} <?php endforeach; ?> No item has been found. <?php else: ?> {% endfor %} No item has been found. <?php endif; ?> It's more clear and use a new syntax.
  • 29.
    Reusability <!-- base.html --> <!-- index.html --> <html {% extends "base.html" %} xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> {% block head %} <head> {{ block.super }} {% block head %} <link rel="stylesheet" href="main.css" /> <link rel="stylesheet" href="main.css" /> {% endblock %} {% endblock %} </head> {% block content %} <body> Index content {% block content %}{% endblock %} {% endblock %} </body> </html>
  • 30.
    Security " I'm notsaying PHP is not a secure language, far from it. But needless to say that escaping a variable in a template is just a nightmare. " Sometimes, security should be enabled by default, especially for templates written by non-developers who are not necessarily aware of the common web threats like XSS or CSRF. @fabpot PHP TWIG Output is escaped by default. <?php echo htmlspecialchars( {% autoescape off %} $var, {{ object.as_html }} ENT_QUOTES, {% endautoescape %} 'UTF-8') ?> I'm well aware of the automatic output escaping problems.
  • 31.
    Get Twig Website: http://twig.sensiolabs.org TwigC Extensions: https://github.com/derickr/twig-ext.git Using composer: Create a new composer.json file { "require": { "twig/twig": "1.*" } } curl -s http://getcomposer.org/installer | php php composer.phar install
  • 32.
    Twig & WordPress UsingTwig into a wordpress plugin/theme could simplify and improve the development. • Plugin development (views) • Theme development
  • 33.
    Integrating Twig intoa Plugin Just initialize Twig and use it. Using a static reference to share the Twig instance (simple way). function get_twig() { static $twig; if (!$twig) { $loader = new Twig_Loader_Filesystem(__DIR__ . '/templates'); $twig = new Twig_Environment($loader, array('cache' => false)); } return $twig; }
  • 34.
    Render a template Duringthe Twig initialization we specify the view location ("templates" folder). Now you can create a Twig view and save it. Into your plugin just link to it: $template = get_twig()->loadTemplate('tweets.twig'); echo $template->render(array('elements' => $unpack)); In this example we load the "tweets.twig" view and pass the elements variable.
  • 35.
    WP Plugin Example Youcan checkout an example at: • https://github.com/wdalmut/wp-simple-tweets In this example we add a widget into the admin dashboard that shows tweets of @CorleyCloud account.
  • 36.
    Make a templateusing Twig WordPress is designed to use PHP as template engine. We can force to integrate Twig as the default templating system. You can find an example of integration at: https://github.com/wdalmut/wp-twig-theme This example realize a simple blank template with some WP functionalities (sidebars, posts, pages, archives).
  • 37.
    Making a TwigProxy WordPress uses a lot of functions to generate pieces of html. To speedup the Twig integration we can create a simple proxy that enable WP functions into a Twig template. class TwigProxy { public function __call($function, $arguments) { if (!function_exists($function)) { throw new Exception("{$function} not exists."); return NULL; } return call_user_func_array($function, $arguments); } }
  • 38.
    Using the TwigProxy This proxy allows us to call WordPress functions into a view. <div id="sidebar"> {% if not wp.dynamic_sidebar("Sidebar Widgets") %} {{ wp.get_search_form }} <!-- continue --> </div> "dynamic_sidebar" and "get_search_form" are WP functions.
  • 39.
    Load Twig templatesinstead PHPs We can use WordPress hooking system to override the default template loading. • add_filter o home_template o single_template o page_template o 404_template o archive_template o Etc, etc... • add_action o template_include  Engage Twig and prepare data to view.
  • 40.
    Layout management Instead ofuse get_header and get_footer that break HTML we can use template inheritance of Twig. {% extends "base.twig" %} {% block title %} {{ parent() }} | Page Not Found {% endblock %} {% block content %} <h2>Error 404 - Page Not Found</h2> {% endblock %}
  • 41.
    Enjoy with Twig Twigis extremely simple and powerful, you can play and enjoy with this great template engine and get more power during your wp development. Have a nice day
  • 42.
  • 43.
    Thank you! Walter Dal Mut walter.dalmut@gmail.com @wdalmut Maurizio Pelizzone maurizio@mavida.com @miziomon