“TurboAdmin 1.1” Documentation by “pixelcave”


“TurboAdmin”

Created: 20/05/2011
By: pixelcave

Thank you for purchasing my theme. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!


Table of Contents

  1. Updates
  2. TurboAdmin versions
  3. HTML Structure
  4. CSS Files and Structure
  5. Widgets
  6. Twitter widget
  7. JavaScript
  8. Sources and Credits

A) Updates - top

  1. v1.1 (October 8, 2011)
    • 2 new custom pages in Articles
      • Comments Moderation
      • Categories Management
    • Datatables
      • js/jquery.dataTables.min.js added, script included in all pages
      • css/jquery.datatables.css added, stylesheet included in all pages
      • img/jquery.datatables folder added
      • js/page.js updated
      • Fully styled datatables for TurboAdmin, example in custom page
    • Progress bars
      • js/jquery-ui-1.8.11.custom.min.js updated (lines 278-293)
      • css/jquery-ui-1.8.11.custom.css updated (lines 418-429)
      • js/page.js updated
      • img/pbar-ani.gif added
      • Example in custom page
    • CSS hover menu
      • css/styles.css, CSS hover menu rules added (lines 1187-1211)
      • Hover over 'Your page' link in main menu to see it in action
    • js/jquery.uniform.js
      • Added a small fix to solve a bug when styling select elements (line 185, 212)
    • css/style.css
      • Removed an image background reference from ul#main-menu li a (line 1134)
    • Documentation
      • Update info added
      • Sources and Credits updated

B) TurboAdmin versions - top

TurboAdmin comes in 2 different versions! This way you can use the version that fits you best! Let's have a look:

  1. TurboAdmin Template (PHP)
    It's the main version and includes all the features of TurboAdmin.
  2. TurboAdmin Template (HTML)
    All the PHP code is removed. The lost features are:
    a. The Twitter functionality
    b. The included pages ('inc' folder) which helped by having commonly used code included in every page such as the widgets

C) HTML Structure - top

TurboAdmin can have many layouts. It can be fixed or fluid, with 1 or 2 columns or with a fixed adminbar.

General layout structure with 1 column:


...
...
...
...

General layout structure with left sidebar:


...
...
...
...
...

General layout structure with right sidebar:


...
...
...
...
...

If you would like to make TurboAdmin fixed or fluid, or make the adminbar fixed have a look below:


D) CSS Files and Structure - top

I'm using one main CSS file and seven other CSS files. The main CSS file (css/style.css) contains some CSS reset code and all of the specific styles for TurboAdmin. All other files are stylesheets for the various javascript plugins (they came with them) and you must include them in the page (always after the main stylesheet) if you are planning on using the corresponding plugin.

About the CSS reset code is good to know that many browser interpret the default behavior of html elements differently. By using some reset CSS code, we can work round this.

In the main stylesheet I have commented the code the following way so that you can navigate and find the section you want easily.

/************************** Body, html ************************************/
/**************************************************************************/
.csscode {
}

/*********************** END OF Body, html ********************************/
/**************************************************************************/

/**************************** Login ***************************************/
/**************************************************************************/
.csscode {
}

/************************* END OF Login ***********************************/
/**************************************************************************/

/***************************** Content ************************************/
/**************************************************************************/

/* Sub section 1 */
.csscode {
}

/* Sub section 2 */
.csscode {
}

/************************** END OF Content ********************************/
/**************************************************************************/

If you would like to edit a specific section of the site, simply find the appropriate label in the CSS file, and then scroll down until you find the appropriate style that needs to be edited.


E) Widgets - top

The widgets are really easy to create. You can see their structure below:


            

F) Twitter widget - top

I have created a mini twitter app which you can use to update your status and retrieve your last tweets throught the Twitter widget.

For it to work you must open 'inc/twitter.fn.php' and enter your Twitter credentials like you see below.

// Enter your Twitter username & your twitter app keys
// You can get the keys by creating an application at http://dev.twitter.com/apps/new
// Save the file and you are set! :)

$username = '';

$consumer_key = '';
$consumer_secret = '';

$oAuth_token = '';
$oAuth_secret = '';

You can also take a look at the twitter class and enhance even more the twitter widget if you like to!


G) JavaScript - top

This template imports some Javascript files.

  1. Jquery (js/jquery-1.5.2.min.js)
  2. Custom script (js/page.js)
  3. Jquery plugins
  1. Jquery is a Javascript library that greatly reduces the amount of code that you must write.
  2. This javascript file contains almost all the custom javascript code written for TurboAdmin. In this file the widget functionality, the image & file gallery functionality, the Twitter functionality and other smaller features were coded. Moreover, there is an initialization section where all the jquery plugins used are initialized (except flot, which initialization happens in each individual page needed).
  3. You will have to do the follow 3 things if you would like to use a plugin in a new page.
    1. Include their stylesheet (have a look at 'inc/01_head.php' to see which plugins need a stylesheet)
    2. Include their actual javascript code (have a look at 'inc/05_scripts.php')
    3. Initialize them (check the examples at 'js/page.js'). Flot plugin initialized at the bottom of the 'index.php' and 'page_statistics.php', all other plugins at 'js/page.js'

There are a lot of examples in TurboAdmin but for advanced usage of some plugins you can check out their websites where you could find more advanced examples. I've included their links in the next section of this documentation as well as in the comments above their initialization.


H) Sources and Credits - top

I've used the following images, icons or other files as listed.


Once again, thank you so much for purchasing this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist. If you have a more general question relating to the themes on ThemeForest, you might consider visiting the forums and asking your question in the "Item Discussion" section.

FaDoWNLoaD

Go To Table of Contents