How to create Master Page(Layout) with base design

2019-01-23 19:04发布

站内文章 / 后端开发
7 0 0

问题:

I'm new in CodeIgniter. I want to create Master Page or Layout with base style that will be contain Menu, footer and etc. I don't want to write repeating content in all pages and load it automatically for all pages. For example, I can create Master Page in asp.net or Layout in asp.net mvc. I'm sure I can do it in CodeIgniter.

回答1:

lets assume you have an html page

<html>
    <head>
        <title> Hello World </title>
    </head>
    <body>
        <div id="menu">
            <li><a href="#">Home</a></li>
            <li><a href="#">About</a></li>
            <li><a href="#">Contact</a></li>
        </div>

        <div id="main-content">
            <!-- this is the dynamic part -->
        </div>

        <div id="footer">
            Copy Right 2013 Hello World
        </div>
    </body>
</html>

you could split it into 1- header 2- menu 3- main content 4- footer

you basically put 

<html>
    <head>
        <title> Hello World </title>
    </head>
    <body>

in one view called "view_header" then you put 

        <div id="menu">
            <li><a href="#">Home</a></li>
            <li><a href="#">About</a></li>
            <li><a href="#">Contact</a></li>
        </div>
        <div id="main-content">

in a view called "view_menu" and then you put 

        </div>

        <div id="footer">
            Copy Right 2013 Hello World
        </div>
    </body>
</html>

in a view called "view_footer" then in your controller

$this->load->view('view_header');
$this->load->view('view_menu');
$this->load->view('YOUR_VIEW');
$this->load->view('view_footer');

The other solution, which I see is better: create a view called view_template.php

<html>
    <head>
        <title> Hello World </title>
    </head>
    <body>
        <div id="menu">
            <li><a href="#">Home</a></li>
            <li><a href="#">About</a></li>
            <li><a href="#">Contact</a></li>
        </div>

        <div id="main-content">
            <?php $this->load->view($content); ?>
        </div>

        <div id="footer">
            Copy Right 2013 Hello World
        </div>
    </body>
</html>

in the controller lets say you want to call a view called About

$data = array('content'=>'about');
$this->load->view('view_template',$data);


回答2:

Dynamic Layout

You would create a new Controller with a public $template variable Your extended Controller will then inherit the $template variable from the Master Controller.

MY_Controller

class MY_Controller extends CI_Controller
{
    public $template=null;

    public function __construct()
    {
        if(is_null($this->template)){
            $this->template = 'layouts/default';
        }   
    }
}

Admin_controller

class Admin_Controller extends MY_Controller
{
    public function __construct()
    {
        //Still inherits from MY_Controller
        //this time, any controller extending Admin_Controller
        //will point to 'views/layouts/admin'

        if(is_null($this->template)){
            $this->template = 'layouts/admin';
        }   
    }
}

-

class User extends MY_Controller
{
    public function index()
    {
        //$this->template is inherited 
        //from MY_Controller
        //which point to 'views/layouts/default'

        //We can also load a view as data
        //ie no master layout, INTO our master layout
        //note we don't pass $this->template
        //and set the third param as true
        $dynamic_sidebar = $this->load->view('views/sidebar/dynamic', array(
            'data'  =>  'some_data'
        ), true);

        return $this->load->view($this->template, array(
            'partial'   =>  'users/index' //partial view,
            'dynamic_sidebar'   =>  $dynamic_sidebar
        ));
    }
}

Views/Layouts/default

<body>

    //load the main view
    //in our example we have also loaded
    //a dynamic sidebar with this view
    <?php $this->load->view($partial); ?>
    <?php $this->load->view($dynamic_sidebar); ?>

    //load a static view
    //views/sidebar/static
    <?php $this->load->view('sidebar/static'); ?>

</body>


回答3:

Following the idea of a master page in Laravel, we can do this:

Controller code

$this->load->view('show');

View "show.php"

Set values for master page and then pass the variables to master page. Keep your master page codes inside ob_start() & ob_get_clean().

<?php $page_title = "My first page"; ?>


<?php ob_start(); ?>
Your header stylesheet links and scripts
<?php $page_header = ob_get_clean(); ?>


<?php ob_start(); ?>
<div>
    <h1>This is a Header</h1>

    <?php $this->load->view('Partials/list'); ?>
</div>
<?php $page_content = ob_get_clean(); ?>


<?php ob_start(); ?>
Your footer html or scripts
<?php $page_footer = ob_get_clean(); ?>


<?php $this->load->view('Layout/app',array(
    'page_title' => $page_title,
    'page_header' => $page_header,
    'page_content' => $page_content,
    'page_footer' => $page_footer
)); ?>

Partial view "Partials/list.php"

In case you don't want your code to be crowded. You can create some partial views to keep things simple.

<ul>
    <li>LIst item 1</li>
    <li>LIst item 2</li>
    <li>LIst item 3</li>
</ul>

Master Page "Layout/app.php"

<html>
  <head>
    <title><?= v($page_title) ?></title>
    <?= v($page_header) ?>
  </head>
  <body>
    <?= v($page_content) ?>


    <?= v($page_footer) ?>
  </body>
</html>

<?php
function v(&$var)
{
    return isset($var) ? $var : '';
}

So that will genarate code:

<html>
    <head>
        <title>My first page</title>
        Your header stylesheet links and scripts
    </head>
    <body>

    <div>
        <h1>This is a Header</h1>

        <ul>
            <li>LIst item 1</li>
            <li>LIst item 2</li>
            <li>LIst item 3</li>
        </ul>
    </div>


    Your footer html or scripts
  </body>
</html>


回答4:

What we probably do is separate view files for header, menu, footer, etc.. that is common for all pages. And include them inside each view. like

$this->view('header');
$this->view('menu');
//Some specific content
$this->view('footer');

If you need same functionality without copying the above to all views, you need to create a function in your controller as follows:

private function myviewfunction($current_view) 
{
    $this->load->view('header');
    $this->load->view('menu');
    $this->load->view($current_view);
    $this->load->view('footer');
    return NULL;
}

and call this function in all your pages (methods)

$this->myviewfunction('about'); //About is the specific view for the method


标签： codeigniter
举报

收藏的人(0)

Ta的文章 更多文章
登录 后发表评论
0条评论
还没有人评论过~