denkGroot supports this item


79 comments found.

The select box issues are all due to the skinning you’ve done. While it looks great, and something we and others will certainly want, the implementation needs work. When the skinning as you coded it is active, you can’t reasonably use auto widths and jquery validation messages (we use it for returning “required” errors), gets overlayed on the select option box rather than to the right of it (like all other form field types).

An option is to provide you with for instance three classes with different widths: .small, .medium and .large.

While it is not a perfect solution, it would solve a lot.

@getnetworks Try something like this in the initialization of the select box:

selectWidth = selectContainer.children('select').outerWidth();
$(this).css('width', selectWidth);

I am really impressed with this template but more so with the communities input into the template. The button at the top beside the tabs is a great addition and the proposed bug fixes for the select field would be great. Interfico what other plans do you have in store for this template. I am really eager to see it continue to be enhanced and developed. Can I suggest some features?

1) May the tabs(top menu) have it possibly show a dropdown on mouseover. This is only because I have a lot of sub menu’s and the space you have allocated for sub menus may not be enough.

2)Is it easy to specify a dropdown within the a container-header?

3) Any chance of creating a container-footer :)

4) Rounded corners does not appear to work on IE even though it appears that you have implemented some javascript to do that.

5) Dialog popup (form entry popup). This would be really cool in situations where you want to collect data as part of a popup. Possible usuage scenarios would be confirmation dislogs or small forms.

Great work interfico, I am a solid fan of this template.

Your input is much appreciated m_josiah!

Regarding your dropdown navigation I can be strict: I will not implement that. The current navigation has been designed in a way which would be as clean as possible. I recommend you to take another look at the structure of your application to see if you can rearrange your navigation.

Of course if you really want a dropdown you could always try implementing it yourself. There’s a pretty great community on the internet that could help you with that. ;)

Your other points are taken into account and will most probably find their way into a next update.

Any ideas when the next update will be available?

sbkyle: Did you share that DataTables implementation with Interfico? We could really make use of that as you have implemented it.

Mail me and I will send you his implementation so far.

Hi Interfico

Is there any ETA on the updates. I want to get your latest updates then get another designer to help me update the files and make some of the tabs have dropdown.

I’m sorry but since I’m really busy I cannot give you an ETA . However, I suggest you just start working with the template. All changes will be documented neatly so that you can upgrade easily.


There was a bug in the implementation I sent to Interfico. When there were more than two datatables in one page the way I implemented the no-sort columns would break the tables. Use this instead in the script.js:

//Remove sorting from columns with class = no_sort in table header
        var aoColumns = [];
        $('.pagination thead th').each( function () {
            if ( $(this).hasClass('no_sort')) {
                aoColumns.push( { "bSortable": false } );
            } else {
                aoColumns.push( null );
        } );

            "sPaginationType" : "full_numbers",
            "bStateSave": true,
            "bAutoWidth" : false,
            "aoColumns" : aoColumns, 
            "aaSorting": [],
            "iDisplayLength": 5,
            "sDom" : "'<'top'fl>t', '<'bottom'ip>''",
            "oLanguage": {
            "sLengthMenu": 'Display <select><option value="5">5</option><option value="10">10</option><option value="25">25</option><option value="-1">All</option></select> records'

So is there any movement on the select boxes or has anyone been able to hack together a fix?

@interfice … or anyone

Trying to understand just how you styled those dropdown menus with the image, etc. I have figured out most of it, but it still shows the native version of the dropdown over the top. Any help? Thanks!

Best, Matt

If you google for “Custom select box” you can find tons of different methods to create that effect. :) Good luck!

We still desperately need tooltips working on images. Are you still actively working on this project? Looks like no updates in over 2 months.

Fixed the select box issue in Chrome. Just add this to the script.js

$('select').change(function() {
       for (var i = 0; i < this.options.length; i++) {
           if(this.options[i].selected == true) {

Solved. ;)

This is great! Although, I see one issue. The form, the input boxes, is it possible to remove so no matter what, it writes something in the input boxes?

All JavaScript is pretty well documented so feel free to adjust it to your own liking.

For some reason the pagination feature is not working in IE 9 . Is there a fix for this? I’ve tried it on a few different versions of IE and the first and last links work. but the number links do not. Also, is there a way to add a “Next” and “Previous” button to the pagination?

Are there any errors in the JavaScript console?

No, nothing at all. It just simply refreshes the page and displays the same page again regardless of which page number you click. It works perfectly in other browsers.

First off, thanks for creating such a great theme. One question – how do you make this theme fluid width?

Actually, don’t worry I got it figured out :P

Just needed to change the width of the ‘container’ in the main.css file to 100%.

I like the look of this. Simple yet elegant. Most other admin themes on here just try to hard and look bad IMO .

Too bad its not compatible with IE 8 /9. I have to display in compatability mode, this is keeping me from actually buying this.

What’s not working exactly? It should work properly in IE. Could you send me a screenshot?

could you help on how to change the colors of the charts ?

There’s an array of colors available in the application.js file.

jquery.visualize.js the file I changed the colors, but still colors are blue. How do I need to do?

//configuration var o = $.extend({ type: 'bar', //also available: area, pie, line width: $(this).width(), //height of canvas - defaults to table height height: $(this).height(), //height of canvas - defaults to table height appendTitle: true, //table caption text is added to chart title: null, //grabs from table caption if null appendKey: true, //color key is added to chart colors: ['#be1e2d','#666699','#92d5ea','#ee8310','#8d10ee','#5a3b16','#26a4ed','#f45a90','#e9e744'], textColors: [], //corresponds with colors array. null/undefined items will fall back to CSS parseDirection: 'x', //which direction to parse the table data pieMargin: 20, //pie charts only - spacing around pie pieLabelPos: 'inside', lineWeight: 4, //for line and area - stroke weight barGroupMargin: 10, barMargin: 1, //space around bars in bar chart (added to both sides of bar) yLabelInterval: 40 //distance between y labels },options);

You need to edit application.js, not jquery.visualize.js.


great theme. but there’s a problem: the psd file cannot open with gimp or an old photoshop version. it seems that the file is photoshop cs6. can you provide a version which is saved with the “compat option”?

Kind regards

Impossible. I created this theme when CS5 wasn’t even released yet.

hi, ok which photoshop version did you use?

Guess it was CS4 .