History: Bootstrap JavaScript JQuery
Preview of version: 5
To integrate Bootstrap into Tiki we have to add bootstrap.js to Tiki to make Bootstraps dropdown elements and the mobile navigation working. The first question is, where to store the bootstrap files ... I assume, that we will get it with the composer into the "vendors" directory, when we install via shell/SSH/SVN and that this will be the place aswell, when we install a packed Tiki via FTP. So assumably we will have a directory /vendors/bootstrap with all the content in it:
To integrate bootstrap.js into Tiki we have to add the file into the file /tiki-setup.php in the document root of the Tiki installation. This is done with the following line of code near the end of the file (somebody find a good place?):
$headerlib->add_jsfile('vendors/bootstrap/dist/js/bootstrap.js');
It is possible to integrate the "Bootstrap Plugins" which sort out for example the drop down behaviour, one by one, but the easiest is to integrate the bootstrap.js because it contains all plugins. It would be further more not a big deal to set up a preference for Bootstrap and to load the .js file only when the preference ist active (tried today and worked).
Do we need that? Code would be then:
if ( $prefs<a class="wiki" href="'style_bootstrap_layout'" rel="">'style_bootstrap_layout'</a> == 'y' ) {<br /> $headerlib->add_jsfile('bootstrap/swfobject/swfobject.js') }
/lib/prefs/style.php and /templates/admin/include_look.tpl
aswell. That is pretty much it, what is necessary from the JavaScript/jQuery point of view to make Bootstrap running in Tiki.
What would be awesome and under the point of view of marketing and usability is a way to standardwise integrate external jQuery Plugins like for example responsive slideshows
My idea was to implement a grafical interface in the admin area (maybe "look and feel"?), where the user simply writes the paths to the .js/jQuery plugins into an array - one line per path.
The storage location could be recommended in /vendors/custom or a new /vendors_custom to keep some chance for consistency (nice for consultants etc.) and easier bug tracking.
Workflow would be like this:
Review some plugins and choose one with appropriate licence and jQuery version.
- Upload the Plugin directory as is into
/vendors/custom/myplugin or /vendors_custom/myplugin - Type the path vendors/custom/myplugin/whatsoever/myplugin.js into the array in
tiki-admin.php?page=look -> Custom -> jQuery-Array-Box - Check, if you need to copy some css into /styles and maybe to
@include it in /styles/mytheme.css - Should be Done!
There could be naming conflicts of variables and selector between different external .js files, but we could include a linktip to the doc.t.o and there provide a few hints how to deal with such iussues in general.
More to write about .js in respect of Bootstrap? Well, go on ...