Dear users, for all bug reports please use the profile page:


Thank you,
Can you support for IE8 ?

I have many customer to use in IE8.
Hello Samtler,

There are ways to make it work on IE8, but only in the HTML version, and you will lose 30-40% of the theme functionality. Please message me through my profile page and I will send you an IE8 semi-working prototype.

Hi MyOrange!

Sorry to ask, but I'm starting to use Bootstrap and I have just bought your Admin Theme but I don't know how to configure it. I have a little experience in using Joomla, but have no idea how to use Bootstrap admin.

May you help me, please?
Sorry my bad english, I'm from Brazil.

Hello Pedrocduarte,

I will try to help as much as possible. I am not a Joomla developer but I was able to find this video on youtube, perhaps it can guide you a little better for the integration:


There is also a bootstrap integration plugin you can use for joomla for a better understanding:


Sorry I couldn't be much help...

Hello MyOrange,

This is an awesome theme and I'm looking to buy it for my client. But I'm just wondering if the theme supports load on demand (when user scroll down to end of page that loads next set of n items) on - say Gallery page? (3rd party plugin is cool for me as long as it works on the theme).

And, also is it compatible with TinyMCE and elfinder?

Many Thanks in advance!
Hi Nitro,

Load on demand should be fine. I am assuming it will just be another Ajax call for the #container.

Also for the plugins elfinder and TinyMCE there should be no conflict with the theme. However you may want to take out CKEditor plugin from SA just to be safe.

Hi MyOrange!
Are you planning a color picker to the theme?
Hello Garpo,

Yes it is in our lists of things to do. Currently we are concentrating on a few important features that are high in demand - we will most likely release a theme customizer or 'color picker' in version 1.6.

Cool!, one more question, if a buy the theme, i will also get access to futures updates?
Correct. :)

Why when I open index.html in "AngularJS_version" nothing works properly?

Hello MrR,

You have to open it via a web server such as WAMPSERVER, it will not work if you open it directly from local. If you find error messages or bugs please report them using my profile page (https://wrapbootstrap.com/user/MyOrange) so they can be properly logged to the bug tracker.


Why it does not work all locally? AngularJS is a client framework javascript that should work all like as Html does since you do not have any server communication yet linked to the template.

Hi MrR,

The issue you're running into is browser-related and has to do with cross-origin resource sharing (CORS). A Google search for 'angularjs cors' will pull up more information. When viewing the HTML files from your local filesystem you're probably seeing errors in the developer console that look like this:

"XMLHttpRequest cannot load file:///[...]/WB0573SK0/DEVELOPER/AngularJS_version/includes/shortcut.html. Cross origin requests are only supported for HTTP."

The solution is to work from a local or remote webserver. You can also use Firefox instead of Chrome (and other WebKit-based browsers) since Firefox won't block the local requests.
I just purchased the Ang JS versions as well, and it only works locally in FireFox. I'm getting the same CORS related errors in Chrome and IE.
Hello MrR,

There is a plugin you can use for chrome to disable this security feature:


stepfair PURCHASED
This theme looks great and I think it would fit my needs. I have a few questions though, because I haven't bought a theme before.

Is the logo/footer changeable and can I customize anything I want, or is that against the license?

Are updates free?

Are the layout options on the right available to anyone? I assume those are only for showing different possible configurations in the settings, because I would want to set the theme to have the nav on the top, because i want to modify it a bit to use as a regular website.
Hello Stepfair,

You should be able to add your own logo to the header and footer.

All updates are absolutely FREE.

Layouts and colors are controlled through LESS variable file, with a few tweaks and know how, you should be able to customize the theme.

All configuration options are explained in the docs.

Hi stepfair,

The licenses don't prevent you from making any customizations. Feel free to customize the design or change the look however you want. One thing to keep in mind is that changing the structure of the original HTML, JavaScript, or CSS files may affect your ability to upgrade easily. It's best to store CSS changes in your own stylesheet and take care to document any changes that you've made to the HTML and JS files in case you need to make those changes again to the upgraded files.
stepfair PURCHASED

I went ahead and bought the theme and it is just the best. Great work and thanks!


Thanks for the clarification. I've been able to make the changes I've wanted so far without having to modify the core files. This site is awesome and is going to save me a boatload time/money on front end development! :)
Hi My Orange,

I am trying to use the AngularJS version. This (similar to other versions) has some utility subfolders like ajax, css, fonts, img, etc... But, my application will have folders with the same names too.

Q: How can I move these SmartAdmin utility folders EASILY to a general subdirectory, say "/SA/ajax", "/SA/css", "/SA/img", etc so that they can be separated from application repository? How can I rename internal references to these subfolders?

