Today i wrote new asset manager for my cms by taking ideas from contributions on codeigniter. This is very useful for my cms. I am going to modify more in the future as i have time. But for now i would like to show how it works.
I have a config file called MY_config. And, i autoload this config on config/autoload.php
<?php $autoload['config'] = array('MY_config'); ?>
Also, i autoload my new library in this file, along with other libraries as:
<?php $autoload['libraries'] = array('database', 'session','login', 'assets'); ?>
Now i need to edit MY_config.php file.
<?php /* * DEFFINE BELOW ITEMS FOR ASSETS MANAGEMENT * dir is relative to base dir * filenames should not have extensions i.e. no .css or .js */ //Base Path where index.php or admin.php is located $config['cf']['base_path'] = dirname(FCPATH) . '/'; /* * assets directory relative to base_path above * trailing slash (/) required if not empty e.g. 'assets/' * if empty then just '' */ $config['cf']['assets_dir'] = 'assets/'; /* * js (script) directory * No trailing or leading slashes (/) */ $config['cf']['js_dir'] = 'js'; /* * css directory * No trailing or leading slashes (/) */ $config['cf']['css_dir'] = 'css'; //do js and css located in multifolder like admin, frontend, common //default is false $config['cf']['is_js_css_split'] = true; /* * if is_js_css_split is true, define directories they can be found according to preferences in an array * e.g. css can be found at: assets/common/css or, assets/admin/css etc... * Script stops search when it finds one. */ $config['cf']['js_css_dir'] = array( 'frontend', 'common', 'admin' ); /* * Define css that need to be autoloaded in every page */ $config['cf']['defaults']['css'] = array( 'all' => array('helper','header', 'menuLeft', 'jquery.jdMenu', 'footer') ); /* * Define js that need to be autoloaded in every page */ $config['cf']['defaults']['js'] = array('jquery', 'jquery.dimensions', 'jquery.positionBy', 'jquery.bgiframe', 'jquery.jdMenu'); ?>
Now on controller, or view file load css and js as follow:
<?php $assets = array(); //load all required css //if media type not defined, screen is default. //$assets['css'] = array('admin','swiff','box','upload'); $assets['css'] = array('all' => array('page', 'special')); //load all required js $assets['js'] = array('xyz','abc'); $this->assets->load($assets); ?>
Now its time to echo loaded css and js. Put the below code wherever you want to echo it. definitely its between <head> & </head>:
<?php $this->assets->get(); ?>
It'll echo css|js as: If you view source of this page, you'll understand what i'm talking about.
This step should have been bit before but it really doesn't matter. Just upload the asset manager library to library folder.