Hi ,

It was moved to www.keenthemes.com/preview/metronic/theme/templates/admin/components_form_tools.html

If you need any further assistance please let us know.

To stay updated on Metronic’s new releases please follow us on http://twitter.com/keenthemes

Thanks.

Hi ,

Could you please provide more details ? What was the issue ? What is your device model and browser version ?

Thanks.

Sure, it’s a Samsung S4, browser is the default … I don’t know the name thanks

Hi ,

Yes, you can check it here:

To stay updated on Metronic’s new releases please follow us on http://twitter.com/keenthemes

Thanks.

Hi ,

If you want to use it for a new project then you will need to purchase a new license. Please note one license(27$) is limited to one end product and client. If you need to use the theme for more products or clients you will need to purchase equivalent number of licenses.

For more info please check themeforest.net/licenses/standard?license=regular

To stay updated on Metronic’s new releases please follow us on http://twitter.com/keenthemes

Thanks.

Hi ,

1) Yes, you should be able to use the X-Editable or any other components in Draggable Portlets.

2) Please refer below code to fully translate the datatable to your language(refer to “Internationalisation” comment below):

    var initTable1 = function() {
        var table = $('#sample_1');

        /* Table tools samples: https://www.datatables.net/release-datatables/extras/TableTools/ */

        /* Set tabletools buttons and button container */

        $.extend(true, $.fn.DataTable.TableTools.classes, {
            "container": "btn-group tabletools-dropdown-on-portlet",
            "buttons": {
                "normal": "btn btn-sm default",
                "disabled": "btn btn-sm default disabled" 
            },
            "collection": {
                "container": "DTTT_dropdown dropdown-menu tabletools-dropdown-menu" 
            }
        });

        var oTable = table.dataTable({

            // Internationalisation. For more info refer to http://datatables.net/manual/i18n
            "language": {
                "aria": {
                    "sortAscending": ": activate to sort column ascending",
                    "sortDescending": ": activate to sort column descending" 
                },
                "emptyTable": "No data available in table",
                "info": "Showing _START_ to _END_ of _TOTAL_ entries",
                "infoEmpty": "No entries found",
                "infoFiltered": "(filtered1 from _MAX_ total entries)",
                "lengthMenu": "Show _MENU_ entries",
                "search": "Search:",
                "zeroRecords": "No matching records found" 
            },

            "order": [
                [0, 'asc']
            ],

            "lengthMenu": [
                [5, 15, 20, -1],
                [5, 15, 20, "All"] // change per page values here
            ],
            // set the initial value
            "pageLength": 10,

            "dom": "<'row' <'col-md-12'T>><'row'<'col-md-6 col-sm-12'l><'col-md-6 col-sm-12'f>r><'table-scrollable't><'row'<'col-md-5 col-sm-12'i><'col-md-7 col-sm-12'p>>", // horizobtal scrollable datatable

            // Uncomment below line("dom" parameter) to fix the dropdown overflow issue in the datatable cells. The default datatable layout
            // setup uses scrollable div(table-scrollable) with overflow:auto to enable vertical scroll(see: assets/global/plugins/datatables/plugins/bootstrap/dataTables.bootstrap.js). 
            // So when dropdowns used the scrollable div should be removed. 
            //"dom": "<'row' <'col-md-12'T>><'row'<'col-md-6 col-sm-12'l><'col-md-6 col-sm-12'f>r>t<'row'<'col-md-5 col-sm-12'i><'col-md-7 col-sm-12'p>>",

            "tableTools": {
                "sSwfPath": "../../assets/global/plugins/datatables/extensions/TableTools/swf/copy_csv_xls_pdf.swf",
                "aButtons": [{
                    "sExtends": "pdf",
                    "sButtonText": "PDF" 
                }, {
                    "sExtends": "csv",
                    "sButtonText": "CSV" 
                }, {
                    "sExtends": "xls",
                    "sButtonText": "Excel" 
                }, {
                    "sExtends": "print",
                    "sButtonText": "Print",
                    "sInfo": 'Please press "CTR+P" to print or "ESC" to quit',
                    "sMessage": "Generated by DataTables" 
                }]
            }
        });

        var tableWrapper = $('#sample_1_wrapper'); // datatable creates the table wrapper by adding with id {your_table_jd}_wrapper

        tableWrapper.find('.dataTables_length select').select2(); // initialize select2 dropdown
    }

3) This is just an image. Please refer to assets/global/plugins/dropzone/images folder and edit the image in your language.

If you need any further assistance please let us know.

To stay updated on Metronic’s new releases please follow us on http://twitter.com/keenthemes

Thanks.

Thank´s a lot. I will check it out!

Hi ,

Can you please deploy your developing site in test server and provide us a link ? We will need to check and inspect your code online in order to advise you further. Any further details can be sent to our support at support@keenthemes.com

To stay updated on Metronic’s new releases please follow us on http://twitter.com/keenthemes

Thanks.

Hi ,