I am in this situation as well but I'd recommend a different approach to the one your suggesting.

I'd recommend that you place your code in your folders and leave the SmartAdmin template as is. This way new releases of SmartAdmin won't result in you having to repeat this potentially painful process of moving all the SmartAdmin assets...
@Drammy: This was what I have tried first. But, I did not like it.

I am using ASP.NET MVC Framework, and it has also a bunch of directories, some having similar functionality, some even the same name (like: Views).

So, it becomes difficult to tell the programmers: "do not touch to these directories, because our template uses them"
Hi Firtinabilal,

For CSS assets there is a "@base-url" variable for images inside the variable.less file which you can change and recompile for the new CSS.

For the actual CSS, IMG, JS and other directories - SA uses relative paths. You have to use full URLs if you are retrieving the assets from different server.

I will try to be more descriptive in the future change logs so its easier to see these changes for the sub directories.
@MyOrange congrats on a great template. Packed full of features and quite inspirational as a foundation for developing our own app on top of.

I'm using the template for an AngularJS application and am currently looking into the navigation. I see you've created you own Navigation module but it has "DEMO only" in the markup as well as the code and I wondered if you are suggesting it should not be used for production?
Hi Drammy,

Sorry for the confusion. That comment was for SA internal team only. I will have that comment removed in the next update.

Thanks for the clarification
Congrats on a wonderful template ! I've purchased the angular js version, and would now like to integrate into an ASP.NET MVC4 project. Any tips as to how to best get started ? i.e. Do I simply create a new asp.net project, then manually integrate your files and folders into my project structure ?
I'm looking to do something along the lines of John Papa's HowTowel.Angular.Breeze template, with WebApi capability as well.
thank you.
Hello Robertmazzo,

Your question is very specific and related more towards your language/dev environment, I will try my best to answer. Once you purchase SmartAdmin you will have access to all four versions (HTML, PHP, AngluarJS and Ajax Version). For AngularJS and .NET I would suggest you this video tutorial:


It will go into more depth and give you a broader idea on different ways to approach AngularJS with .NET.

There is also a great book on amazon by Brad Green on AngularJS - it helped me out a lot and gave me a lot of insight about AngularJS which I did not find on the internet.

Hope I was able to help.

I'm having trouble getting your customised datatables to work within my AngularJS app using the SmartAdmin template.

Any chance you can include or provide the non-minified version for debugging? Also do you think you could write a directive for the datatable and include that in the AngularJS version?
I've found the unminifed code now - thanks, didn't see that before.

It would be good to have a datatables directive and example use in SmartAdmin though
Hi Drammy,

Glad you were able to find the unminified version.

There is a DataTable directive available (not yet tested with SA), you can find it here: https://github.com/maktouch/datatables-angular-directive/blob/master/angular.datatables.js

I will try to include more directives in the coming updates. Please keep the suggestions coming :)

edoarsla PURCHASED
Hi there...

I'm using the HTML version, and I have separated header, body, footer, etc. I'm using struts2 / tiles.

Therefore, when I load some page, I need to trigger the correct <li> in the <nav> to open. Is there an API for this - and if not, what do you suggest would be the cleanest way to do it.

Thank you in advance.

Btw, lovely theme!
Hello Edoarsla,

You can try a small JavaScript snippet that lets you do this, I will give you a small example:

// matches the URL path with that of nav href elem then adds .active class
$('nav a[href^="/' + location.pathname.split("/")[1] + '"]').addClass('active');

You may need to expand on it a bit more to fit this particular need. For instance > find parent of the active child > add class > "active open"

Is there a simple way to stop SmartWidgets saving their title name? I'm binding some of mine to an AngularJS model but whenever I use the SmartWidget buttons, like colour styling, the widget state is saved to local storage, including the title name and the binding is lost...
Hello Drammy,

There is a much easier way to do this:

<span class="display-inline padding-gutter padding-bottom-0" style="padding-top: 7px !important;">
<strong>Default</strong> <i>Widget</i>

You just remove the <h2> tag :)

Worked a treat - thanks
Hi, thx for you product. One question only, how can i get access to documentation?
Hi Smarlynet,

When you open SmartAdmin zip file you should see three folders "DESIGNER" , "DEVELOPER", and "Documentation" :)

As per the screenshot below:
Thx again )
Hello MyOrange,

(I also posted this in the comments for the Jarvis theme so you can ignore it there.)

