I want to create a common template with header and footer for every pages in /views
using phalcon volt engine
my folder hierarchy is below
/views
/user
register.volt
/layouts
header.volt
footer.volt
I want to get both code of header.volt
and footer.volt
into register.volt
page
this is the code in header.volt
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container-full">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand">Payroll</a>
</div>
<div class="collapse navbar-collapse navbar-right">
<ul class="nav navbar-nav">
<li>item 1</li>
</ul>
</div><!--/.nav-collapse -->
</div>
this is the code in footer.volt
<div class="footer">
<div class="container container-full">
© Custom 2014
</div>
</div>
this is the code in register.volt
<div class="register-contents">
//register form going here
</div>
The key to setting up templates in phalcon is setting the location of your views directory. Phalcon expects your templates and partials directories to be relative to that views directory. This is simple enough for a single level application:
$view = new \Phalcon\Mvc\View();
$view->setViewsDir( realpath( __DIR__ . '/views/' ) );
$view->setLayoutsDir( '/layouts/' );
$view->setPartialsDir( '/partials/' );
This gets tricky in a multiple module setup when you want to have a single shared template directory and separate views directories for each module.
$view = new \Phalcon\Mvc\View();
$view->setViewsDir( realpath( __DIR__ . '/views/' ) );
$view->setLayoutsDir( '../../../common/views/layouts/' );
$view->setPartialsDir( '../../../common/views/partials/' );
In your layouts directory, create your main template:
{{ getDoctype() }}
<html>
{{ partial('head') }}
<body>
{{ partial('navigation') }}
{{ flash.output() }}
{{ get_content() }}
{{ partial('footer') }}
</body>
</html>
In your partials directory, place your head, navigation, and footer files:
head.volt
<head>
{{ tag.getTitle() }}
{{ assets.outputCss() }}
{{ assets.outputJs() }}
</head>
navigation.php
<?php
// get list of navigation elements from model
$navigation = \MyNamespace\Navigation::getNavElements();
echo "<ul class='nav'>\n";
forEach( $navigation as $element ){
printf("\t<li><a href='%s'>%s</a></li>\n",$element['url'],$element['display']);
}
echo "</ul>\n";
footer.volt
<div class='footer'>
<p>© {{ date('Y') }} Your Company</p>
</div>
You can also insert additional templates that contain html snippets before or after the content of the page. Use the beforeRender() and afterRender() hooks to control which files in your templates directory get inserted where.
I highly recommend you reading the documentation on phalcon available here: http://docs.phalconphp.com/en/latest/reference/views.html
Nevertheless, your folder structure should look something similar to this:
/views
index.volt
/layouts
register.volt
/register
index.volt
Where views/index.volt is the main layout for your site. This should include the header and footer.
Layouts folder is the layout folder for your controllers. So if you have the let's say loginController then it will search for login.volt inside layouts folder.
Next level of inheritance is the action view. So, after the controller's layout is called the view controller is called. In your case index.volt if you're controller is named RegisterController and your view is indexAction.