In this post we will explain how we were able to use Symfony templates in WordPress, allowing us to avoid duplication of files and code, and still carry the same look and feel of our main website (which runs in Symfony) into our Blog.

When making changes in the templates of our symfony-based site, those changes are immediately available in the Blog which runs on WordPress without having to copy code or files.

In our case, we wanted to have the top section of our website (header and top navigation) and the footer in both the corporate website and Blog.

The way we had built our site proved to be very useful and time saving, this is how we defined it in symfony:

  • The top header and navigation of the site was placed in a global partial named _topnav.php, which is located in the templates directory of the application (apps/site/templates).
  • The footer of the site was placed in another global partial named _footer.php, and it is located in the same directory.
  • Then, we included these partials in layout.php also located in this directory. It looks like this:
include_partial('global/topnav');
echo $sf_content;
include_partial('global/footer');

WordPress themes include several files that need to be customized to change the way it looks by default.  These files can be modified by going into “Appearance” and “Editor”.

We did not use the main layout.php template from Symfony, because we moved the common elements of the HTML into the partials. So on WordPress we only modified header.php and footer.php

In header.php we included the _topnav.php file from symfony. So after the <body> tag we inserted the following line:

<?php include('/path_to_symfony_project/apps/site/templates/_topnav.php'); ?>

This inserts the top area (including the navigation) of our site into every page and post of the Blog. if you have an external CSS in your main site, which you probably do, you need to make sure to add it to the header.php in WordPress.

Then to properly add the footer section of the site to the Blog, we edited footer.php and inserted the following line before the </body> tag

<?php include( '/path_to_symfony_project/apps/site/templates/_footer.php' ); ?>

The same could be done in the inverse way. If you have your main elements of your site design in WordPress, you could include those in the Symfony templates.

If you have any other ideas on how to accomplish this, or other tips on Symfony and WordPress integration, leave a comment, we would love to hear form you.