Great job on these themes... They look fantastic and keep getting better and better with each update. Your recent 1.4 release of this SmartAdmin theme seems absolutely perfect for us, for our AngularJS project, in every way except for one: we like the "look" of your other Jarvis theme instead. I don't mean the Jarvis pop-up or any javascript features, but just the page layout, the gray default theme, widget-charts in the right sidebar and below the menu, that whole "look" to the home page especially. So my question is: If we buy both themes, do you think it would be very difficult to copy the basic CSS over from Jarvis to make a version that works exactly like SmartAdmin in every way except just the layout-and-colors from Jarvis instead? (Or by chance, are you planning a Jarvis update anytime soon with an AngularJS version, dygraphs integration, etc?)

Happy to buy both of these, and we will probably buy a extended version later too for other projects we have planned. Really love your themes! Again, great job with these...

Hello Jstanforth,

I actually did not know you posted this comment on my other theme, very sorry about that.

To tell you the truth, I do have plans to convert Jarvis into AngularJS but it could be a few months away from release.

You should be able to convert most of colors of SmartAdmin through the LESS variable file to make it look close to the Jarvis's theme color. If you open *variable.less* (which is found inside DEVELOPER > COMMON_ASSETS > LESS_FILES) you will notice 5 primary variables at the top:

**These are your primary variables for the bootstrap:**
@brand-primary: #3276B1;
@brand-success: #739E73;
@brand-warning: #C79121;
@brand-danger: #A90329;
@brand-info: #57889C;

You will then need to scroll to *SMARTADMIN VARIABLES* section, near the bottom of the file.

There you will find the smartadmin's *COLOR PALLET*, *IMAGE PATH & BACKGROUNDS*, *HEADER*, *RIBBON* ..etc. You will need to play around with the colors to get it the way you like it. But it may not look 100% to that of Jarvis. For the graphs, you can take Jarvis's flot.js file and paste it on top of SmartAdmin's flot.js file to get the colors for all default flot charts.

Here is Jarvis's main color pallet:

Gradient for nav:
(top, #AAD15F, #7EA437)

006AAC : blue
ed9c28 : orange
B9260C : red
#222 : black

Once you change the variable.less file you have to compile smartadmin-production.less to get the CSS output. (you can find a few ways to compile this inside the docs or via grunt tasks)

I will try my best to include a brighter theme in the next update which will look similar to Jarvis's theme colors :)

I played around with the variables for a few minutes and added a few custom CSS classes, did this literally in 15 mins to show you a demo on whats possible:

Thanks so much for your time and help with this... that was cool of you to demo what's possible with the CSS colors! Much appreciated. I suspected the colors could be adapted easily via LESS so that's good to see. Most importantly, though, I'm looking for the 3-column layout of Jarvis, especially the black background and colored mini-charts at the top of the right-sidebar... that looks fantastic. I think you've answered my question here, though, that it's possible to do but not already-works-out-of-the-box, so I can experiment a bit from here and see what I can come up with for our project. And of course, I'll keep an eye out for future updates from you too... Your latest-and-greatest always gives me more ideas! :-)
You are very welcome. I now know which skins to add for next update :)

Re: the right panel. It was not very popular when it was released in Jarvis, so I decided not to implement it in SmartAdmin. But it will be available for those who wish to have this feature as an add-on feature.

You can see the live example of SmartAdmin with the right panel add-on here:



Is there any way to make the navigation panel resizable? So if it is not hide, user can resize it to see more information on the right panel?

Hello PlaintFramework,

Currently the left panel (navigation) width hardcoded to the CSS and is not dynamic. Thought it is definitely possible to make it dynamic but will require some heavy JavaScript coding. I can definitely write a plugin for this in the future that will let you re-size the left panel and this custom width will be stored in a cookie or localstraoge.

If you like to change the width of the left panel manually you can go to the variable.less file and look up the variable "@asideWidth" and adjust it to your desire.


I think there is an issue when the Navigation part is in Fixed mode.
Please refer to http://snag.gy/PEzCW.jpg

How can I fix this?

Hello MrR,

I have dedicated a seperate channel for all bugs, otherwise it could get messy to track them all here. Can you please post all bugs you find by going to https://wrapbootstrap.com/user/MyOrange

Rules for reporting bugs:
- Please first make sure if your bug has already been reported (http://bootstraphunter.com/smartadmin/BUGTRACK/track_/)
- You MUST provide a screenshot of the bug (for all visual related issues)
- You MUST provide a JS fiddle or the steps needed to reproduce the bug
- You MUST NOT add your own scripts
- You MUST provide your product license ID and the date date you found this bug
- You MUST provide the version of SmartAdmin you are using (HTML, AJAX, PHP or AngularJS)
- You MUST Provide your screen resolution, you browser version and your iOS

Hello MyOrange,
It is nice admin template. Great work!
Hello rudolfkanak,

Thank you. Please let me know if there is anything you wish to add in the next release.


I'm using my_overrides.css to override smartadmin-production.css styles. Can you suggest me how to override correctly .smart-form .tooltip to use bootstrap tooltips (not smart-admin tooltips) within smart-forms. I plan to use both tooltips types (bootstrap tooltips and smart-admin tooltips) within smart-forms in the future.

I've found this in smartadmin-production.css:

.smart-form .tooltip {
position: absolute;
z-index: 99999;
left: -9999px;
padding: 2px 8px 3px;
font-size: 11px;
line-height: 16px;
font-weight: 400;
background: rgba(0, 0, 0, 0.9);
color: #fff;
opacity: 0;
transition: margin 0.3s, opacity 0.3s;
-o-transition: margin 0.3s, opacity 0.3s;
-ms-transition: margin 0.3s, opacity 0.3s;
-moz-transition: margin 0.3s, opacity 0.3s;
-webkit-transition: margin 0.3s, opacity 0.3s;
.smart-form .tooltip:after {
content: '';
position: absolute;

Here are my example:
<form class="smart-form">
<a href="javascript:void(0);" rel="tooltip" title="" data-placement="top" data-original-title="some text...">
<i class="fa fa-question"></i>
Hello lu44anno,

We asked all our users in the past to avoid mixing the from SmartForm and Bootstrap Form elements, they are built for two different purposes. SmartForms is really for fast production, it ignores the bootstrap's default grid and has a easier way to layout forms to save development time.

Though you can try mixing elements from the SmartForms and Bootstrap forms, it may or may not work depending on which elements you are mixing.


Thank you for the new update. The work is fantastic as usual. I'm trying to implement your DataTable class, but I was wondering if FixedColumns and scrollbars are supported.
I'm working with a very wide table with a user column on the far left and I want a scroll bar to scroll to the right while having the user column stay fixed.
I do see the 'datatable_fixed_column' table in the documentation, but it does not actually have a fixed column when I test it. Could you give me some explanation how to add scrolling bars and fixed columns in a datatable table?

Forgot a link to an example: https://datatables.net/extensions/fixedcolumns/
This is hope what I could get. Is that possible with your class?
Hello TimvdS,

You can try the setup:

var table = $('#example').DataTable( {
"scrollY": "300px",
"scrollX": "100%",
"scrollCollapse": true,
"paging": false
} );
new $.fn.dataTable.FixedColumns( table )

Please message me using my profile page if you find any errors. I will try my best to show you a working example if you are facing any errors.
Late reaction, but it worked :)

Write a comment

This is a great way to give the seller feedback and ask them questions about their item.

You must sign in to write a comment

Sign in or sign up to make a purchase


Licenses: Details »

Single application $40
  • HTML Template
Bootstrap: Compatible with 3.3.x
  • Responsive
  • Fluid
  • Fixed-width
  • IE 9, 10, 11
  • Latest Chrome
  • Latest Edge
  • Latest Firefox
  • Latest Safari
Uses Less:Yes
Uses Sass:Yes
Topic: General
Labels: admin template, angular, asp.net, lightweight admin, reactjs, responsive dashboard, webapp
Released:4 years ago
Updated:3 weeks ago
Sold exclusively on WrapBootstrap


Signed up 5 years ago

Need a front-end template?

About Bootstrap

Bootstrap is designed to help people of all skill levels – designer or developer, huge nerd or early beginner. Use it as a complete kit or use it to start something more complex.

Unlike other front-end toolkits, Bootstrap was designed first and foremost as a styleguide to document not only its features, but best practices and living, coded examples.

Built to support new HTML5 elements and syntax with progressively enhanced components.

Browser support

Bootstrap is tested and supported in major modern browsers like Chrome, Firefox, and Internet Explorer.

Tested and supported in Chrome, Safari, Firefox, Internet Explorer, and Opera.
  • Latest Chrome
  • Latest Firefox
  • Latest Safari
  • Latest Edge
  • Internet Explorer 10/11
  • Latest Opera

Features & includes

Bootstrap provides an unparalleled array of features and reusable components that let you hit the ground running:

  • Responsive 12-column grid
  • 12 custom, modular jQuery plugins
  • CSS styles for forms, navigation & more
  • Dozens of reusable components
  • Components are scaled according to a range of resolutions and devices
  • Built with Sass (CSS included)
  • Complete styleguide documentation