3690 comments found

Note on “minified” Menu : On metronic_v2.0.2/admin/template/extra_profile.html sample page menu is set up as “minified” on the left. That’s ok if we want it minimized by default. But as soon as we reduce windows width (< 768px) and increse it again menu appears large.

It could be interesting if menu stick with his initial defined state (minified), and only enlarge when user click on menu link/button), not when user resize window. Is there an easy way to implement it ?

keenthemes

Hi :),

Thanks for reporting this issue. You can fix it by disabling handleSidebarState function in assets/scripts/core/app.js. Just remove this function calls from handleResponsive and handleResponsiveOnInit functions and the issue will be solved. We will include this fix in the next update.

Thanks.

eturas1 Purchased

Hello,

Is wroted that will be LESS Support, maybe is know approximate time for this issue?

Bgr, Paul

keenthemes

Hi :),

We are considering using SASS instead of LESS since bootstrap officially switched to SASS recently. We will inform the approximate timeline later once we have some progress on this. Stay tuned!

Thanks.

djmiha Purchased

Hello,

after upgrading to 2.0.1 we are missing /assets/plugins/jquery-multi-select/js/jquery.quicksearch.js

Regards.

keenthemes

Hi :),

You can get it from https://github.com/riklomas/quicksearch as the latest release did not include jquery.quicksearch.js in the package.

Thanks.

Hello, buying the theme will have access to documentation and examples of using Data Tables Ajax Datatables? It is easy to integrate with Yii?

keenthemes

Hi :),

Yes, the documentation is provided with the theme package. To use the ajax datatables you can refer the demo code and the datatable plugin’s official documentation from http://datatables.net.

If you will have any questions that are not covered in the doc then you can always ask your support via email(support@keenthemes.com).

Thanks.

daczek Purchased

Hello keenthemes!

Your’s brand new Metronic 2.0 is a masterpiece! It’s working like a charm! :)

But I need a little help with tooltips:

<button class=”btn tooltips” data-original-title=”Tooltip in left” data-placement=”left”>Left</button>

How turn on HTML in those tooltips? I’m pretty sure that is safety against XSS but text without html looks bad.

I hope You could help me

Kind regards D.

keenthemes

Hi :),

Thanks for the comment.

You can use data-html=”true” attribute to enabme the html output:

<button class=”btn tooltips” data-original-title=”Tooltip in left” data-placement=”left” data-html="true">Left</button>

For more info you can check the documentation here: http://getbootstrap.com/javascript/#tooltips-usage

Please let me know if you need any further assistance.

Thanks.

Default-user
daczek Purchased

Thanks for fast answer! Of course It’s working great :)! Have a nice day!

keenthemes

Great! You are welcome. Have a nice day too! :)

eakarsu Purchased

Can we merge admin menus into standalone ecommerce package? Currently, ecommerce_index.html,ecommerce_orders.html, ecommerce_products.html etc. are under admin package. Can we move all into ecommerce package?

Thanks

keenthemes

Hi :),

This can be done but you will need to extract the css and js code related to these pages from the admin and integrate it in the frontend theme. However in the next version we are planning to merge all the themes so the features can be shared among the sub themes.

Thanks.

ogcprod Purchased

Hello, what css file I can change the color of visual statistics?

Regards

keenthemes

Hi :),

To change the colors you should refer assets/scripts/custom/index.js and under “initCharts” function you can change the colors(through fillColor & color).

For more info please check the official documentation here: www.flotcharts.org

Thanks.

it would be nice if there was a printer friendly css

keenthemes

Hi :),

You can include below css file for printing right after custom.css:

<link href="assets/css/print.css" rel="stylesheet" type="text/css" media="print"/>

Thanks.

do you have tolltip in input form??

keenthemes

Hi :),

Yes, you can use tooltips with any page element. To use it with inputs please refer below code:

<input type="text" class="form-control tooltips" data-placement="top" data-original-title="Tooltip in top" value="">

For more info you can check: getbootstrap.com/javascript/#tooltips

Thanks.

I am using v1.5, looking to setup the Bootstrap Datepicker, having some issues. Where is there a sample in the Theme of a working date picker? Have not been able to find one. but there are comments about using it, so I am looking for an example?

Jeff

Default-user

Here is my setup – wanting to enable date picker on the non-admin/public template:

4 parts: CSS in head, the form-group and the JS in footer, and the INIT call – trying to get a simple example to work.

CSS in head: <link rel="stylesheet" type="text/css" href="/assets/plugins/bootstrap-datepicker/css/datepicker.css"/>

Form Group in Form:

<div class="form-group"> <label class="control-label col-md-3">Default Datepicker</label> <div class="col-md-3"> <input class="form-control form-control-inline input-medium date-picker" size="16" type="text" value="2014-02-23"/> <span class="help-block"> Select date </span> </div> </div>

IN JS section, just above

<script type="text/javascript" src="/assets/plugins/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>

and then issues, what should be the proper load script: on this sample page: metronic/admin/template_content/form_component.html I tried:

<!--- load page level jQuery stuff ---> <script> jQuery(document).ready(function() { // initiate layout and plugins App.init(); FormComponents.init(); }); </script>

no go…. I really just need to init the datepicker

Default-user

I got this working. Suggestion. The FrontEnd and the Admin themes need to share a common backend or have the option of doing so…. I was missing the date picker in the frontend assets….

keenthemes

Yeah, we are working on this and in the next update this will be possible. Stay tuned! :)

Hello i want to buy this theme because it it perfectly nice in RTL for lot of languages but i do not know example if i buy that, then change all data then after few weeks it comes a new update example 3.0 then if i update my website will i lose all of my data? and my other question is that what is admin them doing i can not understand it because i use WordPress too much and have not much experience in HTML can you help me what admin doing? i mean this page:

http://www.keenthemes.com/preview/index.php?theme=metronic_admin&page=index.html

and will i update my website in here or in dreamwiever? thank you

keenthemes

Hi :),

Thanks for your feedback.

Unlike Wordpress themes Metronic theme does not come with installation tools since its an HTML5 theme mainly used to develop a custom web application such as CMS, CRM, Booking Systems, Admin Panel, multipurpose websites and other type of web applications.

So, to run this theme you will need develop your system from scratch using this theme as a user interface for your system.

I hope the above info will be useful for you. Please let me know if you need any further clarification.

Thanks.

In ‘table_managed.html’, line 2233, you have an error in your inline css style:

<th style=”width1:8px;”>

Should be:

<th style=”width:8px;”>

keenthemes

Hi :),

Thanks for your feedback. Actually style=”width1:8px;” can be ignored. We will remove it in the next update.

Thanks.

Hello, thanks for the awesome template! I have updated from Metronic 1.5.4 to 2.0.2 successfully other than one slight problem that I cannot seem to fix. I am trying to make use of the “Bootstrap Switch” in the components_form_tools.html admin file. I have included all scripts and css files that are required to make the Bootstrap Switches work correctly. However, although they work, they are not being displayed properly and I cannot seem to figure out what is causing them to be displayed like this:

Can you please help me out? They were working properly for me with Metronic 1.5.4 but after the upgrade I did they are no longer displaying correctly. Any help is appreciated!

HEADER HTML

<!-- BEGIN PACE PLUGIN FILES -->
    <script src="assets/plugins/pace/pace.min.js" type="text/javascript"></script>
    <link href="assets/plugins/pace/themes/pace-theme-flash.css" rel="stylesheet" type="text/css"/>
    <!-- END PACE PLUGIN FILES -->
    <!-- BEGIN GLOBAL MANDATORY STYLES -->
    <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700&subset=all" rel="stylesheet" type="text/css"/>
    <link href="assets/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
    <link href="assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
    <link href="assets/plugins/uniform/css/uniform.default.css" rel="stylesheet" type="text/css"/>
    <!-- END GLOBAL MANDATORY STYLES -->
    <!-- BEGIN PAGE LEVEL STYLES -->
    <link rel="stylesheet" type="text/css" href="assets/plugins/bootstrap-fileinput/bootstrap-fileinput.css"/>
    <link rel="stylesheet" type="text/css" href="assets/plugins/bootstrap-switch/css/bootstrap-switch.min.css"/>
    <link rel="stylesheet" type="text/css" href="assets/plugins/jquery-tags-input/jquery.tagsinput.css"/>
    <link rel="stylesheet" type="text/css" href="assets/plugins/bootstrap-markdown/css/bootstrap-markdown.min.css">
    <link rel="stylesheet" type="text/css" href="assets/plugins/typeahead/typeahead.css">
    <!-- END PAGE LEVEL STYLES -->
    <!-- BEGIN THEME STYLES -->
    <link href="assets/css/style-metronic.css" rel="stylesheet" type="text/css"/>
    <link href="assets/css/style.css" rel="stylesheet" type="text/css"/>
    <link href="assets/css/style-responsive.css" rel="stylesheet" type="text/css"/>
    <link href="assets/css/plugins.css" rel="stylesheet" type="text/css"/>
    <link href="assets/css/themes/light.css" rel="stylesheet" type="text/css" id="style_color"/>
    <link href="assets/css-custom/custom.css" rel="stylesheet" type="text/css"/>
    <!-- END THEME STYLES -->
<link href="assets/css/pages/profile.css" rel="stylesheet" type="text/css" />

