简体   繁体   中英

How do I create common template with header and footer for phalcon projects with Volt Engine

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">
        &copy; 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>&copy; {{ 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.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM