TheThemeio does not currently provide support for this item.

141 comments found.

Hi, when the new update with bootstrap 3 is coming earliest?

Yeah, It’s under development and will release in next few days

jquery active class to menu item based on current url for sidebar

<script> $(document).ready(function() { $('#sidebar a').each(function() { var location = window.location.href; var link = this.href; if (location == link) { $(this).parents('li').addClass('active'); } }); }); </script>

Thank you :)

suport for ie8? i tried in windows 8 wich is shipped with windows 7 and is not working ok. i was surprised to see that is not ok. one thing to not support ie6 for windows xp and another ie7 or ie8 at least. petty. i love this theme

Look at this page’s sidebar in IE8: IE8 Blank Page
This is what I can offer you to support in IE8. If this is what you want, email me (from my profile contact form) after purchase and I’ll send you files that you need

hello. thanks for the efort and sorry for the delay. i was away. i have checked the link and almost perfect – some fine tunning if you can: -when i colapse the left navbar, the content of the page wich is blue doesn’t follow instant the colapse. instead, it stays in int’s position, we see a white area where the expanded menu was, and the blue background of page will folow if move the mouse over the page -in expand/colapse, we see a white triangle pointing to the link of the menu. that is ok when expanded but when i colapse the menu, it stays visible and partial distorted untill i hover over the icon of that colapsed link. so again a delay in the action

so, based on these remarks and your work, i would like to know: 1. will you implement the fix in the oficial download (i belive is in your interest to mark it as compatible with ie8 as well) 2. version 2 will include the fix for ie8 as well? 3. can you try to adjust menu action so that the delay mentioned is gone? thanks

About that delays, I think that is because of IE8 problem with :before and :after css pseudo-elements. I can’t fix this!
1. No, this fix is just for sidebar, not other part of theme, so I can’t mark this as compatible with ie8.
2. Nope, this fix is just for you!
3. As I mentioned before, this fix need changes in html and maybe how it’ll show, so I can’t spend more time for this issue anymore.

Hi, this template is very nice and very complete.

I just want to ask if is possible to implement, in the next version, the sort header in regular tables (to program server side sort) such as exists in the dynamic table.

Hi, Thank you
Yes, it is a good suggestion, I’ll add this in next release ;)

Hello, I’m starting new project, one quick question: Should I wait till new version be released or i can start templating my backend now and then migrate?

No, you can not migrate from version 1 to 2! I mean it’s very hard, bootstrap 3.0 is very different from bootstrap 2.3.
FLATY v2.0 is almost ready, I should update it’s documentation and some more test. New version will release in 2-3 days later

Great! This template is mind blowing btw!

It is planned to release in the update menu of the third level?

Ok, I’ll add this in version 2.1

Well, when the planned release of a new version?

ummm, It’s highly depend on bug reports, but I usually release new update between 3-4 week

When you are going to release v2 using bootstrap 3? We are desperately waiting for next release as we need to implement asap.

It has been released!

google maps not working in live preview?

Sorry, JS error in minified version of demo. It’s ok now

Thank you for the mega update!!!! But I haven’t found a document with the instructions to upgrade the new version from the old one!

Thanks Fabio

Yeah, this is mega update because of bootstrap 3 !
You can’t upgrade from version 1 to 2! Version 2 has a lot of change in css and html file. Upgrade is not easy as you think. Actually there is no way to upgrade automatically (find and replace), you should see correspondence code in version 1 and 2 of FLATY to find out how to do change in version 1. But first of all, you must begin from HERE and upgrade your code to bs 3 classes.

Just purchased the theme and really enjoying it. I do have a question (possible bug) though. What is supposed to happen to the alert icons when viewing on a smaller screen? In my testing, they disappear.

I tried on my iPhone/Safari and shrinking down Win 7/Firefox. Looking at the code, it looks like they should appear in the admin user drop down. But for some reason they are not showing up.

Can you look into this?


Sorry, my bad ! You should change .visible-sm to .visible-xs in #user_menu to fix this bug.

Answered my own question. The main nav buttons are “hidden-xs”, but the short form version is “visible-sm”. So there is a size where both are visible (sm), and at (xs) they both vanish. I changed the “visible-sm” to “visible-xs” and all works fine. A fix for next release?

Yeah, I’ll fix this problem in next release

Hi ShaMSofT, thanks for the awesome theme. Just wanted to ask you are there different margins on the tables from the tiles. I am looking to do a 10 col div for a table with 2col beside it for tiles all in the same row. I noticed the table is lower than the tile on the right. Am I marking the HTML wrong or is it just the CSS that is different. Thanks

Thats great thank you. I have done all you said and works ok but, why does the sidebars background then stay when i scroll across to the right? Within the body I have a #wrapper div and then my css is

@media (max-width: 683px) {
        min-width: 683px!important;

Sorry but sidebar has a absolute position with a fixed :before element. This is because of that sidebar’s background color should expand to whole page’s height.
If you want to resolve this problem, maybe you should remove ”#sidebar:before” selector from flaty.css, but your sidebar background…
I think you need to lots of change in css file and even maybe in html file to reach your aim! We didn’t had any plan to have something like this.

Ahh no worries, thanks for your help. Cheers

Hey there, great theme!

Have a few bugs/questions. 1) I have a sidebar with collapsible items. If number of li elements in submenu is large enough, they go down off the screen (when I expand the item). However, if height of main-content is not enough, I cannot scroll the sidebar down to see all elements. This bug disappears if I resize the window.

