Professional Documents
Culture Documents
This help file is best used in conjunction with the Adminica online documentation site. Make sure to read this if you want a more comeplete understanding of how Adminica works.
http://www.tricycle.ie/adminica/ index.php/docs/
Here you will see the source code for all the various pages at the bottom of each given page: A description and explanation on how the individual page and its elements work You can see you the original HTML before Javascript has kicked in. You can see the associated Javascript Code comments It is much more effective to see it all in one place than having to switch between documentation and the actual template. I reccommend inspecting the page using Firebug to get an even better understanding.
Table of Contents
1. 2. 3. 4. 5. 6. 7. HTML Structure CSS Files and Structure JavaScript PSD Files Sources and Credits PHP Code Explanation (If your theme uses PHP) Any additional unique features that need an overview
Note: It is really easy to create your own themes, simply duplicate theme_blue.css and look at the top comments. There you will find the main 5 colours which make up each theme listed. Simply find and replace those colours with your new colours in the newly duplicated file. Experimentation is the name of the game! This is a very flexible way of changing the layout and styles of Adminica. It also has the advantage of being very easy to understand what is going on. When you have decided what combination you want for your own site/application I would reccommend combining them into a single file to save bandwidth and cut load times. You can then remove the layout and theme stylesheets you don't need. All the other stylesheets (grid.css, ie.css, ie6.css, reset.css, text.css, jquerui.css) should be left alone as they are handling generic things like resetting default browser styles and laying out the layout framework.
C) JavaScript - top
This theme uses JQuery and jQuery UI extensively. Other than that I have chosen the best jQuery plugins possible. Plugins along with their licenses can be found in the js folder. Here is the full list: jQuery (from Google CDN) http://jquery.com/ jQuery UI (from Google CDN) http://jqueryui.com/ Fancybox http://fancybox.net/ TinyMCE http://tinymce.moxiecode.com/ jQueryFileTree http://abeautifulsite.net/blog/2008/03/jquery-file-tree/ DataTables http://www.datatables.net/ SliderNav http://devgrow.com/slidernav/ SyntaxHighlighter http://alexgorbatchev.com/SyntaxHighlighter/ Uniform http://pixelmatrixdesign.com/uniform/ LiveValidation http://livevalidation.com/ Tipsy http://onehackoranother.com/projects/jquery/tipsy/ iPhoneUI http://old.nabble.com/jQuery-UI-Support-on-the-iPhone-td22011162s27240.html UItoTop (NEW in V1.1) http://www.mattvarone.com/web-design/uitotop-jquery-plugin/ Most of the Javascript files are called from js/plugin.js, this has been done to keep the head section clutter free. The only file which is custom to Adminica is js/adminica/adminica_ui.js. This is where the plugins get their Adminica specific settings eg. how fast a box toggle is or lowering opacity when swapping tabs, etc. I have commented this fully so it is easy to see what each function is doing. Rather than go through each plugin I've given links to their support pages where their use is explained much more extensively. If you want to see how they were configured for Adminica go to the relevant page on the documentation site and scroll to the bottom. Therelevant Javascript code from adminica_ui.js is right at the bottom below the HTML code section.
Documentation to go here