This layout option is not officially supported. To implement this you will need to do major changes in the header part. You can use custom.css to override the current layout and have it according to your requirements. You can use Chrome Dev Tools to learn the current css code for the header and override it in custom.css.

If you need any further clarifications please let us know.

To stay updated on Metronic’s new releases please follow us on http://twitter.com/keenthemes

Thanks.

All sorted – thank you

Great! Good luck with your project!

Hi ,

There is no “Contact” block. Its designed to scroll to the footer part where contact info is displayed.

If you need any further assistance please let us know.

To stay updated on Metronic’s new releases please follow us on http://twitter.com/keenthemes

Thanks.

Hi ,

At the moment we can’t give any clear ETA for this. We will check it further and consider it in a future releases.

To stay updated on Metronic’s new releases please follow us on http://twitter.com/keenthemes

Thanks.

Hi ,

Thanks for informing this issue. We will check your solution and include it the next update.

To stay updated on Metronic’s new releases please follow us on http://twitter.com/keenthemes

Thanks,

Hi ,

There is no initialization code for the ckeditor samples. We used the default class “ckeditor” to get the demo editors initialized automatically. You can apply a different class and add your own initialization code refering the ckeditor documentation.

<textarea class=" form-control" name="editor1" rows="6"></textarea>

To stay updated on Metronic’s new releases please follow us on http://twitter.com/keenthemes

Thanks.

Hi ,

You can refer to this page http://keenthemes.com/preview/metronic/theme/templates/admin2/layout_blank_page.html with minimum required js and css files. The rest plugins you can remove from “assets/global/plugins/” folder to have a basic theme without all the plugins.

If you need any further assistance please let us know.

To stay updated on Metronic’s new releases please follow us on http://twitter.com/keenthemes

Thanks.

Hi ,

Metronic is not a fully functional web app. Metronica is just an HTML theme(HTML, JS & CSS) that can be used to develop a custom web applications from scratch. Any special features(adding pages, customizing calendars, etc) are responsibility of buyers since Metronic does not include the server side implementation.

If you need any further clarifications please let us know.

To stay updated on Metronic’s new releases please follow us on http://twitter.com/keenthemes

Thanks.

Hi ,

Please check/debug your site on local using Chromes Dev Tools(CTRL+SHIFT+J) and you will be able to see possible errors under console tab. I suspect required js and css files are not being loaded proper due to improper path.

If you need any further clarifications please let us know.

Thanks.

Thanks… It was a silly one – browser cache issue . It is resolved now.

Happy to hear that Good luck with your project!

Hi ,

Thanks.

I had requested an extended download limit a few hours ago,will it work? Eager to get the template . thanks.

Yes, I hope the Envato support can help you out!

Hi ,

Did you copy paste the code from browser’s code inspector ? If so, please revert it back and refer to the original HTML code from the html templates. The customized checkbox and radio buttons wrapped with some extra DIVs initialized on page load by uniformjs pluigin. So please refer to the initial code in the source of form_controls.html template.

If you need any further assistance please let us know.

Thanks.

Thank you! It work perfectly! But now I’m with another problem, I put a date-picker on the form and it didn’t work. I’ve already configure all the dependency files, but nothing works…

Hi,

Are you getting any JS error in the console ? Please double check your code and make sure you included below js and css files to use the datepicker plugin:

<link rel="stylesheet" type="text/css" href="../../assets/global/plugins/bootstrap-datepicker/css/datepicker3.css"/>
<script type="text/javascript" src="../../assets/global/plugins/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>

Then to initialize the datepicker input you should follow below code:

HTML:

<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 my-date-picker" size="16" type="text" value=""/>
        <span class="help-block">
        Select date </span>
    </div>
</div>

<script>
        jQuery(document).ready(function() {
               // Core initialization 
               Metronic.init(); // init metronic core components(mandatory)
               Layout.init(); // init current layout(mandatory)
               QuickSidebar.init(); // init quick sidebar(optional)
               Demo.init(); // init demo features(optional)

               // Datepicker initialization
               $('.my-date-picker').datepicker({
                   orientation: "left",
                   autoclose: true
                });
        });
</script>

To stay updated on Metronic’s new releases please follow us on http://twitter.com/keenthemes

Thanks.

Hi ,

Thanks for reporting this issue. We will fix it in the next update. In the main time to fix it you need to change the “portlet remove” handler under “handlePortletTools” with below code:

        // handle portlet remove
        $('body').on('click', '.portlet > .portlet-title > .tools > a.remove', function(e) {
            e.preventDefault();
            var portlet = $(this).closest(".portlet");

            if ($('body').hasClass('page-portlet-fullscreen')) {
                $('body').removeClass('page-portlet-fullscreen');
            }

            portlet.find('.portlet-title .fullscreen').tooltip('destroy'); 
            portlet.find('.portlet-title > .tools > .reload').tooltip('destroy');
            portlet.find('.portlet-title > .tools > .remove').tooltip('destroy');
            portlet.find('.portlet-title > .tools > .config').tooltip('destroy');
            portlet.find('.portlet-title > .tools > .collapse, .portlet > .portlet-title > .tools > .expand').tooltip('destroy');

            portlet.remove();
        });

