将Bootstrap模板集成到cakephp中

时间:2014-03-16 04:08:08

标签: twitter-bootstrap templates layout cakephp-2.0

有很多人问到将twitter bootstrap与cakephp集成在一起。 我遵循了很多教程,但没有任何帮助我。 我为管理员面板下载了一个引导程序模板。但我不知道如何将其与cakephp整合。我之前使用过模板,然后将css和js复制到

     app/webroot/css 
     app/webroot/js

它工作正常,但是当我打开这个模板时,里面有很多文件夹

     asset
     bootstrap
     venders,and some html pages

我不知道如何将其整合到cakephp中。如果有人知道请给我一步一步的程序,以便它帮助所有人.. 谢谢

1 个答案:

答案 0 :(得分:3)

在cakephp中集成bootstrap模板非常简单。

首先将所有css复制到app/webroot/css/

第二次复制app/webroot/js/中的所有j。

第三次复制app/webroot/fonts/中的所有字体(如fontawesome)(您必须创建此目录)。

模板中的第四个代码将代码从<html>剪切为</head>并粘贴到文件夹app/view/elements/下的新文件header.ctp中。

第五个在文件夹app/view/layout/中创建一个文件mylayout.ctp 在其中写下以下代码

<?php
    echo $this->element('header');
    echo $this->fetch('content');
?>

你的控制器中的第六个说UserController.php创建一个函数索引。

<?php
    class UsersController extends AppController{
        public function index(){
             $this->layout='mylayout';
        }
    }
?>

header.ctp中的第七个将所有<link>删除为css而不是写入

<?php echo $this->Html->css(array('ccs1','css2','css3'));?>

对所有脚本执行相同操作

<?php echo $this->Html->script(array('script1','script2','script3'));?>

现在,在app / view / Users /文件夹中创建一个新文件index.ctp。你不得不 创建此文件夹。

在index.ctp中,将模板文件中的所有剩余代码从<body>标记复制到</html>标记。

最后在浏览器中打开localhost/pathToYourProject/Users/

如果需要,您还可以创建页脚元素。

这是在cakephp中集成任何模板的基本示例。