BOOTSTRAP SWITCH HTML

<div class="form-group">
                                                        <label>Carbon Copy Emails</label>
                                                                <input type="checkbox" class="make-switch" checked data-on="primary" data-off="default">
                                                            </div>

FOOTER HTML

<!-- BEGIN JAVASCRIPTS(Load javascripts at bottom, this will reduce page load time) -->
    <!-- BEGIN CORE PLUGINS -->
    <!--[if lt IE 9]>
        <script src="assets/plugins/respond.min.js"></script>
        <script src="assets/plugins/excanvas.min.js"></script> 
        <![endif]-->
    <script src="assets/plugins/jquery-1.10.2.min.js" type="text/javascript"></script>
    <script src="assets/plugins/jquery-migrate-1.2.1.min.js" type="text/javascript"></script>
    <script src="assets/plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
    <script src="assets/plugins/bootstrap/js/bootstrap2-typeahead.min.js" type="text/javascript"></script>
    <script src="assets/plugins/bootstrap-hover-dropdown/bootstrap-hover-dropdown.min.js" type="text/javascript"></script>
    <script src="assets/plugins/jquery-slimscroll/jquery.slimscroll.min.js" type="text/javascript"></script>
    <script src="assets/plugins/jquery.blockui.min.js" type="text/javascript"></script>
    <script src="assets/plugins/jquery.cokie.min.js" type="text/javascript"></script>
    <script src="assets/plugins/uniform/jquery.uniform.min.js" type="text/javascript"></script>
    <!-- END CORE PLUGINS -->
    <!-- BEGIN PAGE LEVEL PLUGINS -->
    <script type="text/javascript" src="assets/plugins/fuelux/js/spinner.min.js"></script>
    <script type="text/javascript" src="assets/plugins/bootstrap-fileinput/bootstrap-fileinput.js"></script>
    <script type="text/javascript" src="assets/plugins/jquery-inputmask/jquery.inputmask.bundle.min.js"></script>
    <script type="text/javascript" src="assets/plugins/jquery.input-ip-address-control-1.0.min.js"></script>
    <script src="assets/plugins/jquery.pwstrength.bootstrap/src/pwstrength.js" type="text/javascript"></script>
    <script src="assets/plugins/bootstrap-switch/js/bootstrap-switch.min.js" type="text/javascript"></script>
    <script src="assets/plugins/jquery-tags-input/jquery.tagsinput.min.js" type="text/javascript"></script>
    <script src="assets/plugins/bootstrap-maxlength/bootstrap-maxlength.min.js" type="text/javascript"></script>
    <script src="assets/plugins/bootstrap-touchspin/bootstrap.touchspin.js" type="text/javascript"></script>
    <script src="assets/plugins/typeahead/handlebars.min.js" type="text/javascript"></script>
    <script src="assets/plugins/typeahead/typeahead.min.js" type="text/javascript"></script>
    <!-- END PAGE LEVEL PLUGINS -->
    <!-- BEGIN PAGE LEVEL SCRIPTS -->
    <script src="assets/scripts/core/app.js"></script>
    <script src="assets/scripts/custom/components-form-tools.js"></script>
    <!-- END PAGE LEVEL SCRIPTS -->
<script>
        jQuery(document).ready(function() {       
           // initiate layout and plugins
           App.init();
           ComponentsFormTools.init();
        });   
    </script>
keenthemes

Hi :),

Will it be possible to email us(support@keenthemes.com) a link to your page ? We will need to check your source code(css, js files) in order to advise you further.

Thanks.

Hi,

My swf is not loading. When i remove <!DOCTYPE html> from header its loading properly. But without <!DOCTYPE html> font size and other style are distorting.

Can you tell me how i can use flash object with your template?

Thanks

keenthemes

Hi :),

You can check this library to object swf contents in your page: https://code.google.com/p/swfobject/

Thanks.

Can I have a separate div with website logo before the header on the top? I mean an image logo first on the top and then navigational menu. How do I do it?

keenthemes

Hi :),

Yes, you can do that. But you will need to apply your own css to adjust that div properly. You can put your own css in assets/css/style.css.

Thanks.

Hi,

When I print using the INVOICE extra page, the header and footer appears on the printed page (url of the page, etc…).

Could you tell me how to remove that on printing? Thank you in advance,

Excellent job by the way, the new e-commerce is stunning

keenthemes

Hi :),

Please note that url on the page is controlled in the browser settings. Please check below discussion on the related topic:

http://stackoverflow.com/questions/12276132/how-to-remove-url-displayed-while-printing-a-web-page-in-php http://stackoverflow.com/questions/13136863/remove-url-and-print-text-from-the-printed-page