If you need any further assistance please let us know.

To stay updated on Metronic’s new releases please follow us on http://twitter.com/keenthemes

Thanks.

Hi,

Sorry, that was bad formatting. Please refer to below code.

You should run it on page load:

<script>
        jQuery(document).ready(function() {
               // Core initialization 
               Metronic.init(); // init metronic core components(mandatory)
               Layout.init(); // init current layout(mandatory)
               QuickSidebar.init(); // init quick sidebar(optional)
               Demo.init(); // init demo features(optional)

               // Init alert on page load
               Metronic.alert({
                container: $('#my_alert_container'), // alerts parent container(if value is not set then it places the alert after the page breadcrumbs)
                type: 'success',  // "succes", "danger", "warning" or "info" 
                message: "I am an alert!",  // alert's message
                close: true, // make alert closable
                focus: true, // auto scroll to the alert after shown
                closeInSeconds: 5 // auto close in 5 seconds
                icon: "bullhorn" // name part of the fontawesome icon class(e.g: fa-bullhorn)
});

        });
</script>

Also you should place a DIV with “my_alert_container” ID where you want to place the alert:

<div id="my_alert_container">
</div>

Thanks.

Uncaught ReferenceError: Metronic is not defined 

Metronic.init();

    <!-- Load javascripts at bottom, this will reduce page load time -->
    <!-- BEGIN CORE PLUGINS (REQUIRED FOR ALL PAGES) -->
    <!--[if lt IE 9]>
    <script src="/assets/global/plugins/respond.min.js"></script>
    <![endif]-->
    <script src="/assets/global/plugins/jquery-1.11.0.min.js" type="text/javascript"></script>
    <script src="/assets/global/plugins/jquery-migrate-1.2.1.min.js" type="text/javascript"></script>
    <script src="/assets/global/plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
    <script src="/assets/frontend/layout/scripts/back-to-top.js" type="text/javascript"></script>
    <!-- END CORE PLUGINS -->

    <!-- BEGIN PAGE LEVEL JAVASCRIPTS (REQUIRED ONLY FOR CURRENT PAGE) -->
    <script src="/assets/global/plugins/fancybox/source/jquery.fancybox.pack.js" type="text/javascript"></script>
    <script src="/assets/global/plugins/bootbox/bootbox.min.js" type="text/javascript"></script>
    <script src="/assets/global/plugins/bootstrap-toastr/toastr.min.js"></script>
    <script src="/assets/admin/pages/scripts/ui-alert-dialog-api.js"></script>

    <!-- pop up -->
    <script src="/assets/global/plugins/uniform/jquery.uniform.min.js" type="text/javascript"></script>

    <script src="/assets/frontend/layout/scripts/layout.js" type="text/javascript"></script>
    <script type="text/javascript">
        jQuery(document).ready(function () {
            Layout.init();
            Layout.initUniform();
            Layout.initTwitter();
        });
    </script>
    <!-- END PAGE LEVEL JAVASCRIPTS -->

    <script>
        jQuery(document).ready(function () {
            // Core initialization 
            Metronic.init(); // init metronic core components(mandatory)
            Layout.init(); // init current layout(mandatory)
            QuickSidebar.init(); // init quick sidebar(optional)
            Demo.init(); // init demo features(optional)

            // Init alert on page load
            Metronic.alert({
                container: $('#my_alert_container'), // alerts parent container(if value is not set then it places the alert after the page breadcrumbs)
                type: 'success',  // "succes", "danger", "warning" or "info" 
                message: "I am an alert!",  // alert's message
                close: true, // make alert closable
                focus: true, // auto scroll to the alert after shown
                closeInSeconds: 5, // auto close in 5 seconds
                icon: "bullhorn" // name part of the fontawesome icon class(e.g: fa-bullhorn)
            });

        });
    </script>

Before layout.js please try to include metronic.js as shown below:

<script src="../../assets/global/scripts/metronic.js" type="text/javascript"></script>
<script src="/assets/frontend/layout/scripts/layout.js" type="text/javascript"></script>

Hi ,

Looks really cool. Well done! Good luck with your project!

Thanks.

Hi ,

Yes, you can create a custom timeline colors by adding below css code in custom.css:

/* My color*/
.timeline li.timeline-custom .timeline-body:after {
  border-right-color: #ffb848;
}

.timeline li.timeline-custom .timeline-body {
  background: #ffb848;
}

.timeline li.timeline-custom .timeline-time span.time {
  color: #ffb848;
}

.timeline li.timeline-custom .timeline-body:after {
    border-right-color: transparent;
    border-bottom-color: #ffb848;
}

If you need any further assistance please let us know.

To stay updated on Metronic’s new releases please follow us on http://twitter.com/keenthemes

Thanks.