2) If I resize the screen’s width to the least possible value, sidebar goes to the top of the page. And again, if height of main-content is not enough and I expand an item of sidebar, only few elements of submenu are shown, and I cannot scroll it down to see others. Same happens on mobile devices

3) I have a page with a few boxes one under the other (so this page is scrollable). If I click somewhere in the box which is at the bottom of the screen then under certain zooms (90%, 110%) scroll bar disappears and page doesn’t scroll at all. I have to click in the other box to make it work again. This bug does not disappear if I resize the window.

4) Is there a way I can make the font-size a bit larger?

Open flaty.js, find ”//Submenu dropdown” and edit it to become like this:
//Submenu dropdown
$('#sidebar a.dropdown-toggle').click(function() {
    submenu.slideToggle(400, function(){
        $('html').height(($('#sidebar').height() + 40) + 'px'); //--> Added code line
    $("html").getNiceScroll().resize(); //--> Added code line
This will fix bug 1, 2 and maybe 3.
Actually, bug 3 did not produce in my tests! This is very helpful if you could give me a user & pass in your online app.
Thanks for video :)

Hi, how can I send you a private message with login and pass?

By contact form in my profile:

First, I would like to say that I very like this theme. I have one question: Is it possible to setup box default “hidden”

Best Regards.

You mean collapsed box or totally hidden box ?
For collapsed box, look at last box in box.html
Hidden box can be achieve by adding .hide class to your box

I mean collapsed. I’ve found it already. Thank you for answere.

Can I make a suggestion for future releases? Please move any “example” data out of the main flaty.js file and into it’s own separate file?

Having it all lumped into one file makes it very difficult to know which is part of the template and what is filler so the template has data.


Good suggestion, I’ll do this
Thanks ;)

Hi just wanted to let you know there is a typo on line 3240 of flaty.css.

It is currently:

b/order-left-color: #e5e5e5;

Yeah I forgot to remove it, Thanks

Is there an option to have a horizontal menu rather than a sidebar menu?

Presume its trivial to set fixed width?

No, there is not any plan to add horizontal menu

Is there any way to stop teh scroll breaking on a wizard form page. It seems that if the content on the first wizard tab isn’t long enough to activate the vertical scroll bar then on the following tabs the scroll bar is also disabled even if the form is long and requires scrolling.

Also on form layout page you have a typo -> “Tow Column Form”

Thanks, sorry for all the questions

Is there a built in function that allows me to auto populate the confirm page on the wizard or do I just have to build it myself?

No, there isn’t any auto populate for confirm page

I found a couple bugs regarding “Static control” form elements. You don’t show them anywhere in your demo, but I’d hope you could fix these. 1) When using the class “form-bordered”, the vertical stripe does not show up. Only the horizontal stripe appears. 2) The label and the static text do not line up. The label sinks to the bottom of the row, while the text is centered vertically.

I would appreciate it if you could make a fix for these.


1) But we have both of horizontal and vertical lines in our demo! look at form_layout.html, “Bordered Form” box. Check your code, maybe you did something wrong.
2) You should wrap static text in .form-control-static class:
<div class="form-group">
    <label class="col-xs-3 col-lg-2 control-label">Label</label>
    <div class="col-sm-9 col-lg-10 controls">
        <p class="form-control-static">Something...</p>

Yes, it was a bug in my code. Was missing the “controls” class in the div. Thanks

I have found a bug regarding the search bar on iPad 2 and 4. The magnifying glass on the left is moved to the right about 5px and pushes the search input down. It only seems to appear on the mobile safari browser but not on the desktop browser. I can’t figure out what is actually happening

Yeah, safari browser has not any css-hack, so we cann’t change padding and margin without effect on other browsers, Change in the width is the best solution.

Thanks, also when the site is responsive and you select the navigation toggle, if you then select the user/profile link the box will drop down behind it. Is there a way to make it appear in front or to close the navigation first? Thanks

Open flaty-responsive.css, find #sidebar and change z-index property to 989

Not a bug per se, but I found an annoyance that I hope you can help with. I am trying to combine the “chosen” select drop down with tabs.

Unfortunately, due to how tabs work I’m guessing, any time “chosen” is used on a non-active tab, it’s width gets set to nothing. So when I switch from the primary tab to any other tab, you cannot read the drop down.

If this doesn’t make sense, I created a test html document I can email.

Do you know of a work around for this? I’d love to be able to use “chosen” for my drop downs.


If you created a html file, email me to check it. Use contact form in my profile page.

It took a bit of research but there is a known “issue” where if the chosen select is not shown when the screen is first rendered, it will have an effective width of 0px. To get around this, you need to force a width on the field. I did it by putting it in the default options for chosen, but it can also be hard coded as a style on the field itself.

Posted here so everyone can see the work around.

Thank you