Please let me know if you need any further clarifications.

Thanks.

kiroman Purchased

Login-Soft problem:

When click on “Login” the data is posted to my PHP script – everything fine.

But: When I just hit Enter, nothing happens, no data gets posted.

Where is the bug? Thank you!

P;S; I saw you answered same problem 8 months ago – with solution to fix something in the login-soft.js – I checked but everything is already as you described- I think(?) So sorry to post the Question again

keenthemes

Hi :),

May i know what version of Metronic are you using ? Could you please give a link to your page ? Or at least send your html and login-soft.js files for us to check your code and advise your further. You can send the details to our support at support@keenthemes.com.

Thanks.

Default-user
kiroman Purchased

you got mail-thank you!

keenthemes

Noted. We will check and reply you shortly :)

turkyl Purchased

Hello,

In UI Features – Tree View – Default Tree, there’s a node [Root node 2] with an external link that doesn’t work (at least on Google Chrome). It does nothing when I click on it (I’m trying on your preview).

Great theme! Thank you!

keenthemes

Hi :),

You can use below work around to allow the link clicks. Just add the below code under “handleSample1” function right after ” $(’#tree_1’).jstree()” in assets/scripts/custom/ui-tree.js:

        // handle link clicks in tree nodes(support target="_blank" as well)
        $('#tree_1').on('select_node.jstree', function(e,data) { 
            var link = $('#' + data.selected).find('a');
            if (link.attr("href") != "#" && link.attr("href") != "javascript:;" && link.attr("href") != "") {
                if (link.attr("target") == "_blank") {
                    link.attr("href").target = "_blank";
                }
                window.open(link.attr("href"));
                return false;
            }
        });

Please let me know if you need any further assistance.

Thanks.

Default-user
turkyl Purchased

Hi,

The link clicks are now working, but it has also changed the styles and the possibility of expanding and collapsing the child items doesn’t work anymore.

Can this be fixed?

keenthemes

Hi,

Please double check your HTML code where you construct the tree. Adding the above JS code should not impact to the tree style. Below complex tree structure works fine after adding the above JS code(you can test it by just replacing the Default Tree with the below code):

<div id="tree_1" class="tree-demo">
    <ul>
        <li>
            Root node 1
            <ul>
                <li data-jstree='{ "selected" : true }'>
                    <a href="#">
                    Initially selected
                    </a>
                </li>
                <li data-jstree='{ "icon" : "fa fa-briefcase icon-success " }'>
                    custom icon URL
                </li>
                <li data-jstree='{ "opened" : true }'>
                    initially open
                    <ul>
                        <li data-jstree='{ "disabled" : true }'>
                            Disabled Node
                        </li>
                        <li data-jstree='{ "type" : "file" }'>
                            Another node
                        </li>
                    </ul>
                </li>
                <li data-jstree='{ "icon" : "fa fa-warning icon-danger" }'>
                    Custom icon class (bootstrap)
                </li>
            </ul>
        </li>
        <li data-jstree='{ "type" : "folder" }'>
            <a href="http://www.jstree.com">
            Root node 2
            </a>
            <ul>
                <li data-jstree='{ "selected" : true }'>
                    <a href="#">
                    Initially selected
                    </a>
                </li>
                <li data-jstree='{ "icon" : "fa fa-briefcase icon-success " }'>
                    custom icon URL
                </li>
                <li data-jstree='{ "opened" : true }'>
                    initially open
                    <ul>
                        <li data-jstree='{ "disabled" : true }'>
                            Disabled Node
                        </li>
                        <li data-jstree='{ "type" : "file" }'>
                            Another node
                        </li>
                    </ul>
                </li>
                <li data-jstree='{ "icon" : "fa fa-warning icon-danger" }'>
                    Custom icon class (bootstrap)
                </li>
            </ul>
        </li>
    </ul>
</div>

If you need our further assistance please give a link to your page or send us your html/js code so we can check your code and advise you further. You can send the details to your support at support@keenthemes.com.

Thanks.

Hi! When be a wordpress version?

keenthemes

Hi :),

At the moment we are planning to focus only on HTML version. Maybe in the next feature we can consider the WP versions. Stay tuned ;)

Thanks.

Thanks for great theme. Can we have LESS file for easier customize new color theme? Or we have to extend license for this?

keenthemes

Hi :),

The LESS files are not available. At the moment we are working on SASS files(sass-lang.com) and we are planning to release it in the next update soon so it will be available for both regular and extended licenses.

Stay tuned and follow us on http://twitter.com/keenthemes.

Thanks.

Default-user

Both of SASS or LESS are cool. Thanks for your updated.

keenthemes

Sure. You are most welcome :)

by
by
by
by
by
by