yii-debug-toolbar调试工具[安装中可能遇到的问题，汇总、分析、解决]

使用yii框架开发项目，为提高效率，必不可少的就是yii-debug-toolbar调试工具，此工具功能强大，界面美观，使用体验好。
下面依据我自己安装中遇到的问题，分享一下安装步骤：

1、从yii官网或者通过网络资源，下载yii-debug-toolbar压缩包

2、 将下载的文件压缩包解压到项目目录下的protected/extensions里的yii-debug-toolbar文件夹中。

3、 编辑项目入口文件 index.php，开启YII_DEBUG模式及设置追踪错误级别；

defined('YII_DEBUG') or define('YII_DEBUG',true); 
defined('YII_TRACE_LEVEL') or define('YII_TRACE_LEVEL',3); 

4、编辑配置文件 protected/config/main.php
(1)引用日志记录：

'preload'=>array('log'),

(2)同时，在 ‘components’=>array(）中，加入log组件；

'log' => array (  
     'class' => 'CLogRouter' ,  
     'routes' => array (  
         array (  
             'class' => 'ext.yii-debug-toolbar.YiiDebugToolbarRoute' ,  
        ),  
    ),  
),  

(3)想要输出详细的SQL信息，在db组件中补充：
‘enableProfiling’ =>true,
‘enableParamLogging’ =>true,
如下位置：

'db' => array (  
     'connectionString'  =>  'mysql:host=localhost;dbname=test' ,  
     //...   
     //...
     'enableProfiling' =>true,  //必备
     'enableParamLogging' =>true,   //必备
),

通常情况下，通过如上步骤安装之后，运行项目网站，会在右上角出现一个“+”加号图标，点击即可使用：
效果如图：

但是，如果出现如下情况：(工具显示内容在网站最底部展示，而且样式混乱)，如图：

原因判断：该工具的样式文件或者js文件可能没有在网页中自动引用，或者生成的文件缺失。【可自行检查解析后的页面中，是否有如下几个引入文件】
正常显示的页面，一般会在页面中自动加载这样几个文件【请通过“查看网页源代码”进行查看】：

<link rel="stylesheet" type="text/css" href="/assets/faf25a82/main.css">
<script type="text/javascript" src="/assets/4d6b3a8d/jquery.js">
<script type="text/javascript" src="/assets/4d6b3a8d/jquery.yiiactiveform.js"></script>
<script type="text/javascript" src="/assets/faf25a82/main.js"></script>
<script type="text/javascript">
        /*<![CDATA[*/
        jQuery(function($) {
        jQuery('#yw0').after("<a id=\"yw0_button\" href=\"\/yii-1.1.14(normal)\/mywebsite\/index.php?r=site\/captcha&amp;refresh=1\">Get a new code<\/a>");
        jQuery(document).on('click', '#yw0_button', function(){
            jQuery.ajax({
                url: "\/yii-1.1.14(normal)\/mywebsite\/index.php?r=site\/captcha&refresh=1",
                dataType: 'json',
                cache: false,
                success: function(data) {
                    jQuery('#yw0').attr('src', data['url']);
                    jQuery('body').data('captcha.hash', [data['hash1'], data['hash2']]);
                }
            });
            return false;
        });

        jQuery('#contact-form').yiiactiveform({'validateOnSubmit':true,'attributes':[{'id':'ContactForm_name','inputID':'ContactForm_name','errorID':'ContactForm_name_em_','model':'ContactForm','name':'name','enableAjaxValidation':false,'clientValidation':function(value, messages, attribute) {

        if(jQuery.trim(value)=='') {
            messages.push("Name cannot be blank.");
        }

        },'summary':true},{'id':'ContactForm_email','inputID':'ContactForm_email','errorID':'ContactForm_email_em_','model':'ContactForm','name':'email','enableAjaxValidation':false,'clientValidation':function(value, messages, attribute) {

        if(jQuery.trim(value)=='') {
            messages.push("Email cannot be blank.");
        }



        if(jQuery.trim(value)!='' && !value.match(/^[a-zA-Z0-9!#$%&'*+\/=?^_`{|}~-]+(?:\.[a-zA-Z0-9!#$%&'*+\/=?^_`{|}~-]+)*@(?:[a-zA-Z0-9](?:[a-zA-Z0-9-]*[a-zA-Z0-9])?\.)+[a-zA-Z0-9](?:[a-zA-Z0-9-]*[a-zA-Z0-9])?$/)) {
            messages.push("Email is not a valid email address.");
        }

        },'summary':true},{'id':'ContactForm_subject','inputID':'ContactForm_subject','errorID':'ContactForm_subject_em_','model':'ContactForm','name':'subject','enableAjaxValidation':false,'clientValidation':function(value, messages, attribute) {

        if(jQuery.trim(value)=='') {
            messages.push("Subject cannot be blank.");
        }

        },'summary':true},{'id':'ContactForm_body','inputID':'ContactForm_body','errorID':'ContactForm_body_em_','model':'ContactForm','name':'body','enableAjaxValidation':false,'clientValidation':function(value, messages, attribute) {

        if(jQuery.trim(value)=='') {
            messages.push("Body cannot be blank.");
        }

        },'summary':true},{'id':'ContactForm_verifyCode','inputID':'ContactForm_verifyCode','errorID':'ContactForm_verifyCode_em_','model':'ContactForm','name':'verifyCode','enableAjaxValidation':false,'clientValidation':function(value, messages, attribute) {

        var hash = jQuery('body').data('captcha.hash');
        if (hash == null)
            hash = 769;
        else
            hash = hash[1];
        for(var i=value.length-1, h=0; i >= 0; --i) h+=value.toLowerCase().charCodeAt(i);
        if(h != hash) {
            messages.push("The verification code is incorrect.");
        }

        },'summary':true}],'summaryID':'contact-form_es_','errorCss':'error'});
        });
        /*]]>*/
</script>

（以上引入文件的路径中，出现的faf25a82，4d6b3a8d两个文件夹是安装此工具时，在assets文件夹自动生成的，里面会生成很多文件，如下图(不同版本可能会有差异)）


针对上述情况，即把上述本来应该自动在页面生成的文件，手动写入项目的页面的公共部分（例如：公用头部、脚等），把路径对应好，也可正常使用该工具。